Next.js (Renderização React no Lado Servidor) // Dicionário do Programador

🧠 𝗘𝗦𝗧𝗨𝗗𝗘 𝗡𝗔 𝗔𝗟𝗨𝗥𝗔 𝗖𝗢𝗠 𝗗𝗘𝗦𝗖𝗢𝗡𝗧𝗢 → codft.me/alura
Como renderizar os componentes do React.js no lado servidor? Talvez a melhor pergunta seja, por que renderizar o React no servidor? Nós temos essas respostas nesse vídeo sobre Next.js, o Framework React que se autodenomina para produção.
Vamos entender melhor como essa renderização híbrida pode ajudar a escalar os projetos React, incluindo suporte ao Typescript, Route Pre-fetching, Smart Building e muitos mais.
📡 𝗦𝗶𝗴𝗮 𝗮𝘀 𝗿𝗲𝗱𝗲𝘀 𝗱𝗼 𝗖𝗗𝗙𝗧𝗩
→ linktr.ee/codi...
📸𝗜𝗻𝘀𝘁𝗮𝗴𝗿𝗮𝗺
→ / codigofontetv
☕ 𝗖𝗹𝘂𝗯𝗲 𝗱𝗼𝘀 𝗖𝗗𝗙𝘀 𝗻𝗼 𝗬𝗼𝘂𝘁𝘂𝗯𝗲
→ codft.me/clube...
𝑵ó𝒔 ❤️ 𝒓𝒆𝒄𝒆𝒃𝒆𝒓 𝒑𝒓𝒆𝒔𝒆𝒏𝒕𝒆𝒔, 𝒄𝒂𝒓𝒕𝒂𝒔, 𝒃𝒓𝒊𝒏𝒅𝒆𝒔 𝒆 𝒎𝒊𝒎𝒐𝒔.
Caixa Postal: 91735 - Cep: 25620-972
Petrópolis / RJ
🤝 Roteiro em colaboração com Hebert Barros
💻 Edição e Áudio: RW Studio
🔗 Um vídeo do site Código Fonte
#NextJS #React #JavaScript #Typescript

[@AMJr1974]

Atualmente estamos migrando as páginas e aplicações Web, da empresa em que trabalho, de PHP para NEXT..JS e digo que está sendo um desafio agradável. Tive que aprender PHP para entrar nessa empresa, mas confesso que sempre fui fã do NEXT.JS, então com a chegada de mais 2 novos DEV's para o time (que também preferem NEXT.JS) e com a necessidade de atualizar as páginas e aplicações web da empresa, não teve outra, optamos pelo NEXT.JS.

[@computacaosemdrama9080]

Quer aprender na moral Next.js, MongoDB, Fastify, Redis e Kafka? O CrazyStack Node e React do devdoido é o barato certo.

[@vitalvesneto]

Uso NexttJS desde o início desse ano (2020) e confesso que foi amor a primeira vista. Inclusive com o deploy na Vercel integrado ao GitHub. Ficou uma delícia!

[@computacaosemdrama9080]

Se tu quer pegar os macete de Next.js, MongoDB, Fastify, Redis e Kafka, o CrazyStack Node e React do devdoido é a fita.

[@davidluz6911]

Eu tenho a impressão de que os paradigmas de desenvolvimento andam em circulos. Maior feature do Next (Renderize o frontend no lado servidor) - Exatamente como o PHP faz.

[@ViniciusValente]

PHP só não. ASP, .NET, JAVA...

[@cleibermagrelo]

Cheguei antes do BOMBEIRO que largou tudo e virou DEV! 🤪 Parabéns casal, adoro o quadro e sei que é sempre uma aula os assuntos abordados! 🔝🔥

[@nelson.costa.dev2536]

Kkkkk

[@user-ym2ec2bw1y]

Verdade esse cara ta em todo lugar kkkk

[@ramonpaolomaran2253]

KKKK boa

