Skip to content

Latest commit

 

History

History

todo-app

To-Do App

To-Do

Live

Description

A simple To-Do list app that lets you manage to-dos: add/edit/remove, sort, with options to change theme, and delete without confirmation.

Tools

  • React.js
  • TypeScript
  • MUI
  • CSS Modules (Sass/SCSS)
  • ESLint
  • React Testing Library (with Jest framework)

User Stories

  • User can see an input field where he can type in a to-do item
  • By pressing enter (or a button), the User can submit the to-do item and can see that being added to a list of to-dos
  • User can mark a to-do as completed
  • User can remove a to-do item by pressing on a button (or on the to-do item itself)

Bonus features

  • User can edit a to-do
  • User can see a list with all the completed to-dos
  • User can see a list with all the active to-dos
  • User can see the date when he created the to-do
  • When closing the browser window the to-do's will be stored and when the User returns, the data will be retrieved

Extras

  • User can search the to-do list by typing part of the content
  • User can set a theme (dark mode)
  • User can sort the to-do list
  • User can set an option to delete without confirmation

Build & run instructions

This project is built with Create React App, so the scripts to build and run are provided.

Build with:

npm run build

Run with:

npm start

Test with:

npm test

Compatibility

Tested with:

  • Node.js 16.13.1
  • Mozilla Firefox 95.0.2
  • Microsoft Edge 97.0.1072.55