An app to keep a to-do list; a list of tasks one needs to complete. It is built with React Boilerplate and leverages React, React Router, Redux, Redux Saga, Reselect, Styled Components, Node, Express.
On the client side:
- To-do list page (homepage): displays a list of all to-do items and checkboxes to indicate whether or not a todo item has been completed;
- Add to-do page: displays the form to create new to-do items;
- Navigation bar:
- allows user to switch between pages,
- displays the count of incomplete to-do list items.
On the server side:
- Node/Express server: 'faking a database' by keeping an array in memory;
- API endpoints:
- to fetch all to-do items from the array,
- to prepend a new to-do item to the array,
- to toggle a to-do item's completed status in the array.
Please note: Even though this app meets the requirements of the take-home assignment it was created for, it is not a full-featured to-do app (yet).
- Clone the repository
git clone git@github.com:vanvemden/todos.git cd todosnpm run setupnpm start- Visit http://localhost:3000
Unit tests have been written for the TodosListContainer component. To run these tests:
jest app/containers/TodosListContainer/tests/
The following could be added to the app in future:
- Display Add to-do page as an overlay on To-do list page.
- Allow user to edit to-do text, and delete to-do items.
- Add selector to switch between site languages.
- Setup database to store to-do items in.
- Remove completed items from To-do page, and display on Done page.
- Add drag and drop functionality to list items in custom order.
- Add server side validation to prevent bad submissions.
- Add user authentication and email verification.