[@pedroimpulcetto]

😂😂😂😂😂😂😂 Manooo, essa foi a melhor!!!!! Kkkkkkkkkkk 🚒👩‍🚒🧯 Valeu por lembrar 👊🏻👊🏻👊🏻 Tamo junto

[@salvimateus]

kkkkkkkkkkkkkk boa aquele retadadu deve ser louco por CONFETE

[@LeonardoLuzx]

ninguém supera o php

[@gustavobozetti8880]

ent pq sua ft de perfil é o JS?

[@xkkll7]

KKKKKKKKKKKKKKKKK ​@@gustavobozetti8880

[@pedrocosta9769]

Eu achei meio coisado aprender componentização com React e depois não usar componentização no Nextjs, já que o usa o código todo numa página só. Não devemos usar componentização com Nextjs?

[@IcaroFelix2023]

Nextjs, algo que inventaram para tentar ser equivalente ao poder do Angular

[@csharpiro]

caraca essas soluções Next.js, Nuxt.js, Angular Universal, Blazor... Todas herdaram o modelo de desenvolvimento do Meteor.js... alguém ai conhece? ja fazia esse desenvolvimento "isomorfico" lá atrás... mas mt bacana

[@vitorbmx4927]

Já ouvi falar, inclusive é recomendado entre os melhores frameworks para nodejs

[@ViniciusValente]

Eu usava o Next para gerar páginas AMP. Apos atualizar as bibliotecas não estou conseguindo gerar as páginas AMP. Acho que vou matar esta opção no meu projeto.

[@w.farias]

caramba que tecnologia promissora. primeira vez que ouvi falar nela, já vou dar uma estudada.

[@heliocorreia1359]

Gostaria de sugerir o tema Laravel LiveWire. Laravel já era facil e com essa lib, imagina como vai ser daqui pra frente usar php realtime sem precisar programar em javascript

[@Bruno87198]

Legal, não sabia da existência desse LiveWire, interessante.

[@heliocorreia1359]

@@Bruno87198 Tem um melhor ainda para laravel. O InertiaJS

[@DouglasBaLo]

tem que inventarem alguma modinha javascript pra vender mais cursos, mais inutilidades....Empresa séria não está nem ai pra essas besteiras, querem uma coisa prática e que resolva com o menor custo de manutençao.

[@jonatasrosamoura9666]

Por enquanto estou mais no react e typescript, mas fiquei bem curioso para mexer com esse framework

[@新納ジョエル]

Olá tem como fazer o de assembly queria saber mais sobre ele muito obrigado😊

[@felipef6300]

Acho justo falarem de B.I 😌 eu sei, sei que não é DEV, mas se for incluso conosco...ótimo!

[@ronaldoribeirodesousa5837]

Quero deixar aqui a minha sugestão para um próximo vídeo sobre renderização do lado do servidor - Server Side Rendering . Mas usando Vue com Nuxt.js

[@JuniorLourenco789]

Continuem com o dicionário, por favor. Um vídeo melhor que o outro. Melhor casal

[@felipeoliveira-ml6tu]

Estou pensando em fazer meu tcc utilizando nextjs, dps desse video e outros estou quase decidindo optar por usar

[@giulio_sa]

Melhor casal da programação

[@ALEXANDROJSILVA]

Uhuhuhuhu sou a segunda pessoa a ver o vídeo.

[@rebecapedrosa9529]

Adoraria ver vocês falando sobre Svelte js!

[@Dom_Wicly]

php tem tanta framework de coisas óbvias assim? pq fala sério kkkk

[@canarilmachado]

Amei o comentário do php hahahahahahhahahaha

[@rparana]

Trabalho com Nuxt que é o next para o VUEjs. Pode reservar o próximo dicionário para ele 🤣🤣

[@denneraladim6190]

qual a biblioteca next ou react é a melhor para desenvolvedor web front-end ?

[@romulo-henri]

