Redux Clean Code Todo and Atomic Design

This project is a small ToDo for showing some of the best pratices of Clean Code and Atomic Design in the frontend.

CLEAN CODE TODO

Clean Code todo is a very small project who's intend to create a funcional todo application. It does have some functionalities like: Add and move the todos, changing his state, as asked in the challange. Also have complete, delete and persist functionalities, added by me.

redux-clean-code-todo

This project is a small ToDo for showing some of the best pratices of Clean Code and Atomic Design in the frontend

Features used for building this APP

• TYPESCRIPT - TYPING JS
• STYLED-COMPONENTS - COMPONENT STYLE ORGANIZATION
• REDUX - STATE MANAGEMENT
• UUIDV4 - GERERATING ID'S FASTLY
• VERCEL - BEST DEPLOYMENT PLATFORM

Run Locally

Running

 git clone https://github.com/art-santos/todo.git

Running

  yarn start
||
  npm start

HOW IT WORKS

• Input the todo name and click in the + sign to create a todo

• As you can see, the red arrow is inactive and the green arrow is used to increase the position of the todo

• The check sign mark the todo as complete. Which means, independently the position of the todo, it is always going to be set to the last position.

• The trash icon deletes the todo.

• You can create how many todos as you want. If you want to check your work later on, just close the window and come back later. All the states are going to be persisted.

Demo

TODO