Pessoal, pequena observação: Durante a gravação desse vídeo, o meu site (bergdaniel.com.br) tinha sido feito em React, mas agora eu re-criei ele com NextJS. E eu usei o SSG do Next, ou seja, meu site é 100% estático, o SEO está bem melhor e não existe mais nenhum tempo de loading em nenhuma página (por que elas já estão renderizadas, inclusive a aba de cursos).
Cara sensacional a explicação, me fez abrir a mente para mais possibilidades, assim como você disse pensava que o ReactJS ia resolver todos os meu problemas. Parabéns pelo vídeo!!
Muito foda seu conteúdo, parabéns!! Conheci seu canal só agora e já tô amando! Só achei seu video explicando todo o conceito sobre SSR e suas diferenças. Já virei seu fã 🚀👏🏾
bom dia, gostei do seu conteúdo e da forma como tu explica, poderia fazer uma minissérie sobre como usar a API do youtube integrado com o react né, ensinando como fazer a validação da conta google pra usar a API e posteriormente como usar isso com o react
Que vídeo foda, sou iniciante consegui entender tudo, me deu até uma explosão mental tipo aquele meme kkkkkkk. Consegui entender o pq esses freamworks foram criados, quais problemas eles resolvem, vantagens e desvantagens, etc. muitos vídeos não falam sobre isso. Poderia fazer mais vídeos assim só que falando de outros assuntos
Vídeo INCRÍVEL, todas as duvidas que eu tinha em relação,o que é o next ou gatsby e aonde utilizar cada um, quando abi o vídeo vi que tinha 30 minutos e pensei que iria assistir somente o necessário, mas dps de 10 minutos vidrado absorvendo todo o conteúdo nem vi passando esses 30 minutos, vídeo incrível pra quem quer iniciar um novo projeto ou pesquisar sobre o assunto
@@DanielBergholz Cara que vídeo bom, eu precisava começar um novo projeto no meu estágio e sempre tive a duvida do que são essas tecnologias que eu olhava muito nos seus stories, e dps de ver o vídeo encontrei a minha resposta, usar react, pois o que irei criar se esconde atras de uma página de login, então tenho que agradecer por você ter me salvado de talvez estudar algo que no momento seria desnecessário e atrasaria minha jornada.
Cara, parabéns pelo conteúdo de qualidade, esses são conceitos básicos que todo "frontender" deveria saber e vc explicou tudo de uma forma bem intuitiva!
Excelente video irmão. Lucidez demais sua elaborar esse vídeo. Pensamento a diferença entre as soluções muito bem formatada na sua mente. A base é tudo, library é śo uma ferramenta. Parabéns.
E eu aqui maravilhado com o laravel 😂, fiz um curso d reactjs da rocketseat mas preciso fazer um portifólio pra mim, vou d next até mesmo pra servir d aprendizado, o futuro é next, como o próprio nome sugere, parabéns vercel, e valeu pelo conteúdo Man, ganhou mais um inscrito 😁
Parabens pelo canal mano, muito bom todos os conteúdos. Sou iniciante em programação, comecei de cara nesse mundo este ano (final de janeiro). De la pra ca venho estudando para ser Fullstack javascript. Consegui um emprego de forntend (um estágio na verdade) mes passado, 100% remoto, mas está me ajudando a consolidar meus conhecimentos em javascript e linguagens de marcação. Semana que vem começo o bootcamp GoStack. Seu canal tb me ajudou nessa minha caminhada, os conteúdos que você trabalha são extremamentes pertinentes para quem está começando. Meus Parabens!...e continue nos ajudando,rs
Recentemente eu estou tentando trazer alguns assuntos mais teóricos, para ajudar os iniciantes a entender toda a mágica que rola por baixo dos panos. E hoje foi a vez de entender de uma vez por todas as diferenças entre as arquiteturas de frontend
Muito bom ! Primeira vez vendo essa diferença, mas ja tinha visto antes ainda sim tinha duvidas , foram esclarecidas..... Video de dicas para free lance First Freelaa
Caramba Daniel que conteúdo foda véy, cara quem sou eu para pedir algo aqui, mas se poder falar mais sobre esse conteúdo ficarei muito grato, acredito que a comunidade também, vlw man acompanhando a um tempo
Eu fiz esse vídeo exatamente por que eu quero falar mais sobre isso no meu canal! E fique tranquilo, que semana que vem o vídeo vai ser sobre SSG no Gatsby
vídeo massa em daniel estou iniciando no desenvolvimento web focado no front-end e tinha essa duvida esclareceu na minha cabeça agora parabéns !! conteúdo foda
Interessante, cara nunca trabalhei como freelance, mas na epoca quando começei a trabalhar usava eu aprendi React para SPA, mas caso eu queira gerar Um site estático usava EJS já ouviu falar dele? Acho que quase ninguém conhece.
Obrigado por compartilhar conhecimento. Caro, suponha que eu crie um site estático no vue, nutx ou outro framework. É possível eu fazer ele ser dinâmico mas no lado do cliente? Uma vez que o framework é javascript no fim das contas, durante a build os js serão salvos contamente com os htmls e css. O browser do visitante se encarregaria de remontar o html de acordo com as buscas da api que o cliente requisitar? Se sim isso se encaixaria em qual caso exposto seu vídeo?
Muito bom . parabéns. Me inscrevi 😎🥳. A respeito de Sistemas corporativos, do qual não preciso de SEO. (Dashboard, gráficos, tabelas, cadastros) Vale a pena usar o next.Js ou React normal. Estou começando um projeto mas estou com nessas dúvidas
Eu achei que o reddit usava next rs. Então, o Facebook usa o react + umas outras 200 bibliotecas pra tornar possível a indexação de páginas em uma aplicação react. Não sei exatamente qual melhora o SEO, mas tem umas libs que eu vi que fazem o seguinte: Detectam quem está acessando a página. Se for um usuário, o servidor manda o site em react. Se for um bot de indexação do Google, manda uma página renderizada no servidor
Em relação ao ssr, ele é usado quando precisa atualizar com frequencia os dados, mas o que impediria eu ter uma página estática que mapeasse os dados de uma api externa. Ela já se atualizaria imediatamente de acordo os dados buscados Porque usar ssg sabendo disso.. se alguem souber por favor me responde
Ah entendi. Mas se você mapear os dados de uma API usando o SSG, em tempo de build que seu site ia consumir a API. Então o site fica atualizado somente até o último dado retornado pela API na hora do último build. E se você quiser atualizar o seu site estático, você precisaria fazer um build de novo
Massa o video! cara mas vc fez esse site que vc mostrou com react entao como vc fez as rotas sem utilizar a hash-router?? quando eu faço o deploy com react usando rotas normais como ' /blog' o react não carrega as páginas pq não faz requisições com o servidor, tem sempre que usar aquelas rotas com hashtags no inicio eu acho muito feio como vc fez dessa forma as rotas com react??
Tecnicamente falando, o react "não tem rotas", por que não existe um servidor por trás fazendo isso. O que acontece é o seguinte: A gente usa uma biblioteca que simula o funcionamento de rotas no React, ela se chama react router
Existem muitas pessoas que tentam implementar SSR no react, aí eles geralmente fazem um combo entre react e node.js com express. Tem como fazer, mas dá muito mais trabalho do que simplesmente usar a solução pronta do next
@@DanielBergholz Então, eu ouvi sobre react ssr a aproximadamente 1 mes atras quando li em um grupo de react (pessoas comentando sobre SEO). Se vc procurar no google vc acha algo no site da NPM, mas sabemos que isso n significa mt coisa, pode ser uma lib qualquer mal feita. Mas se procurar no YT vc ve alguns videos gringos falando de react ssr, alguns com expressjs. Eu sei que se vc procurar no google pode cair nesse site tambem: blog.rocketseat.com.br/ssr-nextjs-reactjs/ Que comenta o fato de usar o react + nextJS. Se procurar com a palavra git acha varios reps. A verdade é que estou pesquisando ainda, estou fazendo um site que vai ter atz constante por usuarios (como add fotos e comentarios), e ele esta quase pronto e foi feito inteiramente no react (é um site bem grande). Estou vendo SEO agr e não sei qual caminho vou tomar agr. Tenho que ver outra lib do react tb (que esqueci o nome agr, react king? nao, fugiu o nome kkkk)
Ah sim, achei alguns pacotes do npm com o nome "react-ssr", e pelo o que eu vi é uma junção do react com o node e express mesmo. Mas sinceramente, na minha opinião vale mais a pena "reescrever" o site em next, vai te dar muito menos trabalho do que envolver o nodejs. Eu mesmo converti meu site inteiro de react pra next em 3 horas, os dois são quase idênticos no código
@@DanielBergholz o site é gigante e a equipe tem 5 pessoas, o pessoal n vai sequer cogitar a ideia kkkk. Vou ver ss tem algo a fazer de maneira externa, ou usar uma lib, express, node sla
Pessoal, pequena observação: Durante a gravação desse vídeo, o meu site (bergdaniel.com.br) tinha sido feito em React, mas agora eu re-criei ele com NextJS. E eu usei o SSG do Next, ou seja, meu site é 100% estático, o SEO está bem melhor e não existe mais nenhum tempo de loading em nenhuma página (por que elas já estão renderizadas, inclusive a aba de cursos).
Que aula é essa ???? meu amigo, outro nível de didática e qualidade 😍😍😍
Mais claro que esse video só o sol. Muito bom, sua explicação e muito boa, absorvi td. Obrigado mesmo 🙏
Meu amigo que qualidade de vídeo, muito obrigado.
Que didática incrível vsf kkkkkk, nunca tinha entendido o que era mvc e como hospedar o front end e back end, muito obrigado!
Muito obrigado pelo feedback!
Muito Obrigado, Que vídeo bom, me ajudou a entender esses conceito e oque utilizar na minha aplicação.
com certeza um dos vídeos mais explicativos do assunto, parabéns, +inscrito
Obrigado!
Cara sensacional a explicação, me fez abrir a mente para mais possibilidades, assim como você disse pensava que o ReactJS ia resolver todos os meu problemas.
Parabéns pelo vídeo!!
Muito obrigado!
Pois é, é importante entender a diferença entre as arquiteturas do frontend e saber em qual situação usar cada um
Muito foda seu conteúdo, parabéns!!
Conheci seu canal só agora e já tô amando!
Só achei seu video explicando todo o conceito sobre SSR e suas diferenças.
Já virei seu fã 🚀👏🏾
Muito obrigado! :)
Explicação sensacional, muito util e satisfatoria.
muito bom - eduardo nunes
Conteúdo excelente Daniel. Você é muito eloquente na explicação. Parabéns!
Cara que vídeo sensacional, extremamente esclarecedor.
bom dia, gostei do seu conteúdo e da forma como tu explica, poderia fazer uma minissérie sobre como usar a API do youtube integrado com o react né, ensinando como fazer a validação da conta google pra usar a API e posteriormente como usar isso com o react
Daniel, sua didática e dicção são excelentes, parabéns, excelente conteúdo, continua que teu canal vai crescer muito.
Muito obrigado! 😃
Muito bom ! Primeira vez vendo essa diferença clara !
Explicação perfeita ! Obrigado !
Explicação Perfeita!
Aula sensacional! Ganhou um inscrito
Que vídeo foda, sou iniciante consegui entender tudo, me deu até uma explosão mental tipo aquele meme kkkkkkk. Consegui entender o pq esses freamworks foram criados, quais problemas eles resolvem, vantagens e desvantagens, etc. muitos vídeos não falam sobre isso. Poderia fazer mais vídeos assim só que falando de outros assuntos
Vídeo espetacular, esclareceu bastante
Vídeo INCRÍVEL, todas as duvidas que eu tinha em relação,o que é o next ou gatsby e aonde utilizar cada um, quando abi o vídeo vi que tinha 30 minutos e pensei que iria assistir somente o necessário, mas dps de 10 minutos vidrado absorvendo todo o conteúdo nem vi passando esses 30 minutos, vídeo incrível pra quem quer iniciar um novo projeto ou pesquisar sobre o assunto
MUITO obrigado! Eu acho muito confuso todos esses frameworks e arquiteturas, então decidi fazer um vídeo sobre isso pra ajudar
@@DanielBergholz Cara que vídeo bom, eu precisava começar um novo projeto no meu estágio e sempre tive a duvida do que são essas tecnologias que eu olhava muito nos seus stories, e dps de ver o vídeo encontrei a minha resposta, usar react, pois o que irei criar se esconde atras de uma página de login, então tenho que agradecer por você ter me salvado de talvez estudar algo que no momento seria desnecessário e atrasaria minha jornada.
Que bom que deu pra te ajudar! A pior coisa que existe é você gastar uma semana estudando uma tecnologia que você não vai usar no final
Hoje em dia eu só to usando o react para aplicações atrás de um login também, de resto eu to usando o next
Cara, parabéns pelo conteúdo de qualidade, esses são conceitos básicos que todo "frontender" deveria saber e vc explicou tudo de uma forma bem intuitiva!
Muito obrigado! Pois é, são conceitos muito importantes pro dev frontend e eu infelizmente vejo poucas pessoas explicando isso
Adorei a sua explicação. Parabéns!
Queria entende melhor como funciona essa parte do SEO com o Next. Obrigada!
Excelente video irmão. Lucidez demais sua elaborar esse vídeo. Pensamento a diferença entre as soluções muito bem formatada na sua mente. A base é tudo, library é śo uma ferramenta. Parabéns.
Que bom que você curtiu o vídeo! Muito obrigado 👊
Que explicação fantástica! Muito obrigado, eu ainda não tinha entendido a diferença de forma tão clara. Valeu mesmo!
Daniel, que conteúdo absurdo cara!! Muito boa a explicação, não deixou nenhuma dúvida. Bom demais!
Fico MUITO feliz de ouvir isso! Obrigado
Show cara, matou as dúvidas
Que isso rapaz, contúdo bom demais!! Muito obrigada por trazer uma explicação tão completa do assunto, finalmente consegui compreender kkk ☺👍
E eu aqui maravilhado com o laravel 😂, fiz um curso d reactjs da rocketseat mas preciso fazer um portifólio pra mim, vou d next até mesmo pra servir d aprendizado, o futuro é next, como o próprio nome sugere, parabéns vercel, e valeu pelo conteúdo Man, ganhou mais um inscrito 😁
Muito obrigado teilor! Pois é, o futuro é Next.js + Vercel
Excelente vídeo Daniel. Muito clara e precisa sua explicação. Parabéns!
Obrigado Gustavo! 👊
toooop! esclareceu demais!!
Parabens pelo canal mano, muito bom todos os conteúdos. Sou iniciante em programação, comecei de cara nesse mundo este ano (final de janeiro). De la pra ca venho estudando para ser Fullstack javascript. Consegui um emprego de forntend (um estágio na verdade) mes passado, 100% remoto, mas está me ajudando a consolidar meus conhecimentos em javascript e linguagens de marcação. Semana que vem começo o bootcamp GoStack. Seu canal tb me ajudou nessa minha caminhada, os conteúdos que você trabalha são extremamentes pertinentes para quem está começando. Meus Parabens!...e continue nos ajudando,rs
Caraca, muitíssimo obrigado pela mensagem!! Eu fico muito feliz de saber disso
Recentemente eu estou tentando trazer alguns assuntos mais teóricos, para ajudar os iniciantes a entender toda a mágica que rola por baixo dos panos. E hoje foi a vez de entender de uma vez por todas as diferenças entre as arquiteturas de frontend
Muito bom ! Primeira vez vendo essa diferença, mas ja tinha visto antes ainda sim tinha duvidas , foram esclarecidas..... Video de dicas para free lance First Freelaa
Caramba Daniel que conteúdo foda véy, cara quem sou eu para pedir algo aqui, mas se poder falar mais sobre esse conteúdo ficarei muito grato, acredito que a comunidade também, vlw man acompanhando a um tempo
Muitíssimo obrigado 👊
Eu fiz esse vídeo exatamente por que eu quero falar mais sobre isso no meu canal! E fique tranquilo, que semana que vem o vídeo vai ser sobre SSG no Gatsby
vídeo massa em daniel estou iniciando no desenvolvimento web focado no front-end e tinha essa duvida esclareceu na minha cabeça agora parabéns !! conteúdo foda
Muito obrigado! Eu mesmo me confundia muito com isso a não muito tempo atrás
Muito obrigado por esse conteúdo irmão, tô iniciando na programação web e essa dica foi de ouro!!!! Ótimo trabalho!
Obrigado! 👊
Parab[ens Show! de explica;'ao!!!
Muito obrigado!
Sensacional Daniel! Parabéns!!
Valeu!
eu te amo cara kkkkkk muito obrigado
conteudo incrivel!!!
Que aula!
Parabéns! Ótimo conteúdo muito bem explicado!
Obrigado!
Ótimo conteúdo, sua explicação foi sensacional!
Muito obrigado 👊
Muito bom Daniel, adorei o conteúdo sua explicação foi muito clara!
Valeu! 👊
Vídeo incrivel
Obrigado pelo video
Ótimo conteúdo, me ajudou muito!
Show!
Interessante, cara nunca trabalhei como freelance, mas na epoca quando começei a trabalhar usava eu aprendi React para SPA, mas caso eu queira gerar Um site estático usava EJS já ouviu falar dele? Acho que quase ninguém conhece.
Obrigado por compartilhar conhecimento. Caro, suponha que eu crie um site estático no vue, nutx ou outro framework. É possível eu fazer ele ser dinâmico mas no lado do cliente? Uma vez que o framework é javascript no fim das contas, durante a build os js serão salvos contamente com os htmls e css. O browser do visitante se encarregaria de remontar o html de acordo com as buscas da api que o cliente requisitar? Se sim isso se encaixaria em qual caso exposto seu vídeo?
Muito bom . parabéns. Me inscrevi 😎🥳. A respeito de Sistemas corporativos, do qual não preciso de SEO. (Dashboard, gráficos, tabelas, cadastros) Vale a pena usar o next.Js ou React normal. Estou começando um projeto mas estou com nessas dúvidas
Obrigado Alex!
Se você já tiver conhecimento em react.js e não precisa de bom SEO, dá pra usar o react de boa
Aula incrível!
SSR pode ser chamado de Universal Apps???
Muito top os vídeos, Oooook? 🤣
top man top
16:54 mas e no caso por exemplo, o Facebook e reddit que usam React? Como que conseguem um SEO "bom"?
Eu achei que o reddit usava next rs. Então, o Facebook usa o react + umas outras 200 bibliotecas pra tornar possível a indexação de páginas em uma aplicação react. Não sei exatamente qual melhora o SEO, mas tem umas libs que eu vi que fazem o seguinte: Detectam quem está acessando a página. Se for um usuário, o servidor manda o site em react. Se for um bot de indexação do Google, manda uma página renderizada no servidor
Em relação ao ssr, ele é usado quando precisa atualizar com frequencia os dados,
mas o que impediria eu ter uma página estática que mapeasse os dados de uma api externa.
Ela já se atualizaria imediatamente de acordo os dados buscados
Porque usar ssg sabendo disso.. se alguem souber por favor me responde
Então, na verdade o ssg é usado para sites que não mudam muito. Pq o site final é estático.
@@DanielBergholz ata saquei, editei o comentário na verdade eu quis dizer ssr ao invés de ssg
Ah entendi. Mas se você mapear os dados de uma API usando o SSG, em tempo de build que seu site ia consumir a API. Então o site fica atualizado somente até o último dado retornado pela API na hora do último build. E se você quiser atualizar o seu site estático, você precisaria fazer um build de novo
Eu respondo exatamente essa sua pergunta no início desse vídeo: ua-cam.com/video/0-W5lak4NYY/v-deo.html
@@DanielBergholz valeu! sanou minha dúvida, obrigado. + 1 inscrito! seu conteúdo é perfeito.
Mesclar o Gatsby com o React seria o ideal então? Os dois funcionam bem juntos?
O gatsby é construído em cima do react, então tudo que o react tem, o gatsby tambem tem. Se quiser usar o gatsby ou o next, pode usar eles sozinhos
Zerou o joguim
Massa o video!
cara mas vc fez esse site que vc mostrou com react
entao como vc fez as rotas sem utilizar a hash-router??
quando eu faço o deploy com react usando rotas normais como ' /blog'
o react não carrega as páginas pq não faz requisições com o servidor,
tem sempre que usar aquelas rotas com hashtags no inicio eu acho muito feio
como vc fez dessa forma as rotas com react??
Tecnicamente falando, o react "não tem rotas", por que não existe um servidor por trás fazendo isso. O que acontece é o seguinte: A gente usa uma biblioteca que simula o funcionamento de rotas no React, ela se chama react router
reactrouter.com/
Poderia falar de React SSR?
React SSR é alguma biblioteca pra react? Nunca usei
Existem muitas pessoas que tentam implementar SSR no react, aí eles geralmente fazem um combo entre react e node.js com express. Tem como fazer, mas dá muito mais trabalho do que simplesmente usar a solução pronta do next
@@DanielBergholz Então, eu ouvi sobre react ssr a aproximadamente 1 mes atras quando li em um grupo de react (pessoas comentando sobre SEO).
Se vc procurar no google vc acha algo no site da NPM, mas sabemos que isso n significa mt coisa, pode ser uma lib qualquer mal feita.
Mas se procurar no YT vc ve alguns videos gringos falando de react ssr, alguns com expressjs.
Eu sei que se vc procurar no google pode cair nesse site tambem: blog.rocketseat.com.br/ssr-nextjs-reactjs/
Que comenta o fato de usar o react + nextJS.
Se procurar com a palavra git acha varios reps.
A verdade é que estou pesquisando ainda, estou fazendo um site que vai ter atz constante por usuarios (como add fotos e comentarios), e ele esta quase pronto e foi feito inteiramente no react (é um site bem grande). Estou vendo SEO agr e não sei qual caminho vou tomar agr.
Tenho que ver outra lib do react tb (que esqueci o nome agr, react king? nao, fugiu o nome kkkk)
Ah sim, achei alguns pacotes do npm com o nome "react-ssr", e pelo o que eu vi é uma junção do react com o node e express mesmo. Mas sinceramente, na minha opinião vale mais a pena "reescrever" o site em next, vai te dar muito menos trabalho do que envolver o nodejs. Eu mesmo converti meu site inteiro de react pra next em 3 horas, os dois são quase idênticos no código
@@DanielBergholz o site é gigante e a equipe tem 5 pessoas, o pessoal n vai sequer cogitar a ideia kkkk. Vou ver ss tem algo a fazer de maneira externa, ou usar uma lib, express, node sla
Ou seja, essa pirueta toda é por culpa do google.
Kkkkkkkkkk sim
@@DanielBergholz obrigado, gostei muito do seu canal, vou maratonar a série de nextJS.