Uma não anula a outra, pelo contrário, se completam.

[@robsonmonteiro6940]

Quando era Java mvc, ext, Razor, blazor e php fazendo isso era feio kkk agora que é js é lindo kkkk vai entender.

[@wesleyinacio4330]

Curva de aprendizado do js é alta por falta de verbosidade e definição de tipos. Inventaram typescript e agora os jslover acham que é melhor que java, php, etc...

[@adenilsonbrito1636]

gugu dádá... Esse casal é de mais.

[@gabuzin]

Esse carinha é fantástico. Ainda há uma curva de aprendizagem para quem somente mexeu com CRA (create-react-app), mas é algo válido a estudar. Eu particularmente só tenho utilizado ele e, os resultados são fantásticos!

[@SayconX2]

Blazor >>>>>>>>>>>>>>>>

[@trdcurso5716]

casal 1000 meus parabéns,vcs são excelentes admiro vcs dois

[@nwic]

Não consigo ver a vantagem :^|

[@kaizenpunisher]

Quando começam a fazer um framework do framework cá entre nós... algo de errado não ta certo 😂

[@frysh]

React é uma biblioteca, o Next.js é um framework do React. E não, biblioteca e framework não são coisas iguais.

[@AkariKurosaki]

É meio novo ainda, mas façam um vídeo sobre o livewire para laravel no php.

[@galavernag]

1:45 humm, TRETAAAA!!, KKK CONTEÚDO SHOW

[@rafael_1603]

Next.js é muito bm, fiz um projeto com ele

[@vasgas10]

Cara, o Dicionário do Programador sempre tira todas as minhas duvidas s2

[@moisessantanamoisaant]

Participei da quarta edição do NLW e vi o next, quando fui dar uma mexida a mais no projeto descobri as rotas do nextJS, sem falar que ele roda muito liso, npm rum dev da menos de 10 segundos já tá rodando, a aplicação react s next depois do npm start fico um tempo esperando pra iniciar. Mas o que falar dessa tecnologia que mal conheço mas já considero pakas... Kkkkkkkk

[@RiquecianoMacedo]

faz de nuxt.js

[@nelljrbr]

Não daria para renderizar uma app react no servidor utilizando o Electron tambem ?

[@lourrangeorginadecastrosil569]

Galera, sou noob ainda e estou no básico de HTML, CSS e JS, mas poderiam me ajudar a tirar um dúvida rsrsrs? Usando o Next para carregar o JS no lado do servidor é possível deixar o site mais rápido? pergunto isso, pois pelo o que eu intendi, o servidor que irá processar o código então o carregamento do arquivo será melhor ( trabalhando claro com bons servidores).

[@89msmsmsms]

Mais uma pra tentar acabar com o java kkkkk

[@ramonpaolomaran2253]

Faz um do Nuxt.js Vi uma empresa pedindo mas eu não faço a mínima ideia do que seja

[@Oculterous]

Ele é um NextJS para VueJS resumindo

[@jhonathancarneiro4045]

ah algum tempo eu vi este video, e não entendi muita coisa, hoje tempo depois volto a ver, agora trabalhando em um projeto nextjs e typescript, visão totalmente diferente, como a experiencia muda a gente.

[@itanuromero]

Fiquei esperando esse vídeo ontem, tava ansioso haha

[@crcacom]

Muitos bons assuntos. Obrigado!

[@LorhanSohaky]

Única coisa que ainda apanho para Next.js é organização de projeto grande e integração com Redux

[@evertonalauk6758]

Implementei o Redux no meu projeto Next sem dificuldade, normal. Uso também Hooks junto com Redux de boa.

[@marcuspeixoto1089]

LIKEEEEEEE!!!!!

[@mwtteixeira]

Conheci o canal por esse quadro, canal excelente e exlica muito bem pra quem é iniciante

[@felipemarinho1326]

