Framework Angular

Programar en Angular desde Android

En este post te mostraré cómo editar y crear proyectos de Angular desde tu móvil o tableta con Android.

No vas a usar emuladores o cosas así, realmente podrás usar Angular en tu teléfono o dispositivo móvil.

Vamos a lograr esto usando NPM y Node.js, mismos que se pueden instalar en Termux.

Y como la CLI de Angular es solo un paquete más, podremos instalarla en nuestro teléfono parar crear y compilar proyectos de Angular.

Requisitos

Necesitas una tableta o móvil con Android. Sigue las instrucciones de mi post para instalar Termux y una vez que lo hayas instalado procede a seguir el tutorial para instalar Node en Android.

Para probar que todo va bien, escribe npm -v en Termux, y si todo va bien debe aparecerte un número igual o mayor a 6.14.10.

Instalando la CLI de Angular

Siguiendo las instrucciones de la página oficial procede a instalar la CLI con:

npm install -g @angular/cli

En mi caso he elegido que No cuando el asistente me preguntó si quería compartir datos de uso anónimos. Todo eso se ve en la siguiente captura:

Instalando la CLI de Angular en Android con Termux y NPM

Ahora ya tenemos el comando ng y la CLI de Angular en nuestro móvil Android. Es momento de crear un proyecto.

Crear proyecto de Angular desde Android

En la misma consola escribimos:

ng new nombre-de-la-app

En mi caso se ve así:

Creando aplicación de Angular con ng new usando Android

También va a comenzar a instalar los paquetes propios de Angular a través de NPM. Una vez que esté listo debemos navegar hacia esa carpeta, para ello escribimos cd nombre-de-la-app y una vez dentro ejecutamos ng serve como se ve en la captura:

Sirviendo aplicación de Angular con ng serve en Android

Nota: yo utilicé ls para listar el contenido de la carpeta. Esto no es obligatorio.

Por cierto, el nombre de mi app es app-de-parzibyte, si tú le pusiste otro, cambia los comandos como sea necesario.

Después de un tiempo se mostrará que la app ha sido compilada correctamente y está escuchando en localhost:4200.

Por cierto, si te muestra errores parecidos a los de la captura no te preocupes, es porque no tiene permiso para acceder a ciertos directorios.

Aplicación de Angular compilada correctamente usando móvil

Y si abres el navegador web, verás que la app se está ejecutando.

App web de Angular corriendo en el navegador de Android

Ahora cada que se haga un cambio en los archivos el resultado se va a refrescar en el navegador tal y como si lo hiciéramos en una computadora.

Y así es como podemos programar en Angular desde Android.

¿Cómo editar los archivos?

Para editar los archivos puedes usar cualquier editor de tu agrado, yo solo te puedo recomendar vim ya que es muy simple y se maneja en la terminal.

Me parece que se instala con pkg install vim pero recuerda aprender a usarlo en otro lugar antes de instalarlo en Termux.

En caso de que uses vim recuerda dejar ejecutando ng serve en una terminal, abrir otra y ya desde la nueva editar los archivos. Solo como curiosidad aquí te dejo con una captura de cómo edité un archivo:

Editar componente de Angular desde Android con vim y Termux

Para terminar te dejo con más proyectos de Angular y tutoriales con Termux.

Estoy aquí para ayudarte 🤝💻


Estoy aquí para ayudarte en todo lo que necesites. Si requieres alguna modificación en lo presentado en este post, deseas asistencia con tu tarea, proyecto o precisas desarrollar un software a medida, no dudes en contactarme. Estoy comprometido a brindarte el apoyo necesario para que logres tus objetivos. Mi correo es parzibyte(arroba)gmail.com, estoy como@parzibyte en Telegram o en mi página de contacto

No te pierdas ninguno de mis posts 🚀🔔

Suscríbete a mi canal de Telegram para recibir una notificación cuando escriba un nuevo tutorial de programación.
parzibyte

Programador freelancer listo para trabajar contigo. Aplicaciones web, móviles y de escritorio. PHP, Java, Go, Python, JavaScript, Kotlin y más :) https://parzibyte.me/blog/software-creado-por-parzibyte/

Entradas recientes

Creador de credenciales web – Aplicación gratuita

Hoy te voy a presentar un creador de credenciales que acabo de programar y que…

1 semana hace

Desplegar PWA creada con Vue 3, Vite y SQLite3 en Apache

Ya te enseñé cómo convertir una aplicación web de Vue 3 en una PWA. Al…

2 semanas hace

Arquitectura para wasm con Go, Vue 3, Pinia y Vite

En este artículo voy a documentar la arquitectura que yo utilizo al trabajar con WebAssembly…

2 semanas hace

Vue 3 y Vite: crear PWA (Progressive Web App)

En un artículo anterior te enseñé a crear un PWA. Al final, cualquier aplicación que…

2 semanas hace

Errores de Comlink y algunas soluciones

Al usar Comlink para trabajar con los workers usando JavaScript me han aparecido algunos errores…

2 semanas hace

Esperar promesa para inicializar Store de Pinia con Vue 3

En este artículo te voy a enseñar cómo usar un "top level await" esperando a…

2 semanas hace

Esta web usa cookies.