Slowly but surely

Ayer fue un buen día, avanzamos mucho y hoy puedo seguir con animo sobre el diseño

Hoy fue mucho más rápido que ayer y llegue al lugar que quería, creo que tengo un diseño super simple y bonito.

Ya termine el sidebar y el toolbar. Me mantuve fiel a los componentes de angular material y use un poco de bootstrap para estructurar el contenido, lo demás es paciencia y css.

voy a mostrar un avance de cómo estamos hasta hoy.

Mañana el objetivo es seguir con la creación de los componentes reutilizables para dejar una estructura ideal para futuros usos.

No me olvide de documentar el avance, esta todo en compodoc.

Hoy perdí mil horas de tiempo leyendo sobre una librería que ayuda a documentar todo el proyecto de angular. Cuando me termino de convencer la instale.

Se llama Compodoc. y este man de youtube tira un tip clave para que todo funcione. porque ya sabemos que la documentación es hermosa pero siempre le faltan 5 para el peso.

Tarde mucho en decidir si iba a hacer el sidebar con angular material o con puro css..

Me decidí a hacer todo con material y romperme la cabeza customizandolo.

Voy a modularizar la app. Voy a dividir la app en dos grandes módulos, el modulo de autorización y el modulo de administrador. Ambos con sus propio sistema de rutas

El administrador lo cree con angular schematics

$ ng generate @angular/material:navigation <component-name>

y para hacer una prueba de dashboard component use

$ ng generate @angular/material:dashboard <component-name>

-----

Este es el primer resultado:

El próximo paso, como buena persona que le importa el diseño fue crear un logo para mi admin. Como no tengo mucho tiempo lo hice con una herramienta de IA.

El próximo paso será diseñar y maquetar el side.

Este es mi primer post, no hago este blog para aportar conocimiento a la comunidad de desarrollo, sino para que sea un lugar donde pueda compartir todo eso que sentimos cuando estamos en el camino de aprender a programar, implementar un framework y toda la frustración de empezar mega entusiasmada en algo que por lo general tiene mas errores que aciertos.

Trabajo hace unos años como front-end, mas específicamente con angular. Tuve un camino opuesto a lo lineal y lo ordenado.

Es por eso que se me ocurrió empezar de cero CERO con un proyecto nuevo. Vamos a ver cómo sale, iré contando lo más periodicamente posible la evolución de mi proyecto y mi estado de animo.

Si por casualidad estas leyendo esto y te copa hacer algo parecido voy a ir tirando algunos pasos claves del proceso.

Mié 25 ene.

La idea es armar un admin con la ultima version de angular, usando angular material y bootstrap.

Vamos de cero:

Crear nuevo proyecto de angular -> $ ng new <nombreDelProyecto>

Instalar angular material -> $ ng add @angular/material (elegimos todas las opciones por defecto)

Instalar bootstrap -> $ npm install bootstrap jquery @popperjs/core

Agregar en el angular.json ->

"styles": [ "node_modules/bootstrap/dist/css/bootstrap.min.css", "src/styles.scss" ], "scripts": [ "node_modules/jquery/dist/jquery.min.js", "node_modules/@popperjs/core/dist/umd/popper.min.js", "node_modules/bootstrap/dist/js/bootstrap.min.js" ]