Tutorial Next.js 14 paso a paso, para Principiantes

Поделиться
HTML-код
  • Опубликовано: 26 дек 2024

Комментарии • 286

  • @gaxrod
    @gaxrod 8 месяцев назад +31

    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 ❤❤❤

    • @Tovimxz
      @Tovimxz 5 месяцев назад

      De los mejores en espanol

  • @erickruben5536
    @erickruben5536 Год назад +14

    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.

  • @luisaquinoc6548
    @luisaquinoc6548 8 месяцев назад +1

    Carajoooooo !!!! grande midu !!!! un curso de estos en otras plataformas millones de $$$$. Gracias por tu conocimiento !!!

  • @gabinoortiz6131
    @gabinoortiz6131 7 месяцев назад +1

    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!!!

    • @midulive
      @midulive  4 месяца назад

      Muchas gracias por tu comentario y por dejar tu aporte, amigo! 🤗

  • @andres-mora-vanegas
    @andres-mora-vanegas Год назад +15

    Muchísimas gracias, contenido de gran calidad 🎉🎉Thanks!

  • @mateoibanez5184
    @mateoibanez5184 8 месяцев назад +8

    es increíble este tipo, simplemente todos los comentarios son positivos y su contenido es excelente

  • @daniel-24gra79
    @daniel-24gra79 10 месяцев назад +62

    La madre que pario a este muchacho no se imagina el baúl de informacion que le estaba dando al mundo

  • @XXTargaryenXX
    @XXTargaryenXX 9 месяцев назад +4

    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!

  • @GabrielPozo
    @GabrielPozo Год назад +9

    Como siempre, un nivel increíble en la forma que comunicar el contenido en los cursos 👏👏👏👏

    • @midulive
      @midulive  Год назад +4

      Muchas gracias ❤️

  • @gianbarbozaa
    @gianbarbozaa Год назад +11

    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.

  • @SergioSam
    @SergioSam 6 месяцев назад

    madre mia, midu es el elegido que vino del futuro para enseñarnos todo con una claridad impresionante jaja gracias infinitas

  • @vivarantx
    @vivarantx Год назад +2

    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

  • @alejandrofantini9851
    @alejandrofantini9851 5 месяцев назад +1

    Mil gracias Midu! Paso de Nuxt a Next y me facilitaste mucho!!

  • @SonGoku-pc7jl
    @SonGoku-pc7jl Год назад +2

    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!!! ;)

  • @carlosraul6578
    @carlosraul6578 9 месяцев назад

    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.

  • @programandoConFelipe
    @programandoConFelipe Год назад

    Midu, más contenido de next.js 14 por favor.

  • @student1381
    @student1381 Год назад +4

    Bua midu, increible el contenido y lo que aportas a la comunidad!

  • @diegokurbi
    @diegokurbi 3 месяца назад

    Gracias por el video! me ha encantado! muy claro tus explicaciones! no te conocia y ya te empece a seguir!!!!

  • @fmaylinch
    @fmaylinch Год назад +2

    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).

    • @DigitalwebPatagonia
      @DigitalwebPatagonia Год назад +1

      es correcto, la filosofia de Nextjs es adaprtse al presente y futuro, ademas de que sea usable junto a otras tecnologías

  • @alexandevs
    @alexandevs Год назад +2

    creo de los mejores instructores sin temor a equivocarme 🎉🎉 FELICITACIONES 🎉🎉

    • @alvarotorres1471
      @alvarotorres1471 7 месяцев назад

      Yo diría el mejor jaja
      Bueno, al parejo con el buen Fazt

  • @Frlawer
    @Frlawer Год назад +21

    Soy backend PHP y me voy a poner con next xq le veo mucho futuro. Me pasó al bando fullstack

    • @rodolfolopezp
      @rodolfolopezp 10 месяцев назад

      No se va a arrepentir. La sintaxis de React y Next.js es mucho mas manejable que PHP. Es el presente y el futuro.

    • @pepito7773
      @pepito7773 2 месяца назад

      🗿

  • @marcopat01
    @marcopat01 Год назад +26

    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

  • @carlosdiazreyes9849
    @carlosdiazreyes9849 Год назад

    Ya era hora! un sistema de enrutado como el de CI2, por archivos. Un tuto excelente!

  • @tadeoandresperez251
    @tadeoandresperez251 Год назад

    Muy épico, vengo de Laravel estoy aprendiendo next muy buenas cosas tiene next

  • @mariojuniortorresperez7837
    @mariojuniortorresperez7837 8 месяцев назад

    Casi 2 horas de contenido valioso. Muchas gracias Midu

  • @polloricopollo9036
    @polloricopollo9036 Год назад +1

    midudev eres una bendición para el mundo

  • @Luis-tt2br
    @Luis-tt2br Год назад +4

    Muchas gracias por todo el contenido que traes para la comunidad.

  • @frako23
    @frako23 7 месяцев назад +1

    tremando titurial midu! gracias, ya es la segunda vez que lo veo y no creo que sea la última jajajaja

    • @midulive
      @midulive  7 месяцев назад +1

      Muchas gracias amigo!

  • @contrerasgarciaangel6614
    @contrerasgarciaangel6614 11 месяцев назад +1

    Que emoción❤❤❤❤❤, no puedo esperar por este contenido de auténtica calidad😂😂😂❤❤

  • @EzeCriis
    @EzeCriis 11 месяцев назад

    Terrible video Midu, sos crack gracias por siempre transmitir tus conocimientos! Abrazo, buen año

  • @josephito27
    @josephito27 Год назад +2

    Midu eres increíble 🥹❤

  • @julian8522
    @julian8522 Год назад

    El mas grande Midu, gracias por tanto, ojala tengamos en algun momento como pagarte tanto conocimiento transferido!!

  • @tony96sosa
    @tony96sosa 9 месяцев назад

    Excelente contenido. Gracias Midu!

  • @fraineralex
    @fraineralex Год назад

    Más simple de ahí imposible, gracias midu!

  • @coff3andprograming
    @coff3andprograming 7 месяцев назад +1

    ¡Joder!, buenísima la info

  • @juniorromero2539
    @juniorromero2539 Год назад

    ya se que voy a hacer este fin de semana. Gracias midu♥

  • @erickrh
    @erickrh 8 месяцев назад

    Gracias por este gran aporte viejo, eres el mejor.

  • @lackcsgo6750
    @lackcsgo6750 Год назад

    impresionante la magia que hace nextjs

  • @kendryfinol7665
    @kendryfinol7665 Год назад +1

    Gracias Midu, te amo

  • @sergioortegadev
    @sergioortegadev 4 месяца назад

    Excelente e impecable tu explicación! gracias

    • @midulive
      @midulive  4 месяца назад

      Gracias a ti!

  • @LithiumFireX
    @LithiumFireX Год назад

    Invaluable este video. Muchas gracias!

  • @Hikari-ir5yt
    @Hikari-ir5yt 8 месяцев назад

    @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?

  • @Ferminmolinuevo
    @Ferminmolinuevo 3 месяца назад

    Excelente tutorial! Muchas gracias!!

  • @HEAVYMETAL80tas
    @HEAVYMETAL80tas 11 месяцев назад

    Qué agradable sujeto!🍷

  • @v3.14
    @v3.14 Год назад +2

    buen video midu! ya lo vi 3 veces

    • @TornVeil7
      @TornVeil7 Год назад

      Y eso que lo subió hace 5 minutos, qué crack

  • @MaxClintonHarriganChatergoon
    @MaxClintonHarriganChatergoon Год назад +2

    Muchas gracias midu 🫂

  • @JonathanRamirez-ep9hd
    @JonathanRamirez-ep9hd Год назад +2

    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 🫶🏼🫡

  • @coroyangelitabaylando
    @coroyangelitabaylando Год назад

    Saludos desde Xalapa, Veracruz, México , gracias por todo tu contenido

  • @JorgeHernandez-jp2vu
    @JorgeHernandez-jp2vu Месяц назад

    Hola midu, Estoy aprendiendo y resulta que ya está next en la versión 15, puedes hacer un video sobre los cambio, si es posible un directo :3

  • @yavallejo
    @yavallejo 10 месяцев назад

    Excelente Video, Gracias por compartir lo que sabes, un saludo

  • @dngmyth6347
    @dngmyth6347 Год назад

    Midu sos el mejor, te amo

  • @tomymarengo
    @tomymarengo Год назад

    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.

  • @diarioparaemprendedores
    @diarioparaemprendedores 10 месяцев назад +1

    Vengo a Disfrutar

  • @PauDevelop
    @PauDevelop Год назад

    Excelente contenido como siempre!!

  • @jorgeandreshernandezfernan6977
    @jorgeandreshernandezfernan6977 Месяц назад

    1:10:38

  • @Magistrado1914
    @Magistrado1914 9 месяцев назад

    Excelente tutorial.
    Visto en 02/03/2024

  • @DAVIDIL81
    @DAVIDIL81 Год назад +2

    Pero Midu, con el en qué queda el loading.tsx? ya no sirve? una cosa sustituye a la otra?

  • @jostinjonimolinahernandez3310
    @jostinjonimolinahernandez3310 5 месяцев назад

    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.

  • @nelson6e65
    @nelson6e65 Месяц назад

    1>37 Como Inertia.js con Laravel, que simula una SPA sin ser una SPA completamente y dejando a Laravel manejar el enrutamiento con todo lo que involucra.

  • @CosmeValeraReales
    @CosmeValeraReales 9 месяцев назад

    14:00 Cual es la vs code extension para que agrupe los ficheros de configuración dentro del package.json ?

  • @gasprograma
    @gasprograma Год назад +1

    Muy buen video!

  • @rodolfolopezp
    @rodolfolopezp Год назад +1

    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

  • @HANSACEROHERNANDEZ
    @HANSACEROHERNANDEZ 5 месяцев назад +1

    en el proceso de base de datos : postgres como se haria la conexion con sql server?

  • @Jonavoe
    @Jonavoe Год назад

    Gracias por el video Midu!

  • @mauroleonardi390
    @mauroleonardi390 Год назад

    Midu!! genial el contenido muchas gracias!! Habra parte 2??

    • @midulive
      @midulive  Год назад +1

      Por supuesto! Este jueves en directo en Twitch

  • @Murzbul
    @Murzbul Год назад

    Está buenisimo lo que tiene nextjs ahora! Lo de server components es extraordinario, aunque rompe con atomic design pero bueno es lo de menos.

  • @tadeoandresperez251
    @tadeoandresperez251 Год назад

    Esperando el siguiente video

  • @yovaxox
    @yovaxox Год назад

    Excelente. Gracias Midu!

  • @ArielLopezMkultra
    @ArielLopezMkultra Год назад

    Sos un genio midu :)

  • @celarcon
    @celarcon Год назад +3

    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?

    • @Lanzelord
      @Lanzelord Год назад

      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

  • @jere4385
    @jere4385 Год назад +3

    Excelente video!, pero podrias dar un curso desde cero orientado al backend. Gracias sos un genio 🇦🇷

    • @felipebuitrago9115
      @felipebuitrago9115 Год назад

      ¡Hola! De pronto esta playlist de los videos de Midu sobre NodeJS desde Cero es lo que estas buscando:
      ruclips.net/p/PLUofhDIg_38qm2oPOV-IRTTEKyrVBBaU7

  • @sergioariela.mondino8479
    @sergioariela.mondino8479 7 месяцев назад

    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?

  • @dogcitydog
    @dogcitydog 3 месяца назад +1

    Hola… una duda que tengo con el despliegue o donde montar la app. Tengo un proyecto creado el frontend SSR con Nextjs 14 y el backend en Nestjs con microservicios. Mi duda es en que cloud es mas conveniente montar estos sistemas, AWS, Azure, Google, Vercel, Rerender, Railway, etc. y si tienen documentación o videos de apoyo se los agradecería mucho…
    Gracias a todos.
    Saludos.

  • @alanlopez-in3ur
    @alanlopez-in3ur Год назад

    hola midu como agrupas las configuraciones en el packetjson minuto 13:12 buen curso saludos

  • @yazid113
    @yazid113 11 месяцев назад

    Hola @midu una consulta si yo trabajo como front y otro desarrollado se encarga del back en C# vale la pena usar next?

  • @marcosmorandeira
    @marcosmorandeira 6 месяцев назад

    Se puede ustilizar SWR con el prefecthing?

  • @carlosterrazas8913
    @carlosterrazas8913 Год назад

    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.

  • @marliote
    @marliote Год назад

    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)

  • @Br4dButt0wski
    @Br4dButt0wski 3 дня назад

    Ahora que ya salió nextjs 15, puedo aprenderlo con tutoriales de v13 y/o v14? O no son compatibles?

  • @varaskkar
    @varaskkar Год назад +1

    ¿Como conectas a una BD local? En el ejemplo se conecta en remoto con Vercel

  • @risehit
    @risehit 11 месяцев назад

    Saben si en nextjs se usa la estructura de carpetas: serc/pages, src/utils, etc. por ende, quitando la carpeta app en src/app?

  •  5 месяцев назад

    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?

  • @ragknar2401
    @ragknar2401 Год назад

    Buenisimo midu 🤩

  • @colommbiano
    @colommbiano 8 месяцев назад

    maestro en NextJs 14 como recomiendas mejor nombrar a las carpetas y archivos de .tsx ? colocandole guion medio o usando camelcase, he visto ha mucho que llaman a las capertas y a los archivos colocandole el guion medio que me recomiendas ?

  • @samuelmayo28
    @samuelmayo28 Год назад

    hola, muy buen video. podrias comentar cuales extenciones usas? alguien sabe?

  • @gabrielgomez7290
    @gabrielgomez7290 Месяц назад

    Crack👏🏼

  • @angelmora8700
    @angelmora8700 20 дней назад

    Me encanta NextJS, pero he tratado de seguir este video curso, pero he quedado estancado ahora porque hoy 7/12/24 me aparece nuevas formas de crear bases de datos con vercel y no las logro entender, serias tan amable de explicarlas, aparecen NEON, UPSTASH, Supabase, Redis Cloud y EdgeDB pero no he podido continuar, te agradezco la ayuda

  • @lebaf8661
    @lebaf8661 9 месяцев назад

    ¿Cual se supone es la diferencia entre getstaticprops y "use server", ¿son lo mismo o son similares?

  • @joakuvideo
    @joakuvideo Год назад +2

    Cómo se agrupan los config dentro de package.json en vscode? Es una extensión?

    • @kerneldiego
      @kerneldiego Год назад

      Me quedé pensando lo mismo 🤔

    • @lucasgustavodiaz
      @lucasgustavodiaz Год назад

      Solo tenes que activar la opción de file nesting

    • @lucasgustavodiaz
      @lucasgustavodiaz Год назад +2

      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

    • @kerneldiego
      @kerneldiego Год назад

      @@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

  • @manuelrobertoserranotorres8593
    @manuelrobertoserranotorres8593 6 месяцев назад

    Como haces para que el autocomplete te genere opciones de tailwindcss

  • @diegotale4608
    @diegotale4608 Год назад

    amigo midudev, es necesario saber ya de react para empezar con next

  • @fernandososa2107
    @fernandososa2107 9 месяцев назад

    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

  • @JosuéBedoya-f1q
    @JosuéBedoya-f1q 9 месяцев назад

    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.

  • @AlexisGarcia-z4o
    @AlexisGarcia-z4o 11 месяцев назад

    que extensión usas en code? veo que te predice código al escribir algo.

  • @ManuLeivaOk
    @ManuLeivaOk Год назад

    Tengo un problema en una app hecha en Next 13.4.
    Al hacer un Fetch en un client component (use client), la primer consulta la hace bien a base de datos pero después siempre me toma datos de caché en el servidor... Por lo que si hago un Abm de usuarios, no actualiza la info.

  • @mobilgamemix6384
    @mobilgamemix6384 Год назад +1

    Hola Midu, como hiciste para aprender todo este entorno de desarrollo en la web, soy nuevo y hace 2 semanas que veo tus videos, cual es tu plan de estudio o cual fue el orden de las cosas para aprender y el horario, me gusta en mundo web en todo sus aspectos, saludos y abrazos.

  • @cl3on482
    @cl3on482 Год назад

    Impresionante

  • @dira4734
    @dira4734 Год назад

    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

  • @QGSantiago
    @QGSantiago 7 месяцев назад

    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?

  • @user-tecno-racc4nov2023
    @user-tecno-racc4nov2023 Год назад

    amigo me sale un error en 6:36 , ala hora de instalar.. erro. ya tengo instalado la version de node.js v18.18

    • @user-tecno-racc4nov2023
      @user-tecno-racc4nov2023 Год назад

      hasta aqui me quede
      ruclips.net/video/jMy4pVZMyLM/видео.html
      no se que dijo de un servidor