Generación de código con ng generate
Genere el esqueleto de componentes, servicios y más.
Generación de código con ng generate es una lección gratuita de Angular Academy en CoddyKit. Esta es la lección 3 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Angular Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Angular Academy incluye 4 lecciones en total.
Generar código con ng generate
El comando ng generate (abreviado como ng g) genera estructuras base de Angular con el código repetitivo y las convenciones de nombres adecuados.
Generar un componente
Cree un componente independiente con un solo comando.
ng generate component hello
# short form:
ng g component helloQué se crea
Genera hello.component.ts, .html, la hoja de estilos y una prueba .spec.ts, y usa el modo independiente de forma predeterminada.
Generar en una carpeta
Indique una ruta para colocar el componente en una subcarpeta.
ng g component features/dashboardGenerar un servicio
Cree un servicio inyectable con el schematic de servicio.
ng g service data
# creates data.service.ts with @InjectableGenerar una directiva
Las directivas independientes se generan de forma similar.
ng g directive highlightGenerar un pipe
Cree un pipe personalizado para transformar plantillas.
ng g pipe truncateGenerar un guard
Los guards de rutas protegen la navegación. CLI genera guards funcionales.
ng g guard authVista previa de ejecución en seco
Use la opción de ejecución en seco para previsualizar lo que se crearía sin escribir archivos.
ng g component hello --dry-runOmitir el archivo de pruebas
Añada una opción para omitir la generación de la prueba .spec.ts si no desea crearla.
ng g component hello --skip-testsPlantilla y estilos en línea
Puede solicitar una plantilla y estilos en línea en lugar de archivos independientes.
ng g component badge --inline-template --inline-styleComprobación rápida: ng generate
Generar estructuras base.
Resumen: generar
ng generate (ng g) genera estructuras base para componentes, servicios, directivas, pipes y guards siguiendo las convenciones adecuadas. Opciones como --dry-run, --skip-tests y --inline-template permiten adaptar el resultado. Siguiente: compilar y servir.
Preguntas frecuentes
¿La lección «Generación de código con ng generate» es gratis?
Sí — el texto completo de «Generación de código con ng generate» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Angular Academy, actualiza a CoddyKit PRO. El curso de Angular Academy incluye 4 lecciones en total.
¿Qué aprenderé en «Generación de código con ng generate»?
Genere el esqueleto de componentes, servicios y más. Practicas Angular Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Angular Academy?
No se requiere experiencia previa. Angular Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 3 de 4.
¿Cuánto tiempo toma la lección «Generación de código con ng generate»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Angular Academy?
Sí. Cada lección de Angular Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- Generación de un proyecto nuevo
- Explicación de la estructura del proyecto
- Generación de código con ng generate
- Compilación y ejecución