/todo-list

Primary LanguageJavaScript

Hireable

Microsoft todo web app clone built with webpack, HTML and CSS in 2 days

The guests can create lists of todos, add/delete todos based on their priority, due date and title. The app never does a full refresh of the page and it automatically updates the DOM with every change. It is using localStorage for the database.
In this project, we were required to build a todo web app using Javascript`s Objects, Factory Functions, and The Module Patterns applying the concepts of Single Responsibility and Tightly Coupled Objects.

App functionality

  • Guests can create lists of todos, add/delete todos based on their priority, due date and title.
  • The app is currently not mobile responsive.
  • Todos with important priorities are colored dark red.
  • Todos with high priorities are colored light red.
  • Todos with normal priorities are colored green.
  • Done todos are colored grey.

Built With

  • HTML/SCSS
  • Webpack/ES6/Javascript
  • Bootstrap
  • FontAwesome
  • Local storage

Prerequisities

live link

To-Do List live link

To get this project up and running locally, you must have node installed locally. Node will automatically install npm.

Getting Started

To get this project set up on your local machine, follow these simple steps:

Step 1
Navigate through the local folder where you want to clone the repository and run
git@github.com:mahmoud717/todo-list.git. It will clone the repo to your local folder.
or with https
https://github.com/mahmoud717/todo-list.git.
Step 2
Run cd todo-list
Step 3
Run npm install to install the npm packages from the package.json file.
Step 4
Run npm run start to start the webpack server, you can now navigate to http://localhost:3000 to view the app. The server refreshes the app every time you make a change to a file used by it.
Step 5
Most important, enjoy the app!

Test

  • Run npm run test command:

$ npm run test

Authors

👤 Mahmoud Mohammad

👤 Luciano Ilha Carbonel

🤝 Contributing

Our favourite contributions are those that help us improve the project, whether with a contribution, an issue, or a feature request!

Show your support

If you've read this far....give us a ⭐️!

📝 License

This project is licensed by Microverse and the Odin Project