An open API service indexing awesome lists of open source software.

https://github.com/emanuellacerda/povi

Aplicação pomodoro com desafios físicos e oculares ao fim de cada ciclo.
https://github.com/emanuellacerda/povi

contextapi nextjs react typescript

Last synced: 28 days ago
JSON representation

Aplicação pomodoro com desafios físicos e oculares ao fim de cada ciclo.

Awesome Lists containing this project

README

          


Logo do povi


Tecnologias
   |   
Funcionalidades    |   
Deploy e demonstração    |   
Executando a aplicação    |   
Licença

Povi é um projeto desenvolvido a partir do move.it, que por sua vez é o projeto que foi desenvolvido durante a Next Level Week 4. As incrementações realizadas no povi foram:

- Adicionar botão que desativa/ativa o som das notificações.
- Converter estilos para Mobile First.
- Adicionar responsividade.
- Pequena mudança nas cores do layout.
- Mudança do favicon.

O povi/move.it é uma aplicação de produtividade que une a técnica de Pomodoro com exercícios para o corpo e para os olhos.

A técnica de Pomodoro consiste em ciclos com foco total na atividade que está sendo executada intercalados com período de descanso.

Ao fim de cada ciclo são realizados os exercícios citados acima. O objetivo desses exercícios é garantir que no período que o usuário estiver sentado em frente ao computador ele realize alguma movimentação. Isso é importante para evitar que o usuário tenha problemas de saúde por estar longos períodos de tempo sem realizar nenhuma movimentação.

Com o objetivo de motivar o usuário a realizar os exercícios, foi incorporado gamificação na aplicação por meio de uma barra de experiência e level que evoluem conforme o usuário completa os desafios e de um histórico de desafios completados.

**Povi no desktop:**


Screenshot da tela inicial na versão Desktop

**Povi no mobile:**


Screenshot da tela inicial na versão Mobile

# ![mortar_board](https://github.githubassets.com/images/icons/emoji/unicode/2699.png)Tecnologias

- [React.js](https://reactjs.org) e hooks [useState](https://reactjs.org/docs/hooks-state.html#gatsby-focus-wrapper), [useEffect](https://reactjs.org/docs/hooks-effect.html) e useContext.
- [Typescript](https://www.typescriptlang.org/).
- [Next.js](https://nextjs.org/).
- [js-cookie](https://github.com/js-cookie/js-cookie).

# ![computer](https://github.githubassets.com/images/icons/emoji/unicode/1f680.png)Funcionalidades

- Iniciar um ciclo de 25 minutos.
- Abandonar um ciclo.
- Propostas de desafios para exercitar o corpo e os olhos ao fim de cada ciclo.
- Ganhar experiência e subir de nível completando os desafios.
- Controlar se o som das notificações estará ativo ou mutado.
- Notificação informando que faltam 10 minutos para o fim do ciclo.
- Notificação informando que faltam 5 minutos para o fim do ciclo.

# Deploy e demonstração

Para realizar o deploy da aplicação [clique aqui](https://povi.vercel.app/).

## ![computer](https://github.githubassets.com/images/icons/emoji/unicode/1f4bb.png)Desktop

### Iniciando um ciclo


Demonstração de como iniciar um ciclo - versão Desktop

### Abandonando um ciclo


Demonstração de como abandonar um ciclo - versão Desktop

### Completando um desafio


Demonstração de como completar um desafio - versão Desktop

### Falhando em um desafio


Demonstração de como falhar em um desafio - versão Desktop

### Subindo de level


Demonstração do evento de subir de level - versão Desktop

### Controlando o som das notificações


Demonstração de controlar o som das notificações - versão Desktop

## ![smartphone](https://github.githubassets.com/images/icons/emoji/unicode/1f4f1.png)Mobile

### Iniciando um ciclo


Demonstração de como iniciar um ciclo - versão Mobile

### Abandonando um ciclo


Demonstração de como abandonar um ciclo - versão Mobile

### Completando um desafio


Demonstração de como completar um desafio - versão Mobile

### Falhando em um desafio


Demonstração de como falhar em um desafio - versão Mobile

### Subindo de level


Demonstração do evento de subir de level - versão Mobile

### Controlando o som das notificações


Demonstração de controlar o som das notificações - versão Mobile

# ![arrow_forward](https://github.githubassets.com/images/icons/emoji/unicode/25b6.png)Executando a aplicação

```bash
# Clone esse repositório
$ git clone https://github.com/EmanuelLacerda/povi.git

# Acesse a pasta no projeto
$ cd povi

# Instale as dependências
$ npm install
# or
$ npm install -g yarn

# Execute a aplicação em modo desenvolvedor
$ npm run dev
# or
$ yarn dev

# A porta do servidor irá abrir no console: https://localhost:3000
```

# ![memo](https://github.githubassets.com/images/icons/emoji/unicode/1f4dd.png)Licença

Esse projeto está sob a licença MIT. Veja o arquivo [LICENSE](https://github.com/EmanuelLacerda/nome-do-repositorio/blob/main/LICENSE) para mais detalhes.

------

Projeto desenvolvido por **[Emanuel de Souza Lacerda](https://github.com/EmanuelLacerda/)**