Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up

Projeto web construído durante o NLW#04 com a Rocketseat/Diego Fernandes. MOVEIT: "Gerenciando o seu tempo para uma melhor produtividade". ⏳⏰🏃🏻‍♂️🤸🏻‍♀️

License

NotificationsYou must be signed in to change notification settings

NyctibiusVII/MoveIt

Repository files navigation


logo move.it

Trilha ReactJSlogo icon react

PlataformaMoveitTamanho do repositórioLicençaDonate

Projeto   |   Tecnologias   |   Layout   |   Licença

MoveItlogo icon

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 PWAFuncionalidades:    - 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:

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
"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

Contribuição 💭

Para construir essa aplicação tive a ajuda do professorDiego Fernandes da Rocketseat que disponibilizou video aulas do projetoMoveIt e tive uma ajuda desta grande comunidade que a Rocketseat construiu noDiscord.Feito com ♥ by Rocketseat 👋Participe da nossa comunidade!

Hashtags #

DiasHashtags
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 arquivoLICENSE para mais detalhes.

Contato ✉️


@MatheusVidigal🦊

Matheus Vidigal / LinkedinMatheus Vidigal / Linkedin

About

Projeto web construído durante o NLW#04 com a Rocketseat/Diego Fernandes. MOVEIT: "Gerenciando o seu tempo para uma melhor produtividade". ⏳⏰🏃🏻‍♂️🤸🏻‍♀️

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

[8]ページ先頭

©2009-2025 Movatter.jp