Full stack application development for desktop and mobile, using the latest technologies, libraries and tools of 2021.
Next Level Week Heat - Trilha Impulse | 
Next Level Week | Projeto | Layout | Como rodar o projeto | Tecnologias | Contato
🆙 Next Level Week
Criado pela Rocketseat, Next Level Week é um evento com muito código, desafios, networking e um único objetivo: levar o aluno para o próximo nível, independente do nível atual.
Programação é uma disciplina prática. Ou seja, para dominar uma tecnologia não basta apenas conhecer a teoria ou ler a documentação: é preciso colocar a mão no código.
Através do método da Rocketseat, aprendemos novas ferramentas, conhecemos novas tecnologias e descobrimos hacks que vão impulsionar a nossa carreira.
Um experiência online e totalmente gratuita para evoluir as habilidades em programação e colocar mais um trabalho completo no portfolio.
Nessa edição, feita entre os dias 18 e 24 de outubro de 2021, desenvolvemos uma aplicação (desktop e mobile) para o evento Do While 2021, abrangendo as etapas de Front-End, Back-End e Banco de Dados.
📚 Grade do curso & Anotações
Stage 1 - Backend
Nessa aula criamos o backend da aplicação utlizando NodeJS. Nesse projeto utilizamos Typescript, que auxilia no aumento da produtividade em desenvolvimento; utilizamos também Prisma ORM, para trabalhar com banco de dados e Socket.IO para trabalhar comunicação em tempo real.
- Conteúdo técnico - construção do projeto:
- Criar projeto
- Instalar Express, Prisma, Typescript
- Configurar Github OAuth
- Criar rota login Github
- Autenticação usuario recebendo o código
- Cadastro de mensagem
- Configuração websocket
- Retornar 3 últimas mensagens
- Criar profile do usuário
O foco foi a criação do backend usando o NodeJS. As anotações de aula detalhadas estão disponíveis aqui.
Stage 2 - Frontend
Nessa aula criamos o front-end web da nossa aplicação utilizando ReactJS. Além disso, criamos nosso projeto utilizando o Vite, uma ferramenta extremamente performática, TypeScript e CSS modules. Construímos toda interface da aplicação do zero com Flexbox e Grid System, além de termos criado animações utilizando Framer Motion.
Stage 3 - Mobile
Nessa aula criamos o front-end mobile da nossa aplicação utilizando React Native. Além disso, criamos nosso projeto utilizando TypeScript e Expo, que proporciona muita produtividade no desenvolvimento. Construímos toda interface da aplicação do zero, além de termos criado animações utilizando o Moti, AsyncStorage e integração em tempo real com socket.io.
💻 Projeto
Como forma de aquecimento para o evento Do While 2021, produzido pela própria Rocketseat para oferecer palestras, painéis, talks, keynotes e workshops para a comunidade de tecnologia, este projeto é um mural de depoimentos/expectativas sobre o evento e utilizado, de fato, no mesmo.
Consiste-se em uma aplicação utilizando várias tecnologias, onde o login é feito com Github para que o usuário consiga deixar suas mensagens. Conforme as mensagens são adicionadas, em tempo real elas aparecem no mural.
Este projeto foi desenvolvido durante a Trilha Impulse, desenhada para quem já desenvolveu aplicações para web.
Web
Aplicação realtime, com socketIO:
Mobile
🔖 Layout
Você pode visualizar o layout do projetoatravés deste link, no Figma.
🧭 Como rodar o projeto
O arquivo oficial, com o guia de configuração de ambiente para cada tecnologia, está aqui.
Backend
# Clone este repositório
$ git clone https://github.com/angelicaalbuquerque/do-while_nlw-rocketseat
# Acesse o repositório
$ cd nlw-heat-do-while-2021/backend
# Instale as dependências
$ yarn
# Execute as migrations do Prisma para criação das tabelas no banco
$ yarn prisma migrate dev
# Execute a aplicação em modo de desenvolvimento
$ yarn dev
# rodando na porta 4000
Front-end
# Clone este repositório
$ git clone https://github.com/angelicaalbuquerque/do-while_nlw-rocketseat
# Acesse este repositório
$ cd nlw-heat-do-while-2021/web
# Instale as dependências
$ yarn
# Execute a aplicação
$ yarn dev
# rodando na porta 3000
Mobile
# Clone este repositório
$ git clone https://github.com/angelicaalbuquerque/do-while_nlw-rocketseat
# Acesse este repositório
$ cd nlw-heat-do-while-2021/mobile
# Instale as dependências
$ yarn install
# Execute a aplicação
$ expo start
# O Expo abrirá uma nova janela no navegador; escaneie o qrcode no terminal ou na página aberta pelo Expo
# Caso tenha problema com as fontes, execute:
# $ expo install expo-font @expo-google-fonts/roboto
🚀 Tecnologias
O projeto foi desenvolvido com as seguintes tecnologias:
Backend
Frontend
Mobile
📬 Entre em contato!
Feito com ☕ e 🖤 por Angélica Albuquerque
]
