Midu eres lo mas grande del mundo contemporáneo de la programación, no solo por la calidad del contenido que brindas, sino por la capacidad que tienes de extender tu pasion y entusiasmo por el mundo dev. Hace años que trabajo como FE, y cada vez que me encuentro desanimado mirar algo tuyo me contagia ese entusiasmo y me recuerdo lo bonito que es programar. SIMPLEMENTE GRACIAS ❤❤❤
Sin duda ese tutorial de vercel es perfecto para lo que quieran saber como funciona Next como una introduccion y encima explicado con Midu mucho mejor aun, gracias por el contenido.
Increible como explica. Por fin entendí que es lo realmente bueno de nextjs. Ojala puedas seguir el curso para ver como se hace cuando se necesita editar data, enviar data lo que sean entre componentes.
Es fantastico! Ya voy por el capítulo 14 del tutorial en el que te inspiraste y tu guía en los primeros capítulos ha sido fundamental! Muchas gracias!! Si te animas a hacer otro tuto de los capítulos restantes lo veré para repasarlo bien, porque aprendo mucho más contigo. Ojalá no cambie nada a menos que sea para mejor!
1:38:17 sobre monolitos: si los servicios del backend son complejos, se podría mover esa lógica a una API aparte (incluso en otro lenguaje como Java) y hacer que NextJS llame a esa API (de manera similar a como se llama a Postgres en este ejemplo).
Midu en verdad que eres un crack, este tutorial de Next y el curso de React son una joya, ni en cursos de pago esta tan bien explicado. Como me hubiera gustado ver esta info antes. Mil gracias!!!
impecable, muy justificadas las elecciones de las tecnologias que usas y lo bueno que pones buenos ejemplos, como lo del parcheo de la ui o decir por que salieron las spa realmente y que la gente lo malinterpret'o con otros usos
jeje lo del suspense y skeleton lo suelo hacer mucho en React de hecho encapsulo todo en un solo componente para cuando se use el componente , no haya que estarlo envolviendo en suspense. Excelente explicación Midu, tus vídeos son sinónimo de calidad.
Me encanta lo que propone next, pero mi gran duda o lo que me falta es desacoplarme de la estructura de monolito, es decir si yo tengo un backend que gestione cada contexto (blog, web...) en el cual por temas de rendimiento, seo, ux... next me parece una buena opción, otro para un crm interno y que estos backends se comuniquen por eventos de dominio (con un rabbitmq, kafka) y asi estructurar y seguir arquitectura que pueda escalar en el tiempo, la solución seria no tener una api en next si no que haga un fech de datos al backend correspondiente o tener internamente una api que gestione solo lo que va a necesitar en ese contexto?
Total, en un servidor tendrías todo el front donde el realiza las peticiones a otro servidor que pude ser con next o incluso con PHP (porque son más baratos XD) ya que ese sería solo una API
Por favor has un curso con los temas avanzados, hay muchos videos youtube de next js pero no e visto ninguno con los temas avanzados como: Intercepting Routes, Parallel Routes, Middleware, Internationalization, Script, Cookies, [...folder], [[...folder]], _folder, @folder, (.)folder, (..)folder, (..)(..)folder, (...)folder estoy seguro q mas personas esperan un video donde se explique con detalle lo mencionado anteriormente debido a que hay muy poca información por parte de youtubers al respecto
Hola Midu, Gracias por regalar conocimiento!!!. Esto está bueno, solo por un detalle, Odio Tailwind, te hace escribir kilómetros de código sucio, una línea interminable con "palabras" separadas por espacios. ¿Pregunto, es difícil reemplazar Tailwind por Material UI, por ejemplo?
El video me encanta, lo malo es que no puedo seguirlo debido a que no se me generaran los datos de bd postgress, pero hasta entonces muy buen video me ha encantado.
¡Hola! De pronto esta playlist de los videos de Midu sobre NodeJS desde Cero es lo que estas buscando: ua-cam.com/play/PLUofhDIg_38qm2oPOV-IRTTEKyrVBBaU7.html
Aclaración, luego del 1:01:00 habla de descarga en segundo plano y code splitting. Estas funciones Next.js las hace solo en producción, por eso Midu no puede mostrarlas en las devtools.
Lo preguntaron como 20 veces en el chat y no se respondio, pero tengo la misma duda: Entonces tiene sentido y puede estar recomendado hacer el backend en otra tecnologia como Java Spring, NestJs o Django y demas y utilizar NextJS solo para el front? O no tendria sentido plantear una arquitectura asi?
Puedes hacer un video explicando sobre el sistema de api de nextjs y/o el sistema de cacheo de nextjs, revalidate..., si existe querys optimistas. como en reactquery. porfavor necesito esto para comenzar un nuevo proyecto. no hay mucha info afuera.
wao exelente tutorial, muchas gracias, pero el trucaso de crear ruta mmm(cuando usas neovim no tienes que estar redescrubriendo cosas que viene por defecto con unix)
Alguien mas tuvo problemas para correr el comando seed? Segui todos los pasos pero veo que no tengo el seed.js como midu, tengo un folder seed que dentro contiene route.ts y alli pareceria que esta lo mismo que tiene midu en el seed.js, pero al correr el comando me da errores
Hola, saludos a tod@s,pregunta: una vez hecho el fetch , que pasa si queremos que el suaurio modifique esa data , me refiero como padarias esa data a un context?
muchas gracias por su contenido.esta excelente como siempre sos un crack.me gustaria que realizaras una pagina con next14 y mui.seria excelente para reforzar el aprendizaje.gracias
Si quieres hacer una app tipo sistema operativo, cómo manejarías las páginas al abrir múltiples ventanas? Yo estoy jugando con arrays de objetos de páginas que se displayen en un componente de ventana, entonces así manejo el que se vayan acululando, cerrar etc, pero me gustaría pasarlo al route the nextjs, algún consejo que me puedas dar?, es viable pasar esa lógica a routes?
@midulive Tengo un problema, cuando intento hacer el import del global.css del minuto 20:30 me da el siguiente error: Build Error Failed to compile ./app/ui/global.css Error evaluating Node.js code Error: Failed to load external module Como puedo solucionarlo?
geniales tus videos, ya es el segundo curso que veo y son geniales, quisiera saber como se llama la extensión que usas para ese completado de sugerencia se ve muy genial.
luego configurá File Nesting: Patterns los archivos que quieras agrupar en package.json yo tengo los siguientes: package-lock.json, yarn.lock, pnpm-lock.yaml, .eslintignore, .eslintrc.json, .gitignore, .prettierignore, next.config.js, postcss.config.js, prettier.config.js, tailwind.config.ts, tsconfig.json
@@lucasgustavodiaz Dale, muchas gracias. Era justo eso. Es una maravilla ver el arbol de archivos mas acotado y con solo las cosas que usas para desarrollar
Muchas gracias por esta excelente introducción al Next.js, estoy en el camino de llegar a éste aprendiend JavaScript y React antes. Como recomiendas. Saludos
Tengo un problema al usar suspense, lo he hecho igual que en el video usando los server components y tanto el page incial como el componente son asincronicos, y hago un fetch a una api interna que tengo. El error es que no se monta el componente y hay un error de hidratación lo que hace que de quede en blanco toda la pantalla hasta que le de un f5
Segui el tutorial completo desde la web oficial de next js, y realmente veo que la app es super lenta en algunos casos, tambien que el RevalidatePath no termina de funcionar bien en todos los casos, y directamente no funciona si no vas a hacer redirect a la pagina que revalidaste el cache.
con respecto al pathname ua-cam.com/video/jMy4pVZMyLM/v-deo.html&feature=shared se puede recuperar, pero con javascript puro (no JSX, ReactJS, NextJS y demás) y las bibliotecas de node URL().parse(url).pathname. Por que es parte de la solicitud HTTP que el servidor recibe. Cuando la HTTP request llega al servidor la primer línea es el método HTTP luego el path. Por ejemplo GET /dashboard/customers Por ejemplo se podría hacer un hook similar a pathname, pero que se procese en el lado del servidor 😄
En una parte del video alguien del chat pregunta sobre si quiero usar componente en el layout global y en otras partes no usarlo, creo que con el uso de template.ts y layout.ts se lograria
Midu, como le hiciste para poner todas las configuracion dentro de "la carpeta" de package.json, si alguien sabe me podria pasar el video o explicar como se hace ?
Con respecto a la pregunta del footer como cambiarlo dependiendo la pagina se usa los params de la url y en el return del footer se pone un ternario, si es el pathname que devuelva null u otra cosa y sino que se muestre el footer normal. Yo lo solucione así, espero que me haya explicado
Hola, crees que pueda llevar este curso sin saber nada de type script? Mis conocimientos: React, javascript... Tengo un proyecto en produccion con react, funcionando bien, solo que me gustaría aprender este framework para proyectos optimizados para seo en algunas areas, y sobre todo para optimizar imagenes, será posible? O debería llevar un curso de Ts primero
Me incómoda un poco el hecho de que la algunas carpetas como componentes, modelos o servicios esten al mismo nivel de las paginas, por ejemplo en app/services también tener app/Contact (página) hay alguna forma de usar la antigua estructura? O alguien que recomiende algua arquitectura, porque de esta forma se me hace algo desorganizado trabajar, no sé igual y solo soy yo, pero me gustaría saber si hay forma de cambiarlo sin mudarme a una versión de next mas atrás
Midu eres lo mas grande del mundo contemporáneo de la programación, no solo por la calidad del contenido que brindas, sino por la capacidad que tienes de extender tu pasion y entusiasmo por el mundo dev.
Hace años que trabajo como FE, y cada vez que me encuentro desanimado mirar algo tuyo me contagia ese entusiasmo y me recuerdo lo bonito que es programar.
SIMPLEMENTE GRACIAS ❤❤❤
De los mejores en espanol
La madre que pario a este muchacho no se imagina el baúl de informacion que le estaba dando al mundo
es increíble este tipo, simplemente todos los comentarios son positivos y su contenido es excelente
Sin duda ese tutorial de vercel es perfecto para lo que quieran saber como funciona Next como una introduccion y encima explicado con Midu mucho mejor aun, gracias por el contenido.
Increible como explica. Por fin entendí que es lo realmente bueno de nextjs. Ojala puedas seguir el curso para ver como se hace cuando se necesita editar data, enviar data lo que sean entre componentes.
Soy backend PHP y me voy a poner con next xq le veo mucho futuro. Me pasó al bando fullstack
No se va a arrepentir. La sintaxis de React y Next.js es mucho mas manejable que PHP. Es el presente y el futuro.
Es fantastico! Ya voy por el capítulo 14 del tutorial en el que te inspiraste y tu guía en los primeros capítulos ha sido fundamental! Muchas gracias!! Si te animas a hacer otro tuto de los capítulos restantes lo veré para repasarlo bien, porque aprendo mucho más contigo. Ojalá no cambie nada a menos que sea para mejor!
Como siempre, un nivel increíble en la forma que comunicar el contenido en los cursos 👏👏👏👏
Muchas gracias ❤️
Seguirás el curso más adelante? Vendría bien un video de prueba técnica y/o uno de un tipo blog o tienda en línea
1:38:17 sobre monolitos: si los servicios del backend son complejos, se podría mover esa lógica a una API aparte (incluso en otro lenguaje como Java) y hacer que NextJS llame a esa API (de manera similar a como se llama a Postgres en este ejemplo).
es correcto, la filosofia de Nextjs es adaprtse al presente y futuro, ademas de que sea usable junto a otras tecnologías
Midu en verdad que eres un crack, este tutorial de Next y el curso de React son una joya, ni en cursos de pago esta tan bien explicado. Como me hubiera gustado ver esta info antes. Mil gracias!!!
Muchas gracias por tu comentario y por dejar tu aporte, amigo! 🤗
Muchísimas gracias, contenido de gran calidad 🎉🎉Thanks!
Carajoooooo !!!! grande midu !!!! un curso de estos en otras plataformas millones de $$$$. Gracias por tu conocimiento !!!
madre mia, midu es el elegido que vino del futuro para enseñarnos todo con una claridad impresionante jaja gracias infinitas
Gracias por el video! me ha encantado! muy claro tus explicaciones! no te conocia y ya te empece a seguir!!!!
impecable, muy justificadas las elecciones de las tecnologias que usas y lo bueno que pones buenos ejemplos, como lo del parcheo de la ui o decir por que salieron las spa realmente y que la gente lo malinterpret'o con otros usos
Mil gracias Midu! Paso de Nuxt a Next y me facilitaste mucho!!
creo de los mejores instructores sin temor a equivocarme 🎉🎉 FELICITACIONES 🎉🎉
Yo diría el mejor jaja
Bueno, al parejo con el buen Fazt
cada dia mola más Next y cada dia molan más tus clases xD muchisimas gracias por todo midu!!! eres más genial que next14!!! ;)
Gracias a ti!!
Como el 14 es relativamente nuevo hay poco contenido que te enseña a usarlo o lo usa tal cual, me salvaste el proyecto de la uni gracias pa 🫶🏼🫡
jeje lo del suspense y skeleton lo suelo hacer mucho en React de hecho encapsulo todo en un solo componente para cuando se use el componente , no haya que estarlo envolviendo en suspense. Excelente explicación Midu, tus vídeos son sinónimo de calidad.
Excelente e impecable tu explicación! gracias
Gracias a ti!
tremando titurial midu! gracias, ya es la segunda vez que lo veo y no creo que sea la última jajajaja
Muchas gracias amigo!
Me encanta lo que propone next, pero mi gran duda o lo que me falta es desacoplarme de la estructura de monolito, es decir si yo tengo un backend que gestione cada contexto (blog, web...) en el cual por temas de rendimiento, seo, ux... next me parece una buena opción, otro para un crm interno y que estos backends se comuniquen por eventos de dominio (con un rabbitmq, kafka) y asi estructurar y seguir arquitectura que pueda escalar en el tiempo, la solución seria no tener una api en next si no que haga un fech de datos al backend correspondiente o tener internamente una api que gestione solo lo que va a necesitar en ese contexto?
Total, en un servidor tendrías todo el front donde el realiza las peticiones a otro servidor que pude ser con next o incluso con PHP (porque son más baratos XD) ya que ese sería solo una API
Por favor has un curso con los temas avanzados, hay muchos videos youtube de next js pero no e visto ninguno con los temas avanzados como:
Intercepting Routes,
Parallel Routes,
Middleware,
Internationalization,
Script,
Cookies,
[...folder],
[[...folder]],
_folder,
@folder,
(.)folder,
(..)folder,
(..)(..)folder,
(...)folder
estoy seguro q mas personas esperan un video donde se explique con detalle lo mencionado anteriormente debido a que hay muy poca información por parte de youtubers al respecto
Me lo apunto para un posible curso de pago, gracias!
Bua midu, increible el contenido y lo que aportas a la comunidad!
Gracias!!! 🙂
Muchas gracias por todo el contenido que traes para la comunidad.
Hola Midu, Gracias por regalar conocimiento!!!. Esto está bueno, solo por un detalle, Odio Tailwind, te hace escribir kilómetros de código sucio, una línea interminable con "palabras" separadas por espacios. ¿Pregunto, es difícil reemplazar Tailwind por Material UI, por ejemplo?
Excelente tutorial! Muchas gracias!!
Casi 2 horas de contenido valioso. Muchas gracias Midu
Vengo a Disfrutar
Midu eres increíble 🥹❤
Gracias majo!
Ya era hora! un sistema de enrutado como el de CI2, por archivos. Un tuto excelente!
en el proceso de base de datos : postgres como se haria la conexion con sql server?
El video me encanta, lo malo es que no puedo seguirlo debido a que no se me generaran los datos de bd postgress, pero hasta entonces muy buen video me ha encantado.
midudev eres una bendición para el mundo
Voy por el capítulo 10 o 12 del curso de Vercel, y me parece que Next 14 está muy bien.
Lógico, hay gente que se complica la vida en tecnisismos
Muy épico, vengo de Laravel estoy aprendiendo next muy buenas cosas tiene next
Gracias Midu, te amo
Pero Midu, con el en qué queda el loading.tsx? ya no sirve? una cosa sustituye a la otra?
¡Joder!, buenísima la info
Excelente tutorial.
Visto en 02/03/2024
Excelente video!, pero podrias dar un curso desde cero orientado al backend. Gracias sos un genio 🇦🇷
¡Hola! De pronto esta playlist de los videos de Midu sobre NodeJS desde Cero es lo que estas buscando:
ua-cam.com/play/PLUofhDIg_38qm2oPOV-IRTTEKyrVBBaU7.html
Excelente. Midu como siempre. Pero como se hacen esos emoticones en el código xd
impresionante la magia que hace nextjs
El mas grande Midu, gracias por tanto, ojala tengamos en algun momento como pagarte tanto conocimiento transferido!!
Más simple de ahí imposible, gracias midu!
Terrible video Midu, sos crack gracias por siempre transmitir tus conocimientos! Abrazo, buen año
Invaluable este video. Muchas gracias!
Gracias por este gran aporte viejo, eres el mejor.
ya se que voy a hacer este fin de semana. Gracias midu♥
Muchas gracias midu 🫂
Saludos desde Xalapa, Veracruz, México , gracias por todo tu contenido
Que emoción❤❤❤❤❤, no puedo esperar por este contenido de auténtica calidad😂😂😂❤❤
¿Como conectas a una BD local? En el ejemplo se conecta en remoto con Vercel
buen video midu! ya lo vi 3 veces
Y eso que lo subió hace 5 minutos, qué crack
Aclaración, luego del 1:01:00 habla de descarga en segundo plano y code splitting. Estas funciones Next.js las hace solo en producción, por eso Midu no puede mostrarlas en las devtools.
Lo preguntaron como 20 veces en el chat y no se respondio, pero tengo la misma duda: Entonces tiene sentido y puede estar recomendado hacer el backend en otra tecnologia como Java Spring, NestJs o Django y demas y utilizar NextJS solo para el front? O no tendria sentido plantear una arquitectura asi?
Excelente contenido. Gracias Midu!
Excelente Video, Gracias por compartir lo que sabes, un saludo
Está buenisimo lo que tiene nextjs ahora! Lo de server components es extraordinario, aunque rompe con atomic design pero bueno es lo de menos.
Midu sos el mejor, te amo
Excelente. Gracias Midu!
Puedes hacer un video explicando sobre el sistema de api de nextjs y/o el sistema de cacheo de nextjs, revalidate..., si existe querys optimistas. como en reactquery. porfavor necesito esto para comenzar un nuevo proyecto. no hay mucha info afuera.
Qué agradable sujeto!🍷
Gracias por el video Midu!
Muy buen video!
wao exelente tutorial, muchas gracias, pero el trucaso de crear ruta mmm(cuando usas neovim no tienes que estar redescrubriendo cosas que viene por defecto con unix)
Alguien mas tuvo problemas para correr el comando seed? Segui todos los pasos pero veo que no tengo el seed.js como midu, tengo un folder seed que dentro contiene route.ts y alli pareceria que esta lo mismo que tiene midu en el seed.js, pero al correr el comando me da errores
Excelente contenido como siempre!!
Mil gracias!
Hola, saludos a tod@s,pregunta: una vez hecho el fetch , que pasa si queremos que el suaurio modifique esa data , me refiero como padarias esa data a un context?
Sos un genio midu :)
muchas gracias por su contenido.esta excelente como siempre sos un crack.me gustaria que realizaras una pagina con next14 y mui.seria excelente para reforzar el aprendizaje.gracias
Si quieres hacer una app tipo sistema operativo, cómo manejarías las páginas al abrir múltiples ventanas? Yo estoy jugando con arrays de objetos de páginas que se displayen en un componente de ventana, entonces así manejo el que se vayan acululando, cerrar etc, pero me gustaría pasarlo al route the nextjs, algún consejo que me puedas dar?, es viable pasar esa lógica a routes?
@midulive Tengo un problema, cuando intento hacer el import del global.css del minuto 20:30 me da el siguiente error:
Build Error
Failed to compile
./app/ui/global.css
Error evaluating Node.js code
Error: Failed to load external module
Como puedo solucionarlo?
geniales tus videos, ya es el segundo curso que veo y son geniales, quisiera saber como se llama la extensión que usas para ese completado de sugerencia se ve muy genial.
Cómo se agrupan los config dentro de package.json en vscode? Es una extensión?
Me quedé pensando lo mismo 🤔
Solo tenes que activar la opción de file nesting
luego configurá File Nesting: Patterns los archivos que quieras agrupar en package.json yo tengo los siguientes: package-lock.json, yarn.lock, pnpm-lock.yaml, .eslintignore, .eslintrc.json, .gitignore, .prettierignore, next.config.js, postcss.config.js, prettier.config.js, tailwind.config.ts, tsconfig.json
@@lucasgustavodiaz Dale, muchas gracias. Era justo eso. Es una maravilla ver el arbol de archivos mas acotado y con solo las cosas que usas para desarrollar
Muchas gracias por esta excelente introducción al Next.js, estoy en el camino de llegar a éste aprendiend JavaScript y React antes. Como recomiendas. Saludos
Midu!! genial el contenido muchas gracias!! Habra parte 2??
Por supuesto! Este jueves en directo en Twitch
Tengo un problema al usar suspense, lo he hecho igual que en el video usando los server components y tanto el page incial como el componente son asincronicos, y hago un fetch a una api interna que tengo.
El error es que no se monta el componente y hay un error de hidratación lo que hace que de quede en blanco toda la pantalla hasta que le de un f5
Esperando el siguiente video
Hola, excelente tutorial, podrías indicar todas las extensiones que estas utilizando? alguien las sabe?
Impresionante
Segui el tutorial completo desde la web oficial de next js, y realmente veo que la app es super lenta en algunos casos, tambien que el RevalidatePath no termina de funcionar bien en todos los casos, y directamente no funciona si no vas a hacer redirect a la pagina que revalidaste el cache.
tremendo contenido, muchas gracias
hola, muy buen video. podrias comentar cuales extenciones usas? alguien sabe?
con respecto al pathname ua-cam.com/video/jMy4pVZMyLM/v-deo.html&feature=shared se puede recuperar, pero con javascript puro (no JSX, ReactJS, NextJS y demás) y las bibliotecas de node URL().parse(url).pathname. Por que es parte de la solicitud HTTP que el servidor recibe.
Cuando la HTTP request llega al servidor la primer línea es el método HTTP luego el path.
Por ejemplo GET /dashboard/customers
Por ejemplo se podría hacer un hook similar a pathname, pero que se procese en el lado del servidor 😄
En una parte del video alguien del chat pregunta sobre si quiero usar componente en el layout global y en otras partes no usarlo, creo que con el uso de template.ts y layout.ts se lograria
q onda los Context providers? no te arruina el rsc? xq ya pasarias a tener todo en use client si es q queres englobarlos con algun context🤔
¿Cual se supone es la diferencia entre getstaticprops y "use server", ¿son lo mismo o son similares?
Midu, más contenido de next.js 14 por favor.
Midu, como le hiciste para poner todas las configuracion dentro de "la carpeta" de package.json, si alguien sabe me podria pasar el video o explicar como se hace ?
Ya viene por defecto cuando trabajas con la guia de Next.js.
Gracias 💛
Con respecto a la pregunta del footer como cambiarlo dependiendo la pagina se usa los params de la url y en el return del footer se pone un ternario, si es el pathname que devuelva null u otra cosa y sino que se muestre el footer normal. Yo lo solucione así, espero que me haya explicado
Buenisimo midu 🤩
Hola, crees que pueda llevar este curso sin saber nada de type script? Mis conocimientos: React, javascript... Tengo un proyecto en produccion con react, funcionando bien, solo que me gustaría aprender este framework para proyectos optimizados para seo en algunas areas, y sobre todo para optimizar imagenes, será posible? O debería llevar un curso de Ts primero
Midu es rentable hacer un proyecto de front nextjs y de back nestjs?
Me incómoda un poco el hecho de que la algunas carpetas como componentes, modelos o servicios esten al mismo nivel de las paginas, por ejemplo en app/services también tener app/Contact (página) hay alguna forma de usar la antigua estructura? O alguien que recomiende algua arquitectura, porque de esta forma se me hace algo desorganizado trabajar, no sé igual y solo soy yo, pero me gustaría saber si hay forma de cambiarlo sin mudarme a una versión de next mas atrás
Gracias!
El orden de las carpetas y nombre es parecido a React.js?.