Pasos

Nuevo proyecto Angular:

new carrito-compras

1. Which stylesheet format would you like to use?

CSS [ https://developer.mozilla.org/docs/Web/CSS ]

¿Qué formato de hoja de estilos deseas usar?

  • CSS (Cascading Style Sheets): El más básico y universal. Se usa para definir estilos visuales (colores, márgenes, tamaños, etc).

  • Otras opciones que a veces ofrece Angular (dependiendo de la versión):

    • SCSS (SASS): Extiende CSS con variables, anidamiento y funciones.

    • SASS: Similar a SCSS, pero con una sintaxis diferente.

    • LESS: Otra alternativa a SCSS.

    • Stylus: Más flexible, pero menos común.

💡 En este caso elegiste CSS, lo cual es ideal para empezar o si no necesitas funcionalidades avanzadas de estilos.

2. Do you want to enable Server-Side Rendering (SSR) and Static Site Generation (SSG/Prerendering)?

textCopiarEditarYes

¿Deseas habilitar el renderizado del lado del servidor y la generación de sitio estático?

  • SSR (Server-Side Rendering): Permite que Angular renderice el HTML en el servidor antes de enviarlo al navegador. Mejora el SEO y el tiempo de carga.

    • Framework relacionado: Angular Universal.

  • SSG (Static Site Generation) o Prerendering: Genera HTML estático para rutas específicas durante la compilación, útil si el contenido no cambia mucho.

🧠 Es buena idea habilitar esto si quieres que tu aplicación sea rápida y visible para buscadores como Google.

3. Would you like to use the Server Routing and App Engine APIs (Developer Preview) for this server application?

Yes

¿Deseas usar el enrutamiento de servidor y las APIs de la App Engine (versión preliminar)?

  • Esta opción es nueva en Angular (versión 17+).

  • Permite usar rutas del lado del servidor (server.routes.ts) y aprovechar una arquitectura moderna parecida a Next.js (de React).

  • También habilita APIs tipo REST directamente en Angular, como si tuvieras un backend simple.

⚠️ Está en "Developer Preview", lo que significa que todavía puede cambiar. Úsalo si te interesa aprender lo último de Angular o si te atrae una arquitectura tipo full-stack en Angular.

📂 Archivos creados (ejemplos):

textCopiarEditarCREATE carrito-compras/angular.json (2882 bytes)
CREATE carrito-compras/package.json (1252 bytes)

¿Qué significan estos archivos?

Archivo
¿Para qué sirve?

angular.json

Configura cómo se compila, prueba y construye tu app Angular.

package.json

Define dependencias y scripts del proyecto (Angular, TypeScript, etc.).

Otros (se crean después):

src/

Carpeta principal del código fuente (componentes, módulos, etc.).

tsconfig.json

Configura el compilador TypeScript.

.editorconfig

Estilo de código (espacios, sangrías).

.gitignore

Archivos y carpetas que no se deben subir a Git.

  • Arrancar la web:

ng serve

PreviousAngularNextInstalacion

Last updated