Projeto | Tecnologias | Layout | Licença
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.
- 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
Esse projeto foi desenvolvido com as seguintes tecnologias:
Ver mais Ver maisDependências
"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.
# 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
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 👋 Participe da nossa comunidade!
Dias | Hashtags |
---|---|
Dia 1 | #RumoAoProxímoNivel |
Dia 2 | #JornadaInfinita |
Dia 3 | #FocoPraticaGrupo |
Dia 4 | #NeverStopLearning |
Dia 5 | #MissionComplete |
Este projeto está sob a licença do MIT. Veja o arquivo LICENSE para mais detalhes.
@MatheusVidigal🦊 |
---|