• Server Components 👉 Para não usar Javascript no lado do cliente.

• Client Components 👉 Enviando somente o javascript necessário para o navegador (cliente).

• Streaming SSR 👉 Ler/escrever dados de forma parcial + Server-Side Rendering

✨ página de Feed com os posts de usuários

✨ página de New Post com os posts de usuários

👉 API-INSTAGRAM

Estas são todas as bibliotecas utilizadas neste projeto, verifique cada uma com atenção.

✨ Para criar o projeto execute este comando.

pnpm create next-app@latest instagram

🛠️ Para manter um padrão de escrita do código, instale a lib @rocketseat/eslint-config da rocketseat.

pnpm i @rocketseat/eslint-config -D 

🛠️ No arquivo .eslintrc.json do seu projeto adicione a configuração @rocketseat/eslint-config/react, da seguinte forma.

{
  "extends": [
    "@rocketseat/eslint-config/react",
    "next/core-web-vitals"
  ]
}

🛠️ Para instalar o designer system do hambre lojas @labex-hambre-ui, instale executando o seguinte comando.

pnpm i @labex-hambre-ui/react@latest

🛠️ No arquivo tsconfig.json altere o moduleResolution, aplicando a seguinte configuração.

{
    "moduleResolution": "node",
}

🛠️ Para utilizar ícones no projeto, instale a lib lucide-react, executando o seguinte comando.

pnpm i lucide-react

🛠️ Para trabalhar com formulário e validação de formulário usaremos as libs react-hook-form e zod, faça a instalação com o seguinte comando.

pnpm i react-hook-form @hookform/resolvers zod

🛠️ Para trabalhar com variáveis ambientes instale a biblioteca para gerenciar variáveis ambientes

pnpm i @t3-oss/env-nextjs

🛠️ Para trabalhar com requisições para apis instale a biblioteca axios

 pnpm i axios

🛠️ Para gerenciar as variáveis ambientes, vamos utilizar a lib dotenv, para instalar utilizaremos o seguinte comando.

 pnpm i dotenv

Released in 2024 📕 License Made with love by Laciene Melo #lacymelo 🚀. This project is under the MIT license. Give a ⭐️ if this project helped you!