Angular es un framework para aplicaciones web desarrollado en TypeScript y es de código abierto mantenido por Google. Se utiliza para crear y mantener aplicaciones web de una sola página.
Su objetivo es aumentar las aplicaciones basadas en navegador con capacidad de Modelo Vista Controlador (MVC), en un esfuerzo para hacer que el desarrollo y las pruebas sean más fáciles.
La biblioteca lee el HTML que contiene atributos de las etiquetas personalizadas adicionales, entonces obedece a las directivas de los atributos personalizados, y une las piezas de entrada o salida de la página a un modelo representado por las variables estándar de JavaScript.
En este artículo se explica cómo instalar Angular en un sistema Ubuntu 20.04 LTS, aunque puede seguirse también para una distribución Debian.
Instalar NodeJS y Angular
Primero será añadir el repositorio de NodeJS para ello puedes ejecutar el script que proporcionan:
# curl -sL https://deb.nodesource.com/setup_16.x | bash -
Ahora podrás instalar NodeJS:
# apt install nodejs -y && node --version
Una vez instalado, actualiza NPM:
# npm install npm@latest -g && npm --version
Y posteriormente instala Angular:
# npm install -g @angular/cli && ng version
Ahora Angular estará instalado, para una aplicación existente puedes comenzar tu trabajo e ignorar la creación del proyecto.
Creación de un proyecto Angular
Primero accede en la ubicación que deseas almacenar el proyecto:
# cd /opt
Luego crea el proyecto indicando el nombre:
# ng new miproyecto
Te preguntará que estilo elegir entre CSS, SASS, LESS o Stylus.
Una vez seleccionado el estilo y creado el proyecto, accede al directorio:
# cd miproyecto
Para servir el proyecto, simplemente indica la dirección IP del servidor y el puerto que quieras:
# ng serve --host 127.0.0.1 --port 8080
Creación de servicio para Angular
En caso que quieras automatizar el arranque del proyecto, puedes crear un servicio:
# nano /etc/systemd/system/miproyecto.service
En el archivo añade el siguiente contenido (recuerda modificar la ubicación de ejemplo):
[Unit]
Description=Proyecto Angular daemon
After=network-online.target
[Service]
User=root
Group=root
WorkingDirectory=/opt/miproyecto
ExecStart=/usr/bin/ng serve --host 127.0.0.1 --port 8080
[Install]
WantedBy=multi-user.target
Luego activa e inicia el servicio:
# systemctl enable miproyecto && systemctl start miproyecto
Por último, comprueba el estado:
# systemctl status miproyecto
Configuración de proxy inverso con NGINX
Si quieres configurar un certificado SSL con Let's Encrypt, puedes utilizar un proxy inverso con NGINX y obtener el certificado con Certbot. Primero instala NGINX y Certbot:
# apt install nginx python3-certbot-nginx -y
Una vez instalado los paquetes, elimina el site por defecto:
# rm /etc/nginx/sites-enabled/default
Y posteriormente crea el archivo de configuración para el proyecto:
# nano /etc/nginx/sites-enabled/miproyecto.conf
Con el siguiente contenido (recuerda modificar el dominio de ejemplo):
server {
listen 80;
server_name ejemplo.dominio.com;
location / {
proxy_pass http://localhost:8080;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}
Una vez creado el archivo, reinicia NGINX y obtén el certificado con Certbot:
# systemctl restart nginx && certbot --nginx --redirect -d ejemplo.dominio.com
Esperamos haberte ayudado con este tutorial. ¿Lo has probado? ¡Déjanos tus comentarios!
Recuerda, si tienes consultas sobre esta u otra cuestión relacionada con tus servidores en Clouding, no dudes en escribir a soporte@clouding.io ¡Estamos a tu lado para lo que necesites! 🙂
