Projeto | Tecnologias | Layout | Licença
Projeto desenvolvido para coletar feedbacks de suas aplicações. O projeto coleta feedback do usuário sobre problemas, dão sugestões de ideias e outros. Projeto realizado na Next Level Week #8 @Rocketseat.
- Coleta de feedbacks
- Captura de tela automático
- Tipos de feedback (Problema, Ideia, Outro)
- App responsivo com acessibilidade
Desafios
GERAL:
✔ - Documentar bem o projeto
✖ - Completar os desafios
DESKTOP:
✔ - NO AR (Online / Vercel)
✖ - SEO:
✖ - Texto para <noscript />
✖ - Shortcut icon
✖ - Meta tags:
✖ - Facebook (og:~)
✖ - Twitter (twitter:~)
✖ - Melhorar o estilo:
✔ - Mobile First
✔ - Responsividade
✔ - Design
✖ - Trocar o tema da aplicação:
✖ - Light
✔ - Dark
✖ - Imagens adaptadas para o 'light e dark'
✖ - Animações (framer-motion)
✖ - Cores:
✖ - Seleção do mouse (:selection)
✖ - Adaptadas para daltônicos
✔ - Acessibilidade:
✔ - Navegação por TAB / SHIFT+TAB
✔ - Texto alternativo em imagens
✔ - Texto descritivo em title e area-label
✔ - Componentes:
✔ - Widget
✔ - WidgetForm
✔ - FeedbackTypeStep
✔ - FeedbackContentStep
✔ - ScreenshotButton
✔ - FeedbackSuccessStep
MOBILE:
✖ - NO AR (Online / Apple Store && Google Play)
✖ - Melhorar o estilo:
✖ - Design
✖ - Trocar o tema da aplicação:
✔ - Light
✖ - Dark
✖ - Imagens adaptadas para o 'light e dark'
✖ - Animações (framer-motion)
✖ - Cores:
✖ - Adaptadas para daltônicos
✔ - Componentes:
✔ - Widget
✔ - Options
✔ - Form
✔ - ScreenshotButton
✔ - Success
NODE:
✖ - NO AR (Online / Heroku)
✔ - ORM (Prisma)
✔ - Testes (Jest)
✖ - Banco de dados:
✔ - SQLite *Banco atual*
✖ - Migrar banco de dados de 'SQLite' para 'PostgreSQL ou MongoDB'
Esse projeto foi desenvolvido com as seguintes tecnologias:
Dependências
------- WEB -------
"dependencies": {
"@headlessui/react": "^1.6.0",
"html2canvas": "^1.4.1",
"phosphor-react": "^1.4.1",
"react": "^18.0.0",
"react-dom": "^18.0.0"
},
"devDependencies": {
"@tailwindcss/forms": "^0.5.0",
"@types/react": "^18.0.0",
"@types/react-dom": "^18.0.0",
"@vitejs/plugin-react": "^1.3.0",
"autoprefixer": "10.4.5",
"postcss": "^8.4.13",
"tailwind-scrollbar": "^1.3.1",
"tailwindcss": "^3.0.24",
"typescript": "^4.6.3",
"vite": "^2.9.5"
}
------- NODE -------
"dependencies": {
"@prisma/client": "^3.13.0",
"cors": "^2.8.5",
"dotenv": "^16.0.0",
"express": "^4.18.1",
"nodemailer": "^6.7.5",
"yarn-run-all": "^3.1.1"
},
"devDependencies": {
"@swc/core": "^1.2.177",
"@swc/jest": "^0.2.20",
"@types/cors": "^2.8.12",
"@types/express": "^4.17.13",
"@types/jest": "^27.5.0",
"@types/node": "^17.0.31",
"@types/nodemailer": "^6.4.4",
"jest": "^28.0.3",
"prisma": "^3.13.0",
"ts-node": "^10.7.0",
"ts-node-dev": "^1.1.8",
"typescript": "^4.6.4"
}
------- MOBILE -------
"dependencies": {
"@expo-google-fonts/inter": "^0.2.2",
"@gorhom/bottom-sheet": "^4",
"axios": "^0.27.2",
"expo": "~44.0.0",
"expo-app-loading": "~1.3.0",
"expo-file-system": "~13.1.4",
"expo-font": "~10.0.4",
"expo-status-bar": "~1.2.0",
"phosphor-react-native": "1.1.1",
"react": "17.0.1",
"react-dom": "17.0.1",
"react-native": "0.64.3",
"react-native-dotenv": "^3.3.1",
"react-native-gesture-handler": "~2.1.0",
"react-native-iphone-x-helper": "^1.3.1",
"react-native-reanimated": "~2.3.1",
"react-native-svg": "12.1.1",
"react-native-view-shot": "3.1.2",
"react-native-web": "0.17.1"
},
"devDependencies": {
"@babel/core": "^7.12.9",
"@types/react": "~17.0.21",
"@types/react-native": "~0.64.12",
"typescript": "~4.3.5"
}Ex:
$ npm install _____ou$ yarn add _____para instalar as dependências
Utilize a tag
-Dpara instalar as dependências de desenvolvimento.
Utilize a tag@typespara instalar o suporte a Typescript.
Utilize a tag@latestpara instalar a versão mais recente.
# Clone o repositório
$ git clone https://github.com/NyctibiusVII/FeedGet.git
# Acesse a pasta do projeto no terminal
$ cd FeedGet
# Acesse a pasta do sub-projeto no terminal:
$ cd web # Projeto ReactJS
$ cd node # Projeto NodeJS
$ cd mobile # Projeto React Native
# Instale as dependências com o gerenciador de pacotes de sua preferência
$ npm install / yarn add # Serve para ReactJS, NodeJS e React Native
# Execute o sub-projeto:
# ---------- PARA WEB ---------- #
$ npm run dev / yarn dev # Para rodar o projeto Web (Frontend)
# --------- PARA NODE ---------- #
$ npm run dev / yarn dev # Para rodar o projeto Node (Backend)
# -------- PARA MOBILE --------- #
$ npm run start / yarn start # Para o projeto Mobile (Frontend Mobile)
# O ReactJS roda na porta: 3000
# O NodeJS roda na porta: 3333
# O React Native roda na porta: 19000
# Acesse http://localhost:$PORT *Ex: Cuidado para não ligar dois ou mais projetos na mesma porta, pois o servidor pode não iniciar.Para construir essa aplicação tive a ajuda dos professores Diego Fernandes e Rodrigo Gonçalves da Rocketseat que disponibilizaram video aulas do projeto FeedGet e ajudaram no ensino das
- linguagens {
ReactJS,
NodeJS,
React Native
}
além também de ter a ajuda desta grande comunidade que a Rocketseat construiu no Discord.
Para ajudar no projeto confira a página de contribuição para ver como começar uma discussão e começar a contribuir.
| Dias | Hashtags |
|---|---|
| Dia 1 | #NextLevel |
| Dia 2 | #NeverStopLearning |
| Dia 3 | #NewSkills |
| Dia 4 | #StepByStep |
| Dia 5 | #~ |
Este projeto está sob a licença do MIT. Veja o arquivo LICENSE para mais detalhes.
 |
|---|
| Matheus Vidigal |
