to-do-list

A "To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to mark them as complete. I built a simple website that allows for doing that, using ES6 and Webpack!

MIT License

Stars
12

To Do list

The project's goal is to learn how to use webpack. "To-do list" is a tool that helps to organize your day. It simply lists the things that you need to do and allows you to mark them as complete. You will build a simple website that allows for doing that, and you will do it using ES6 and Webpack!

the to-do list we're going to create has a beautiful UI, the user can add a to-do by filling the input and hit ENTER, after that he can rather check the to-do when it's done, or remove it using the delete button.

The user's to-do list is stored in the local storage, so when he refreshes the page, he can always find the list there.

To-DO-List Live Demo

Live demo

Built with

  • HTML, CSS,
  • JavaScript-ES6
  • Git & Github
  • github pages
  • Store data with LocalStorage
  • fix errors with Linters
  • Features of webpack and plugins already included
    • style-loader
    • css loader
    • HtmlWebpackPlugin
    • WebPack Dev Server

Usage

  • Navigate to your desired directory in your local machine using the terminal.

  • Clone repository by running git clone [email protected]:Hamzaoutdoors/to-do-list.git in your local terminal

  • Run the following command to install the needed dependencies npm install

  • Use the following commands to npm run start to start the Webpack Dev server and serve the files from the dist directory npm run build to complile build all source files into the dist directory npm run watch to set webpack into watch mode so that the build is automatically run whenever changes are made to any of the source files.

Authors

EllaouziHamza

Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a if you like this project!

Related Projects