Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/nyctibiusvii/moveit
Projeto web construído durante o NLW#04 com a Rocketseat/Diego Fernandes. MOVEIT: "Gerenciando o seu tempo para uma melhor produtividade". ⏳⏰🏃🏻♂️🤸🏻♀️
https://github.com/nyctibiusvii/moveit
contexts cookies css diegofernandes discovery gerenciamento-do-seu-tempo html moveit nextjs nextlevelweek nlw4 nodejs pomodoro projeto reactjs rocketseat tecnicapomodoro trilha-react typescript vercel
Last synced: about 1 month ago
JSON representation
Projeto web construído durante o NLW#04 com a Rocketseat/Diego Fernandes. MOVEIT: "Gerenciando o seu tempo para uma melhor produtividade". ⏳⏰🏃🏻♂️🤸🏻♀️
- Host: GitHub
- URL: https://github.com/nyctibiusvii/moveit
- Owner: NyctibiusVII
- License: mit
- Created: 2021-02-21T20:38:06.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2021-10-29T17:57:37.000Z (about 3 years ago)
- Last Synced: 2023-03-10T06:02:43.886Z (over 1 year ago)
- Topics: contexts, cookies, css, diegofernandes, discovery, gerenciamento-do-seu-tempo, html, moveit, nextjs, nextlevelweek, nlw4, nodejs, pomodoro, projeto, reactjs, rocketseat, tecnicapomodoro, trilha-react, typescript, vercel
- Language: TypeScript
- Homepage: https://moveit-nyctibiusvii.vercel.app
- Size: 5.64 MB
- Stars: 9
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Trilha ReactJS 
Projeto |
Tecnologias |
Layout |
Licença
# MoveIt 
Projeto desenvolvido para gerenciar melhor o seu tempo, saúde mental e física usando a técnica de pomodoro. Projeto realizado na Next Level Week #4 @Rocketseat.
Como é a técnica Pomodoro
```
Pomodoro significa tomate em italiano. A fruta faz alusão ao tempo durante o qual você pode fazer determinada tarefa.
Cada pomodoro é dividido em quatro pomodoris, e cada um destes equivale a 30 minutos.
O método Pomodoro é simples e dura (n) horas. Primeiro, você realiza uma atividade durante 25 minutos.
Quando acabar o tempo, descansa 5 minutos. Assim sucessivamente até que complete as (n) horas.
O conceito do Pomodoro é que a pessoa que vai estudar ou executar uma tarefa demore, exatamente, 25 minutos.
Concluindo-a ou não, ele deve parar e descansar 5 minutos.
```
Vantagens de usar a técnica Pomodoro
```
- Alivia a ansiedade;
- Aumenta o foco e a concentração por meio da redução das interrupções.
- Aumenta a conscientização das decisões.
- Aumenta a motivação e mantém-na constante.
- Reforça a determinação para atingir os objetivos.
- Melhora o processo de trabalho ou estudo.
- Reforça sua determinação de continuar a aplicar-se em face de complexas situações.
```
###### Por Silvia Tancredi - Jornalista
#### Funcionalidades
* Gerenciar seu tempo.
* Níveis de xp aumentados conforme sua evolução na técnica pomodoro.
* Compartilhamento de seu progresso (Twitter) com imagem dinâmica via URL de (1200 x 630).
* Notificação auditiva e visual.
* Modal Cookies consent
* MongoDB
* Site responsivo.
Desafios
```
✔ - Documentar bem o projeto
✔ - Melhorar o estilo: Responsividade e Design
✔ - Confetes atras do modal quando passar de level
✔ - Barra de progresso (tempo restante) em baixo do botão (Abandonar ciclo e Ciclo encerrado)
✔ - Bloquear funcionalidades se não estiver logado
✔ - Banco de dados
✔ - API-REST
✖ - Next PWA
Funcionalidades:
- Mensagem de aviso ao sair da pagina ("O timer esta ativo!")
✔ - Trocar o tema da aplicação: Light e Dark
✔ - Consumo de api-rest
✔ - Banco de dados externo (MongoDB)
✔ - oAuth github (Pagina de login)
✔ - COOKIES:
✔ - Cookies consent
✔ - Guardar dados
✔ - Alterar dados
✔ - Deletar dados
✔ - MongoDB:
✔ - Guardar dados
✔ - Alterar dados
✔ - Deletar dados
✔ - Sidebar lateral #Desktop:
✔ - Logo (img)
✔ - Home
✔ - Leaderbord
✔ - Settings
✔ - Float action button #Mobile:
✔ - Home
✔ - Leaderbord
✔ - Settings
✔ - Toast:
✔ - Cor dinâmica
✔ - Icon dinâmico
✔ - Texto dinâmico
✔ - ToastBar countdown
✔ - Animação de entrada e saida
- Telas:
✔ - Home
✔ - Leaderbord
- Settings
✔ - Login
✔ - 404
✔ - Compartilhar com o Twitter:
✔ - Botão em baixo do modal (Compartilhar no Twitter (img))
✔ - Texto com:
✔ - qts Desafios
✔ - qts xp
✔ - qts Level
✔ - Link para a img dinâmica
✔ - Hashtags
✔ - Autor
✔ - Criar img dinâmica para compartilhar:
✔ - (API) image-generator:
✔ - qts Desafios
✔ - qts xp
✔ - qts Level
```
## Tecnologias 🚀
Esse projeto foi desenvolvido com as seguintes tecnologias:
- [Html | 5](https://pt.wikipedia.org/wiki/HTML)
- [Css | 3](https://pt.wikipedia.org/wiki/Cascading_Style_Sheets)
- [Typescript | ^4.1.5](https://www.typescriptlang.org/)
- [ReactJS | ^17.0.1](https://pt-br.reactjs.org/)
- [NextJS | ^10.0.7](https://nextjs.org/)
- [NodeJS | ^15.9.0](https://nodejs.org/en/)
## Layout 🚧
## Desktop Screenshot
Ver mais
## Mobile Screenshot
Ver mais
## Rodando o projeto 🚴🏻♂️
#### "Só vou dar uma olhadinha...":
⏰ Site hospedado na Vercel 🏆
#### Na sua maquina:
Dependências
```json
"dependencies": {
"axios": "^0.21.4",
"chrome-aws-lambda": "^10.1.0",
"js-cookie": "^3.0.0",
"next": "^11.1.2",
"next-themes": "0.0.15",
"puppeteer-core": "^10.2.0",
"react": "^17.0.2",
"react-confetti": "^6.0.1",
"react-copy-to-clipboard": "^5.0.4",
"react-dom": "^17.0.2",
"sass": "^1.42.1"
},
"devDependencies": {
"@types/js-cookie": "^2.2.7",
"@types/node": "^16.11.6",
"@types/react": "^17.0.19",
"@types/react-copy-to-clipboard": "^5.0.1",
"@types/react-dom": "^17.0.9",
"eslint": "^7.32.0",
"eslint-config-next": "^11.1.2",
"typescript": "^4.4.2"
}
```
> Ex: `$ npm install _____` para instalar as dependências
> Utilize a tag `-D` para instalar as dependências de desenvolvimento.
> Utilize a tag `@types` para instalar o suporte a Typescript.
> Utilize a tag `@latest` para instalar a versão mais recente.
```bash
# Clone o repositório
$ git clone https://github.com/NyctibiusVII/MoveIt.git
# Acesse a pasta do projeto no prompt de comando
$ cd moveit
# Instale as dependências
$ npm install
# Execute o script "dev"
$ npm run dev
# O projeto inciará na porta: 3000 - acesse http://localhost:3000
```
## Contribuição 💭
Para construir essa aplicação tive a ajuda do professor **Diego Fernandes** da Rocketseat que disponibilizou video aulas do projeto **MoveIt** e tive uma ajuda desta grande comunidade que a Rocketseat construiu no *Discord*.
Feito com ♥ by Rocketseat :wave: [Participe da nossa comunidade!](https://discord.gg/YxU7fJT)
### Hashtags \#
| Dias | Hashtags |
|-------|---------------------|
| Dia 1 | #RumoAoProxímoNivel |
| Dia 2 | #JornadaInfinita |
| Dia 3 | #FocoPraticaGrupo |
| Dia 4 | #NeverStopLearning |
| Dia 5 | #MissionComplete |
## Licença ⚖️
Este projeto está sob a licença do MIT. Veja o arquivo [LICENSE](https://github.com/NyctibiusVII/MoveIt/blob/master/LICENSE) para mais detalhes.
## Contato ✉️
| 
@MatheusVidigal🦊 |
| :---: |