Faltou falar que a Vercel fornece hospedagem gratis.

[@marcioaquilles]

Qual melhor next ou nuxt?

[@computacaosemdrama9080]

Se tu quer pegar os macete de Next.js, MongoDB, Fastify, Redis e Kafka, o CrazyStack Node e React do devdoido é a fita.

[@BRaNaTi]

Canal legal o de vocês! +1 inscrito

[@codigofontetv]

Seja muito bem vindo!

[@JrFreestep]

#first?

[@eliascarvalho8637]

Ahhhh, o tema que eu pedi! 😍

[@victorpinasarnault9135]

O React.js já está a 7 anos como uma biblioteca javascript mais preferida entre desenvolvedores front end.

[@PersonalXZ]

Para eu experimentar o Next.js, alguém pode me indicar um ambiente de desenvolvimento as a service, tipo note book online ou ide online ?

[@mateusisrael9825]

codesandbox

[@10MANOEL]

Aí eu tô aprendendo JS pra depois estudar React, redux, Node, Express... Aí me aparece mais um framework 😢

[@Anonimousxz]

Sei como é isso... kkkkkkkk É como ter que aprender outro idioma... pelo menos é o que sinto.. mas pelo que vi esse frameWork NextJs é como se fosse um ReactJs evoluido.. ele realmente ajuda muito com a questão toda de rotas preparadas e o CEO otimizado...ele executa tudo muito rapido também.. eu decidi me mudar pra ele, tinha aprendido React, mas o NextJs é bem semelhante e vejo que vale a pena. :D

[@pedroimpulcetto]

NextJs é até legal, mas React JS é o bicho 🚒💻

[@Thud94]

Mas next.js é feito react.js, quase a mesma coisa

[@pedroimpulcetto]

​ @Roni Azuleiro Pois é, o Next acaba "inventando" muito coisa, dai o React fica mais clean Mas é isso memo, valeu pela observação Tamo junto 👊🏼👊🏼

[@brendapereira6114]

amo os vídeos de vcs, mas queria tanto que o áudio fosse um pouquinho mais alto

[@carlosroberto5540]

Uma dúvida vcs dois já Desenvolveram mesmo ? Ou são somente TEÓRICOS ?

[@marcelom.s3202]

Quero ver mais vídeos de vcs programando....

[@elziolima8014]

Fala do Denovel e se ele presta. Vlw

[@mandrakezonkey4444]

Codigo fonte, faz um dicionário do programador com a linguagem de programação c++, e faz de algoritmos vcs falam tanto de c++ mais nem tem um dicionário dele. Quem concorda deixa o LIKE

[@pedromartinsfalleiros7721]

Link com href tá certo?

[@viniciusrangel544]

nextjs é maravilhoso...

[@MarcosFelipe-up9lc]

Top!

[@brunofelix5434]

Me adotem..kkk

[@edersonluisdasilvamarques9013]

Meu deus... que explicacao complicada.

[@PedroPauloAmorim]

Fala do Meilisearch

[@hudsondevman]

fazer SSR é mto importante em alguns casos, e o React por si só não faz. Melhor ir de PHP mesmo.

[@Oculterous]

Agora faz hehe

[@hudsondevman]

@@Oculterous de forma nativa ? sem uma configuração especifica ?

[@Oculterous]

@@hudsondevman Sim, com o NextJs

[@hudsondevman]

@@Oculterous ah sim blz. bom melhor o PHP mesmo kk

[@pedromellogomes]

fala sobre o svelte? por favor, nunca pedi nada

[@viniciustrindade6675]

O canal é bom mas a mulher é chata d+. Tinha q ser só o cara falando

[@codigofontetv]

Obrigado pela sugestão mas não. 😉

[@Anonimousxz]

Pocha... eu acho incrivel essa parceria dos dois e também seria horrivel se fosse só um dos dois apresentando.. Os dois se complementam.. é literalmente como React E Next heheheheh