/podcastnext

Developing a website application using Next.js

Primary LanguageTypeScript

Postcard

Developing a website application using Next.js

Projeto finalizado com sucesso...

📚 Aprendizado 🤓

  • Renderização no servidor - Server Side Rendering - SSR: Quando as pessoas perceberam que colocar muito código JavaScript no lado do cliente era um problema, eles pensaram em uma alternativa para renderizar esse código no lado do servidor. E assim surgiu o NextJS um framework criado em cima do ReactJS que usa a renderização do lado do servidor ou Server Side Rendering popularmente conhecido como SSR O SSR funciona da seguinte maneira, ao acessarmos um site por exemplo alura.com.br enviamos uma requisição para o servidor para acessar a página inicial do site, então o servidor manda uma requisição para uma rest api por exemplo pedindo essa pagina inicial. Uma vez que os dados são recebidos o servidor renderiza uma página HTML com o conteúdo e envia para o cliente exibindo assim o conteúdo na página, se a pessoa acessar outra rota por exemplo alura.com.br/artigos o processo continua o mesmo.

Utilizando o conceito do SSR continuamos o desenvolvendo com React, o que é bom, porque podemos manter a tecnologia que gostamos e a pessoa que está como visitante do nosso site obtém um documento HTML simples, que no final gera um grande aumento de desempenho. E não é só isso, o NextJS ainda tem outras vantagens.

  • Geração de estáticos - Static Site Generation - SSG: O NextJS também possibilita a criação de sites estáticos, que são aqueles sites sem muita interação com o usuário, com pouca ou quase nenhuma mudança na interface, por exemplo uma página de venda de um produto que vai ficar no ar por uma semana.

Então nesse caso teríamos todo conteúdo estático e um formulário que seria usado para coletar os dados das pessoas que tem interesse no produto, esse formulário sim precisaria de interação e para isso, na documentação do NextJS é indicado o uso da função getStaticProps.

font:Alura

🛠 Tecnologias

As seguintes ferramentas foram usadas na construção do projeto:

🎓 Estudante da NLW



Lucas

Feito com ❤️ por Lucas Leite 👋🏽