Esse projeto foi desenvolvido originalmente em javascript puro, e então, a fim de estudar melhor a biblioteca ReactJS no front-end e Node.js no back-end (neste caso, usando o MongoDB como banco de dados), decidi replicar a maior parte do projeto original, mas com tais tecnologias.
📓 O Projeto | ✨ Novidades | 🔧 Tecnologias | 💡 Funcionalidades | 🧪 Como testar
O To-Do List foi criado no intuito de facilitar a organização no dia-a-dia com anotações rápidas em pequenos cartões coloridos :D
Para explorar alguns conceitos do back-end, o armazenamento de tarefas no localStorage deu lugar ao uso do MongoDB. Além disso, foi implementado um sistema de autenticação de usuário (utilizando jwt). Sendo assim, as tarefas são relacionadas aos usuários no banco de dados.
- Página de Login
- Página de Cadastro
As principais tecnologias utilizadas nesse projeto:
- Adição de tarefas em formatos de cartões;
- Alterar os cartões em até 8 cores diferentes (cinza, azul, laranja, verde, vermelho, rosa, roxo ou amarelo);
- Colocar as tarefas como finalizadas, e depois, se necessário, excluí-las.
Você deve possuir o Node instalado, bem como o MongoDB. Feito isso, basta seguir os comandos:
- Para instalar:
$ git clone https://github.com/lucasalme1da/to-do-list-react
$ cd to-do-list-react
Também é necessário gerar um hash code para incluir no arquivo server/src/config/auth.json
para encriptar as senhas que irão para o banco de dados no cadastro. Após isso:
- Inicializando back-end:
$ cd server
$ npm install && npm start
- Inicializando front-end:
$ cd web
$ npm install && npm start
# Caso haja conflito de portas, basta aceitar inicializar a aplicação em outra quando for pedido.
Feito com ❤ por Lucas Almeida :D