Creación de un Módulo CMS con Enrutamiento en Angular
Resumen
Es momento de poner manos a la obra con todo lo aprendido hasta aquí. Anímate a crear una aplicación con algunos módulos y páginas hijas para explorar cómo se desarrolla profesionalmente las aplicaciones con Angular.
Ejercicio para crear un CMS Module
Te recomiendo lo siguiente: si ya tienes una aplicación, reestructúrala de forma modular con todas sus páginas y crea un segundo módulo llamado CMS. Un CMS (Content Management System) no es más que un administrador privado para los usuarios de la aplicación para que puedan cargar contenido.
Cada módulo puede tener su propio <header>, <footer> o su propio layout además de las páginas pertinentes al mismo.
Tómate tu tiempo para analizar y reforzar los conocimientos hasta aquí y continuemos.
Al tratarse de dos módulos que crecerán mucho en el tiempo, el Website y el CMS, y que cada uno tiene diferentes propósitos, uno para administradores y otro para usuarios normales. Personalmente recomiendo en un proyecto real separar ambos módulos en dos proyectos distintos. La página web, por un lado, y otro repositorio para el Backoffice.
O pueden ser ambos proyectos en un mismo proyecto, hay una solución que nos ayuda con eso -> https://nx.dev/, esto para la reutilización de muchas cosas, pero manteniendo un orden, incluso, creo que hay algo propio de Angular, pero no lo conozco muy bien
Me gusto la clase, de esta forma puedo manejar mejor mis rutas 💻.
pregunta, porque el layout de la clase pasada va en components y no en pages? hay una razon o tengo razon en que deberia ir en pages, alguien esta deacuerdo?
por qué y para que usamos pathMatch:'full' ?
Se utiliza la opcion PathMatch para asegurarse que la ruta sea exacta.
Para generaciones flojas del fututo aquí tenemos esto jaja
ng g m cms --routing && ng g c cms/pages/tasks && ng g c cms/pages/grid && ng g c cms/components/layout
Me sirvio para entender mejor: el router-outlet de app.component.html, puede renderizar 3 posibles contenidos
el layoutComponent
el modulo del cms
el componente not-found.
a su vez el router-outlet del layout.html puede renderizar los contenidos que se encuentran en el children del app-routing.module.
para entenderlo mejor, se pueden fijar en el navbar, este solo va a salir en los componentes o contendios renderizados por el layout, es decir las rutas hijas del LayuoutComponent que estan en app-routing.module, por tal motivo al obtener el componente not-found, ya no tenemos navbar, ya que este componente (el not-found) no esta dentro de las rutas hijas del LayoutComponent. exelente clase, me despejo muchas dudas aun despues de haber trabajado un año en angular.
Aqui los comandos
$ ng g m cms --routing
$ ng g c cms/pages/tasks
$ ng g c cms/pages/grid
$ ng g c cms/components/layout
Me está saliendo este error
Error: src/app/cms/components/layout/layout.component.html:12:5 - error NG8001: 'router-outlet' is not a known element:
If 'router-outlet' is an Angular component, then verify that it is part of this module.
If 'router-outlet' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
Ya descubrí mi error. En el app-routing.module estaba importando el CmsRoutingComponent, cuando debe importarse es el CmsComponent
