Angular - LazyLoad - Cargar módulos y rutas de forma perezosa

Поділитися
Вставка
  • Опубліковано 9 січ 2025

КОМЕНТАРІ • 119

  • @diego199319931
    @diego199319931 2 роки тому

    Excelente método de enseñanza, gracias por tus conocimientos y explicación sencilla

  • @johnnyrosero1409
    @johnnyrosero1409 3 роки тому

    Fernando es un demente cuando se trata de Angular, por eso tengo varios cursos comprados en Udemy. Excelente maestro. Por cierto ya he ganado unos cuantos miles de dólares gracias a él.

  • @cuencadev
    @cuencadev 4 роки тому +22

    Justo ayer buscaba un tutorial así, y como siempre, de manera oportuna, nos los ofreces gratis. Gracias Fernando, un feliz año nuevo.

  • @bryanherreradev8055
    @bryanherreradev8055 2 роки тому +1

    Gracias a ti alfin entendi esto, se me hacia muchas bolas con la docu, ¡AGRADECIDO CONTIGO AL MIL!
    .

  • @gaelochante1724
    @gaelochante1724 2 роки тому

    excelente estructura para trabajar mas ordenado y limpio

  • @devipa
    @devipa 3 роки тому

    Me encantan tus contenidos... imposible no entenderte. Gracias por compartir tus conocimientos. Bendiciones desde Buenaventura - Colombia

  • @davidandresgarzonsanchez
    @davidandresgarzonsanchez 10 місяців тому

    Buenisima explicación, valioso contenido el que haces. Muchs gracias.

  • @TheZemarko
    @TheZemarko 2 роки тому

    Es realmente increible la pedagogía que tenés. Excelente manera de enseñar. Gracias.

  • @CarlosGarcia-lq2jt
    @CarlosGarcia-lq2jt 2 роки тому

    Realicé un curso de angular tuyo en Udemy y me encanto, aprendí una barbaridad. Excelente comunicador Fernando, gracias!!

  • @freddyarriagacruz8987
    @freddyarriagacruz8987 3 роки тому

    que buena explicación, no una y dos veces, sino 3 veces, por si uno no capta a la primera!! genial!!!

  • @ladimirobaquero6149
    @ladimirobaquero6149 Рік тому

    Gracias fernando por compartir tus conocimientos a la comunidad 👍

  • @linocsar
    @linocsar 2 роки тому

    Gracias Fernando por tus videos, apoyando siempre a la comunidad, Felcidades espero comprar un curso más adelante un curso avanzado de angular.

  • @leonardorojas3585
    @leonardorojas3585 3 роки тому +1

    Muchas Gracias, super práctico, pero muy importante también nos hace ver la razón de las cosas, excelente.

  • @antonellavalentinacamargor9152
    @antonellavalentinacamargor9152 2 роки тому

    Por fin Fernando Herrera te encontré 🙂 explicas expectacular

  • @christiancarranza7363
    @christiancarranza7363 2 роки тому

    Muchas gracias profesor, llevaba horas tratando de entender un proyecto que usaba LazyLoad. De aquí me voy directo a comprar su curso de angular

    • @pedromorel5614
      @pedromorel5614 2 роки тому

      Dale que Fernando Herrera es excelente.

  • @gustavoadolforestrepogil3246
    @gustavoadolforestrepogil3246 4 роки тому +3

    Excelente explicación, me gusta mucho esta forma de cargar módulos, mejora mucho el performance.

  • @tonnyfranciscomaestrepercy1708
    @tonnyfranciscomaestrepercy1708 3 роки тому +1

    Mi hermano excelente su explicación, además sabe dar en el punto que tenemos mas dificultad los que estamos empezando en el mundo de la programación y queremos hacer las cosas bien. Felicitaciones y que Dios te siga bendiciendo con ese don.

  • @lstrumer
    @lstrumer 2 роки тому

    por fin una explicación de los módulos coherente, gracias

  • @cristianmorales7147
    @cristianmorales7147 3 роки тому +1

    Necesitaba esto!!!!!!!! Muchas gracias como siempre fernando!!

  • @CanalRubi
    @CanalRubi 3 роки тому

    jajajajaja que despedida!! gracias querido profe, información demasiada útil!!

  • @dfmf1982
    @dfmf1982 4 роки тому +2

    Uyyy fernando otro curso de angular espero que sea mas avanzado danos la primisia de que llevara porque al no mas salir lo compro soy fiel a tus cursos
    Saludos,

  • @SrEquixs
    @SrEquixs 4 роки тому

    Muchas gracias Fernando, es una garantía de aprender contigo

  • @VictorAlcantara2020
    @VictorAlcantara2020 2 роки тому

    @Fernando Herrera !! crack!! de cracks!!! Justo lo que necesitaba!!!

  • @alexisarnauda
    @alexisarnauda 4 роки тому +1

    Muchas gracias profesor, de esta manera queda todo muy organizado.

  • @jhonathangrueso1499
    @jhonathangrueso1499 3 роки тому

    excelente no sabia como organizar los proyectos ya que soy nuevo en esto

  • @hanckock867
    @hanckock867 4 роки тому +1

    la mejor explicación del mejor de Udemy, espero un curso tuyo de react native, ojalá lo sacaras pronto

  • @ArturoHerreraVargas
    @ArturoHerreraVargas 2 роки тому

    Demasiado claro el tema... muchas gracias

  • @danielnavarro8758
    @danielnavarro8758 4 роки тому +1

    Uno de los mejores profesores del mundoo.. Feliz año nuevo..

  • @j.gilbertoromero2761
    @j.gilbertoromero2761 3 роки тому

    No podría ser mejor explicado, acabas de hacerme el día, gracias

  • @crissanchez1251
    @crissanchez1251 3 роки тому +1

    Excelente, se agradece el contenido

  • @rodolfovizcay7113
    @rodolfovizcay7113 3 роки тому

    Gracias Fernando el video justo que estaba buscando. muy bien explicado :).

  • @danypop9875
    @danypop9875 3 роки тому

    Este video es dinamita pura !!

  • @jebarcha
    @jebarcha 4 роки тому +2

    Gracias Fernando. Bastante util, ya tengo varios cursos tuyos de angular y otros jeje, en lo particular me sirvio mucho de repaso ahorita que estoy en stand by o en dias sabaticos como programador jaja mientras me sigo preparando para nuevo proyecto de desarrollo. Saludos ;)

  • @estebanhugosomma3012
    @estebanhugosomma3012 4 роки тому +1

    Fernando!!! Clarísimo todo!!! Estoy haciendo tu curso de angular de 0 a experto en Udemy (impecable) y me sirvió para reforzar el tema de los módulo, rutas y lazy. ¿Para cuando un curso tuyo de algoritmos?... hay un montón pero es bastante complejo el tema y un curso de esto explicado por ti sería genial!!!! Estan de moda estos cursos porque para aplicar en empresas grandes (MS, GG, AMS, FB, etc) te toman examen de algoritmos. Un abrazo de Argentina.

  • @YeisonDev
    @YeisonDev 4 роки тому

    Para mí es la mejor manera de cargar módulos, y si se hace una buena estructura por módulos queda excelente, creo que escuché esta frase de uno de los desarrolladores de angular, decía que el usuario debería esperar por lo que quiere obtener

  • @axelltejada6265
    @axelltejada6265 3 роки тому

    Excelente explicación sobre carga perezosa

  • @JulyKarr
    @JulyKarr 3 роки тому

    Muchas gracias buen video profe Fernando!!!

  • @edgardomolinagonzalez3121
    @edgardomolinagonzalez3121 2 роки тому +5

    Master, hay un problema con el flex layout ya que fue descontinuado, en el curso de Angular en la sección de Angular con Material, sería bueno una actualización también para abarcar Angular 15, ha introducido componentes independientes, un diferente sistema de rutas y tipado de formularios como temas principales entre otros. Espero sirva mi retroalimentación, saludos profe y feliz año.

  • @maurowasil3744
    @maurowasil3744 2 роки тому

    Muy bueno, super claro! Gracias

  • @diegobuezo17
    @diegobuezo17 3 роки тому

    Como siempre muy excelentes explicaciones y cursos

  • @jkmilo.r
    @jkmilo.r 4 роки тому

    Muy bueno Fernando! como siempre muy útiles tus videos!

  • @araxxdj
    @araxxdj 3 роки тому +1

    Grandioso Tutorial bro! Brutal Sigue así!

  • @farneyjimenez
    @farneyjimenez 2 роки тому

    Muchas Gracias Fer 😀😀👏🏽👏🏽👏🏽👏🏽👏🏽👏🏽

  • @djjpp98
    @djjpp98 3 роки тому

    Excelente explicación, muchísimas gracias.

  • @eduardoleon9565
    @eduardoleon9565 2 роки тому

    Muchas gracias por la explicación crack!

  • @memoriasdeunaprendiz
    @memoriasdeunaprendiz 4 роки тому

    Excelente Fer
    Mejor explicado imposible!

  • @livanramos6804
    @livanramos6804 4 роки тому

    Es una lástima que desde cuba no pueda adquirir tus cursos. Pero eso no me detiene y no me pierdo un video tuyo en UA-cam el de cuanto cobrar como desarrollador es el que más he reproducido

  • @christiandavidosoriochacon7833
    @christiandavidosoriochacon7833 2 роки тому

    El mejor profesor!

  • @franciscoberrocal700
    @franciscoberrocal700 4 роки тому

    Excelente, muy buena explicación. Saludos.

  • @Orphen86
    @Orphen86 2 роки тому

    Muchas gracias, Excelente

  • @hectorge753
    @hectorge753 3 роки тому +1

    Muchas gracias y felicidades, qué video tan ilustrativo :) entonces el lazy ya viene como default, la magia está en manejar todo como módulos, cierto?

  • @tecomAGS
    @tecomAGS 10 місяців тому

    excelente video Fernando

  • @raulrojas6552
    @raulrojas6552 2 роки тому +1

    si no has estudiado un rato Angular puede que te hable en otro idioma, pero es lo mejor explicado que se puede

  • @eltirad0
    @eltirad0 2 роки тому +1

    Una pregunta supongamos que tenemos un SharedModule donde se exportan todos los módulos de PrimeNG y Angular Material para no tener que importarlos en cada modulo de cada pantalla de la app, si estamos trabajando con LazyLoad ¿Cada vez que se cambia de Module/Route va a volver a descargar todo ese SharedModule en el navegador en cada pantalla que el usuario va navegando o solo se descarga la primera vez y ya después ya no los descarga o simplemente va descargando los modules del SharedModule que se van ocupando? espero haberme entendido con mi pregunta, es que me preocupa el performance de mi app, e hice lo anteriormente descrito

  • @salomoncancholaespinoza6392

    Excelente video.

  • @josegarcia-hb7zl
    @josegarcia-hb7zl 3 роки тому +1

    buenas noches fernando podrias hacer un video del uso de intersectionObserver en angular y si funciona o no para dispositivos mobiles???

  • @PetrikovScience
    @PetrikovScience 3 роки тому

    El routing de ionic ya viene por defecto con lazy loading por lo que veo no? muy buen video, gracias por tu dedicación

  • @j.jordandavilaterrones4560
    @j.jordandavilaterrones4560 2 роки тому

    Excelente video Fernando, por favor me puedes indicar ¿Que tipo de font family estas utilizando para el vscode y de que manera instalarlo?. Gracias.

  • @sr.bolita2332
    @sr.bolita2332 Рік тому +1

    Bendito angel dios te bendiga :,v

  • @chr1so
    @chr1so 2 роки тому

    Puedes hacer lazy loading the components por ejemplo en un tab? Sin necesidad de usar el router outlet.

  • @ErvinFlota
    @ErvinFlota 3 роки тому

    Gran Maestro excelente video, Fernando tendrás algún curso de angular + net core + sqlserver

  • @2667Danny
    @2667Danny 3 роки тому

    Saludos Fernando tengo todos tus cursos de udemy espero que puedas actualizar el de angular avanzado

  • @juanetehOK
    @juanetehOK 3 роки тому

    muy bueno, justo lo q buacaba

  • @kim_lulu
    @kim_lulu 7 місяців тому

    gracias explicas bien

  • @burgasHoH
    @burgasHoH 4 роки тому +1

    Nice example and video !

  • @oscarortiz9581
    @oscarortiz9581 3 роки тому

    Muchas gracias!!

  • @marcelodecastro8984
    @marcelodecastro8984 2 роки тому

    Hola fernando , muy bueno tu tutorial , he realizado mi sito con ionic y el angular routing pero no funciona cuando lo paso a un servidor productivo usando "ionic build --prod", alguna idea de por que sucede esto?
    Gracias

  • @carlosgaleano4140
    @carlosgaleano4140 4 роки тому

    ¡Buen tutorial Fernando!

  • @abelacevedo4249
    @abelacevedo4249 Рік тому

    Hola y si quiero agregar shareds lo puedo meter adentro de cada modulo, osea una carpeta shared para cada modulo?

  • @gustavomartinez9371
    @gustavomartinez9371 Рік тому

    Hola Fernando, con esta configuración como puedo usar un service en varios módulos? yo tengo auth en un modulo y mi header que es global en otro y quiero acceder al auth service para obtener los datos del usuario, correo y nombre.

  • @nietoroger
    @nietoroger 4 роки тому

    Excelente ejemplo.

  • @alejandromartinez-gj4tm
    @alejandromartinez-gj4tm 4 роки тому +1

    Estoy por compar el curso de angular, me recomiendan hacerlo, o esperar a que salga el nuevo. Por otro lado quisiera saber si ya hay fecha de lanzamiento.
    Excelentes videos, muchísimas gracias.

  • @livanramos6804
    @livanramos6804 4 роки тому +1

    Gracias

  • @ElBarbaroDev
    @ElBarbaroDev 3 роки тому +1

    Crack!

  • @jhonatanjaraba5822
    @jhonatanjaraba5822 3 роки тому

    Les recomiendo su curso de angular sobre socket

  • @colommbiano
    @colommbiano 3 роки тому

    Maestro un video asi usando React LazyLoad rutas para React

  • @alejandrofernandez1201
    @alejandrofernandez1201 2 роки тому

    Muy bueno! me sirvió para entender el ruteo entre módulos, de todas formas algo me quedó muy claro, por defecto carga de forma perezosa? o en qué momento configuraste eso?

  • @oscarreno1
    @oscarreno1 4 роки тому

    Está muy claro. Ahora tengo una pregunta. ¿Se pueden "lazy-load" componentes (pages)? O solo aplica para módulos completos.

  • @robertschroeder9398
    @robertschroeder9398 4 роки тому +1

    Hola Fernando, estaría bueno el video de como hacer una app con diferentes templates, me toco hacer eso, la parte publica con un template y la parte de los mantenimientos con otro template y me costo mucho solucionarlo, me gustaría ver tu solución que seguro es mas eficiente.

  • @antonioubedamontero2927
    @antonioubedamontero2927 3 роки тому

    Hola @Fernando Herrera. Hice tu curso de Angular avanzado y tengo dos dudas con este video:
    1) Por qué en los modulos (por ejemplo en el AuthModule) no se exportan sus componentes? Es decir, como va a tener acceso el AppModule a esos componentes si no son accesibles fuera del AuthModule.
    2) Por qué no utilizas aquí lo de poner un pages para poner todas las rutas protegidas? Es mejor hacerlo con pages o como indicas en este video?
    Muchas gracias de antemano.

  • @thekingwars
    @thekingwars 3 роки тому

    Yo intento todo lo que mencionas, y en cierto modo las rutas sirven, y tienen un comportamiento igual al de tu video, pero en el network no veo el modulo en el que ando manejando el routing... No sé si estara funcionando.

  • @mirolrc6941
    @mirolrc6941 3 роки тому

    hola,te amo gracias

  • @S4MBENTZ
    @S4MBENTZ 3 роки тому

    gracias crack

  • @fabianrr
    @fabianrr 4 роки тому +1

    Hola Fernando, cuales cursos es que le sigue a "ANGULAR: DE CERO A EXPERTO CREANDO APLICACIONES" y "REACT: DE CERO A EXPERTO ( HOOKS Y MERN )"
    Seria como la ruta de estudio.

    • @btandayamo
      @btandayamo 3 роки тому +1

      No intententes abarcar todo en uno, elige uno (angular, react, o el q sea) dominalo crea proyectos simples, avanzados y luego si aun quieres muévete a otro

  • @LuisSanchez-sy4rp
    @LuisSanchez-sy4rp 2 роки тому

    Q-U-E C-A-P-O!!!!

  • @Andres-qi5wd
    @Andres-qi5wd 4 роки тому

    Buena master

  • @JoseLuis-sr4xw
    @JoseLuis-sr4xw 3 роки тому

    hola, a veri si alguien me puede ayudar, he creado la carpeta auth y dentro la carpeta pages y components, despues he creado los componentes register, login y forgotten dentro de pages y components, con la idea de hacer por ejemplo el formulario login dentro del components/login y despues utilizarlo en pages/login.html y y darle estilos css a la pagina de login, osea que tendria las paginas que hacen uso de la carpeta components y asi formo la pagina completa, estoy en lo cierto o lo estoy haciendo mal ? gracias

  • @luisgoicochea296
    @luisgoicochea296 4 роки тому

    Hola Fernando, una consulta, si necesito q un componente de mi pagina se actualice solo constantemente para verificar un cambio de estado de mi base de datos... cuál sería la ruta q tendría q seguir?

    • @fernando_her85
      @fernando_her85  3 роки тому

      Pues si se puede implementar sockets, sería lo ideal, porque si haces un timer cada minuto o algo así, el 99% del tiempo no haría nada.

  • @nacho-elmago7438
    @nacho-elmago7438 3 роки тому

    Buenas soy alumno tuyo de udemy - consulta, necesito implementar IntersectionObserver API en agunlar, no me da error pero tampoco lo ejecuta, quiero que cuando scrollee y baje recien ahi se anime. Tenes un video sobre esto?

  • @wsanchez0915
    @wsanchez0915 4 роки тому

    Fernando Herrera, gusto en saludarte feliz año. Fernando tengo una duda, actualmente estoy realizando un proyecto laboratorio en donde estoy usando ngrx, nose si se puede combinar el lazt loading con ngrx y si es obligatorio cuando usamos el ngrx el uso de ngrx-routing. Muchas gracias por el aporte saludo desde Venezuela.

    • @joseramon2889
      @joseramon2889 4 роки тому +1

      hola es confusa tu pregunta pero si podría confirmar que puedes usar ngrx e implementar lazy laoading porque mis proyectos lo tengo así y no es obligatorio ngrx-routing

    • @wsanchez0915
      @wsanchez0915 4 роки тому +1

      @@joseramon2889 Muchas gracias por responder. Si, hago la pregunta porque en la documentación habla de ngrx-routing. Por eso preguntaba si era obligatorio el uso de ngrx-routing o lo puedo combinar con routing-module. Claro aqui estoy midiendo la factibilidad (tiempo de desarrollos, ejecución del aplicativo, perfomance, etc)

    • @joseramon2889
      @joseramon2889 4 роки тому

      @@wsanchez0915 lo puedes combinar sin problema. Que tiempo llevas como desarrollador en angular? Lo digo porque busco desarrollador en angular de Venezuela

    • @wsanchez0915
      @wsanchez0915 4 роки тому

      @@joseramon2889 Llevo año y medio desarrollando con Angular.

  • @juanmendez1563
    @juanmendez1563 3 роки тому

    Buen video

  • @joseguerra5393
    @joseguerra5393 2 роки тому

    Excelente explicación muchas . Pero yo estoy teniendo un problema cuando ya decido compilar para producción, recibo el siguiente error ( ERROR Error: Uncaught (in promise): ChunkLoadError: Loading chunk 186 failed). Pd. En modo prueba funciona todo correcto. Necesito su ayuda por favor. Muchas Gracias !!

  • @alfredogrullon4652
    @alfredogrullon4652 4 роки тому

    Excelente Video

  • @carlostorres-uf6hz
    @carlostorres-uf6hz 3 роки тому

    brother . no estaria mal lo que haces a la hora de modularizar? ya que nuevo, editar,eliminar no serian rutas hijas de listado? . porque al cargar la lista hay botones de nuevo, editra ,y eliminar.

    • @ManuelHernandez-px5bg
      @ManuelHernandez-px5bg 3 роки тому +1

      Lo hace en base de ejemplo depende de nosotros el tipo de arquitectura escalable de nuestros proyectos

    • @btandayamo
      @btandayamo 3 роки тому

      Esos componentes eran solo para el ejemplo

    • @ManuelHernandez-px5bg
      @ManuelHernandez-px5bg 3 роки тому

      @@Unknown971 yo lo e trabajado tal cual lo explica el y siento que es mejor

  • @ervinsolanovargas8385
    @ervinsolanovargas8385 3 роки тому

    ¿Que opinas de hacer cada page como módulo para cargarla por medio del lazyload? para que sea mas liviano, ¿es válido?. Saludos desde Costa Rica.

    • @fernando_her85
      @fernando_her85  3 роки тому +1

      Si es válido, puedes hacerlo así perfectamente.

  • @erwinstalin2433
    @erwinstalin2433 3 роки тому

    Hola Fernando, gracias por el video. podrías decirme si en este sistema de rutas esta funcionado el lazy load? Cuando esté en la raiz y cargue el ContentComponent se va a llamar a todos los demás módulos o no?
    Saludos desde Perú.
    const routes: Routes = [
    {
    path: '',
    component: ContentComponent,
    children: [
    {
    path: 'currencies',
    loadChildren: () => import('./pages/currencies/currencies.module').then(m => m.CurrenciesModule)
    },
    {
    path: 'cash-registers',
    loadChildren: () => import('./pages/cash-registers/cash-registers.module').then(m => m.CashRegistersModule)
    },
    {
    path: 'cash-register-movements',
    loadChildren: () => import('./pages/cash-register-movements/cash-register-movements.module').then(m => m.CashRegisterMovementsModule)
    },
    ]
    },
    {
    path: 'user',
    loadChildren: () => import('./pages/user/user.module').then(m => m.UserModule)
    },
    ];

    • @btandayamo
      @btandayamo 3 роки тому

      No aquí ya esta quemado con un componente fijo. Pero con todo haz una prueba revisando en el chrome dev tools

  • @pipe201196
    @pipe201196 4 роки тому

    Bravo

  • @pabloacdev
    @pabloacdev 3 роки тому

    Muy buenas,
    Estaba probando a cargar el modulo perezosamente con path: '**' ya que con diferentes rutas quiero ir al mismo modulo. El problema es que al definir mis rutas hijas, en el routing del modulo tengo dos rutas path:' ' y un path:': id' .
    asi pues si voy a /usuario y quiero editarla intento navegar con un [routerlink]='/usuario/35' , pero no me funciona me carga siempre el path: ' '
    La cuestion de el porque hago esto es simplemente para que si yo doy a usuarios en la url me ponga /usuarios y si voy a libros me ponga en la url del navegador /libros y no el nombre del modulo /moduloGenerico
    Supongo que se podría sustituir la carga perezosa del path:'**' a cada una de ellas pero supon que así no me interese...
    ¿Se me escapa algo o estoy haciendo una barbaridad?

    • @fernando_her85
      @fernando_her85  3 роки тому

      El comodín ** debe ser la última ruta, porque a penas Angular encuentre una ruta que cumpla la condición del path, se saldrá y no evaluará las demás.

    • @pabloacdev
      @pabloacdev 3 роки тому

      @@fernando_her85 si , si creo que no me he explicado. la tengo la ultima y me entra con rutas no definidas como /usuario y /libros por tanto me entra bien al lazy load pero de ahí al hijo (un component) no sabe resolverlo cuando el padre es **
      Otra opción seria poder montar la constante Routes dinamicamente con ayuda de alguna funcion lo he intentado con el router.resetConfig pero yo no he sido capaz

  • @madtin
    @madtin 2 роки тому

    Mejor crear un módulo por cada vista no?

  • @ysacpebes1462
    @ysacpebes1462 4 роки тому

    GRACIAS :)