NLW Spacetime - Trilha Ignite: Cápsula do tempo

Software de lembranças para guardá-las e compartilhá-las com quem e onde quiser!

✔️ Linguagens e tecnologias utilizadas

Frontend

• JavaScript
• TypeScript
• ReactJS
• Next.js
• Tailwind CSS
• HTML5
• CSS3

Backend

• NodeJS
• Fastify
• Prisma
• SQLite

Bibliotecas e Frameworks

Frontend

• Axios
• Day.js
• JS-Cookie
• JWT-Decode
• Lucide React
• Tailwind CSS Forms

Backend

• Fastify CORS
• Fastify JWT
• Fastify Multipart
• Fastify Static
• Zod

Ferramentas e utilitários

• ESLint
• Next.js ESLint Config
• Rocketseat ESLint Config
• PostCSS
• Prisma
• SQLite
• MermaidJS
• Radix UI
• Dotenv
• TypeScript

Design da aplicação WEB

A seguir estão algumas capturas de tela do design da aplicação:

Etapas

🕹️ Como Utilizar

Para rodar esta aplicação, você precisará ter o Node.js e o NPM instalados em sua máquina. Certifique-se de ter o Node.js na versão v18.16.0 ou superior.

Configuração do Servidor

1. No diretório raiz do projeto, navegue até a pasta "server" usando o terminal.
2. Execute o seguinte comando para instalar as dependências e configurar o banco de dados local:

$ npm install
$ npx prisma migrate dev

3. Crie um arquivo .env na raiz do diretório "server" e configure as seguintes variáveis:

# Database
DATABASE_URL="file:./dev.db" # Insira o caminho para o arquivo dev.db do Prisma

# Github
GITHUB_CLIENT_ID="" # Insira o Client ID obtido do GitHub
GITHUB_CLIENT_SECRET="" # Insira o Client Secret obtido do GitHub

Você pode obter o Client ID e o Client Secret do GitHub seguindo as instruções em Creating an OAuth App.

4. Em seguida, execute o comando abaixo para iniciar o servidor:

$ npm run dev

Certifique-se de substituir as informações entre aspas nas variáveis do arquivo .env pelos valores corretos. Para obter mais informações sobre como obter o Client ID e o Client Secret do GitHub, siga as instruções apropriadas na documentação do GitHub ou pela documentação oficial do GitHub.

Lembrando que é necessário ter o arquivo dev.db do Prisma no local especificado no arquivo .env.

Configuração do Frontend

1. No diretório raiz do projeto, navegue até a pasta "web" usando o terminal.
2. Execute o seguinte comando para instalar as dependências:

$ npm install

3. Após a conclusão da instalação, execute o comando abaixo para iniciar a aplicação web:

$ npm run dev

Certifique-se de que o servidor esteja em execução antes de iniciar a aplicação web.

Códigos HTTP

Os códigos HTTP são códigos numéricos que indicam o tipo de resposta fornecida pelo servidor. Aqui estão alguns dos códigos mais comuns:

• Status 200 - Resposta genérica de sucesso (OK). Indica que a solicitação foi bem-sucedida e o servidor retornou os dados solicitados.
• Status 201 - Algo foi criado (CREATED). Indica que a solicitação foi bem-sucedida e um novo recurso foi criado como resultado.

Principais categorias de códigos de status:

• 2xx - Sucesso: indica que a solicitação foi bem-sucedida.
• 3xx - Redirecionamento: indica que o cliente precisa realizar alguma ação adicional para completar a solicitação.
• 4xx - Erro do cliente: indica que houve um erro na solicitação do cliente, como uma rota inválida ou falta de permissões.
• 5xx - Erro do servidor: indica que ocorreu um erro no servidor ao processar a solicitação, como uma falha interna ou tempo limite.

Certifique-se de ter o Node.js instalado e o NPM configurado corretamente antes de executar os comandos acima. Além disso, siga a sequência correta de configuração e execução do servidor e da aplicação web conforme mencionado anteriormente.

Para obter mais informações detalhadas sobre a instalação e configuração do Node.js e do NPM, consulte a documentação oficial em nodejs.org.