Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/parlandin/orange-notes
https://github.com/parlandin/orange-notes
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/parlandin/orange-notes
- Owner: parlandin
- Created: 2022-08-19T22:05:44.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-02-04T22:41:20.000Z (almost 2 years ago)
- Last Synced: 2024-10-17T16:19:44.178Z (3 months ago)
- Language: JavaScript
- Homepage:
- Size: 2.4 MB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.MD
Awesome Lists containing this project
README
# Orange notes
### O orange notes chegou para centalizar todas as suas ferramentas de estudos em um único lugar, faça anotações, salve links de cursos, use pomodoro time para se concentra em suas tarefas e mais...
# Visão geral
- [Funcionalidades](#link1)
- [Demostração](#link2)
- [Instalação](#link3)
- [Tecnologias utilizadaas](#link4)
- [Links](#link5)
## Funcionalidades
### Rotas publicas
- Crianção de conta
- Login
### Rotas Privadas
- Página home com menu e suas ultimas anotações
- Página de listagem de anotações
- Página de detalhes de anotação
- Página para atualizar anotações
- Modal para excluir anotação
- Página para Guarda link de seus cursos
- modal para criar, editar e excluir link
- Card clicável para ir direto para o curso
- Página com pomodoro time com ajuste de tempo
- Modal para configurar
- Página de detalhes da conta e botão para deletar conta
- Contador de dias consecutivos que volta a 1 se ficar 24 Offline
### Observações
- O mapa mental era o diferencial do meu site dos outros, mas devido o curto tempo não foi possivel desenvolver
- O carousel funciona com touch no mobile, assim não precisando das setas, porém no desktop o touch não está disponivel
- para testa o carousel no desktop abra o devtools (F12) e clique em "ativar emulação de dispositivo ou mobile"
- Ao olhar o codigo irá perceber que alguns components usam as cores do thema e outros tem a propria cor, devido ao curto tempo os themas foi deixado de lado
- Clicando fora do modal de criação ou edição de curso, o modal ira resertar
## Demostrações
### Login e registro
### Anotações
### Link de Cursos
### Pomodoro
## Pré-requisitos
Antes de começar, verifique se você atendeu aos seguintes requisitos:
- Você instalou a versão mais recente do `Nodejs`
- Além de ter o `PostgreSQL` instalado na sua márquina
## Instalando
Para instalar, siga estas etapas:
```
npm install
```
ou
```
yarn add
```
## Usando
Para usar, siga estas etapas:
```
npm run dev
```
Cientifique-se de verificar as variaveis de ambiente
```
USER = postgres user
HOST = postgres host
DATABASE = postgres host
PASSWORD = "postgres pass"
DBPORT = postgres port (padrão: 5432)
SECRET_JWT = "hash para geranção do seu token"
```
## Tecnologias
As seguintes ferramentas foram usadas na construção do projeto:
### Front-end
- [Vitejs](https://vitejs.dev/)
- [React](https://pt-br.reactjs.org/)
- [React Query](https://tanstack.com/query/v4/?from=reactQueryV3&original=https://react-query-v3.tanstack.com/)
- [React Icons](https://react-icons.github.io/react-icons/)
- [Axios](https://axios-http.com/ptbr/)
- [styled-components](https://styled-components.com/)
- [yup](https://www.npmjs.com/package/yup)
### Backend
- [bcrypt](https://www.npmjs.com/package/bcrypt)
- [yup](https://www.npmjs.com/package/yup)
- [cors](https://www.npmjs.com/package/bcrypt)
- [dotenv](https://www.npmjs.com/package/dotenv)
- [express](https://expressjs.com/pt-br/)
- [jsonwebtoken](https://jwt.io/)
- [pg](https://node-postgres.com/)
- [Node.js](https://nodejs.org/en/)
- [TypeScript](https://www.typescriptlang.org/)
[Frontend deploy](https://orangemynotes.netlify.app/)
[Backend deploy](https://orangemynotes.herokuapp.com/)
