Instalar Angular en Fedora 39 es un proceso sencillo que te permitirá desarrollar aplicaciones web robustas y escalables. Este artículo te guiará paso a paso en la instalación de Angular en tu sistema Fedora, incluyendo la configuración necesaria y ejemplos prácticos para que los principiantes puedan seguir sin dificultades.

Requisitos Previos

Antes de comenzar, asegúrate de tener lo siguiente:

1. Un sistema Fedora 39 actualizado.
2. Acceso a la terminal con privilegios de superusuario.

Paso 1: Actualizar el Sistema

Primero, es importante asegurarse de que todos los paquetes del sistema estén actualizados. Abre una terminal y ejecuta el siguiente comando:

sudo dnf update -y

Paso 2: Instalar Node.js y npm

Angular requiere Node.js y npm (Node Package Manager). Para instalarlos, sigue estos pasos:

1. Agrega el repositorio NodeSource para Fedora: curl -sL https://rpm.nodesource.com/setup_16.x | sudo bash -
2. Instala Node.js y npm: sudo dnf install nodejs -y

Para verificar que la instalación se realizó correctamente, puedes comprobar las versiones de Node.js y npm:

node -v
npm -v

Paso 3: Instalar Angular CLI

Angular CLI es una herramienta de línea de comandos que facilita la creación y gestión de proyectos Angular. Para instalar Angular CLI, usa el siguiente comando:

sudo npm install -g @angular/cli

Para asegurarte de que Angular CLI se instaló correctamente, verifica la versión instalada:

ng version

Paso 4: Crear un Nuevo Proyecto Angular

Una vez que Angular CLI está instalado, puedes crear un nuevo proyecto Angular. Dirígete al directorio donde deseas crear tu proyecto y ejecuta:

ng new mi-proyecto-angular

Sigue las instrucciones en pantalla para configurar tu proyecto. Angular CLI te pedirá seleccionar opciones como el uso de TypeScript y la configuración de enrutamiento. Selecciona las opciones según tus preferencias.

Paso 5: Navegar al Directorio del Proyecto y Servir la Aplicación

Después de crear el proyecto, navega al directorio del proyecto:

cd mi-proyecto-angular

Luego, sirve la aplicación en modo de desarrollo:

ng serve

Por defecto, Angular servirá la aplicación en http://localhost:4200/. Abre tu navegador web y navega a esta URL para ver tu aplicación Angular en funcionamiento.

Paso 6: Configurar el Firewall (Opcional)

Si tienes un firewall habilitado, necesitarás permitir el tráfico a través del puerto 4200. Usa los siguientes comandos para permitir el tráfico HTTP en el puerto 4200:

sudo firewall-cmd --permanent --add-port=4200/tcp
sudo firewall-cmd --reload

Solución de Problemas Comunes

Problema: Permisos de npm

Si encuentras problemas con los permisos al instalar paquetes globales con npm, puedes cambiar la ubicación de los paquetes npm a un directorio dentro de tu home. Sigue estos pasos:

1. Crea un directorio para npm global: mkdir ~/.npm-global
2. Configura npm para usar este nuevo directorio: npm config set prefix '~/.npm-global'
3. Agrega el nuevo directorio a la variable de entorno PATH. Abre o crea el archivo ~/.bashrc y añade la siguiente línea: export PATH=~/.npm-global/bin:$PATH
4. Recarga el archivo ~/.bashrc: source ~/.bashrc

Problema: Versiones Conflictivas

Si experimentas conflictos de versiones o incompatibilidades, considera usar nvm (Node Version Manager) para manejar múltiples versiones de Node.js. Aquí está cómo instalar nvm:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | bash
source ~/.nvm/nvm.sh

Luego, instala la versión de Node.js que necesitas:

nvm install 16
nvm use 16

Si estás buscando servicios de alojamiento confiables para tu aplicación Angular, Shape.host ofrece soluciones de Linux SSD VPS que pueden adaptarse a tus necesidades. Con Shape.host, puedes desplegar tus aplicaciones en servidores virtuales escalables y seguros, asegurando un rendimiento óptimo y una alta disponibilidad.