/To-Do-List

A simple app that lists your daily tasks with the ability to add, edit, delete and store them.

Primary LanguageJavaScriptMIT LicenseMIT

📗 Table of Contents

📖 [To-Do List]

[To-Do List] is my first Capstone project that mimics a real-world project.

🛠 Built With

  1. ✅ HTML
  2. ✅ CSS
  3. ✅ BootStrap
  4. ✅ JavaScript
  5. ✅ WebPack
  6. ✅ LightHouse
  7. ✅ WebHint
  8. ✅ Styelint
  9. ✅ ESLint
  10. ✅ Git
  11. ✅ Github

Tech Stack

Markup
  • THML
  • MD markup
Style
  • CSS
  • Bootstrap
Dynamic
  • JavaScript

Key Features

  • 🔰 [Add New Task]
  • 🔰 [See All Tasks]
  • 🔰 [Simple Design]
  • 🔰 [Responsive]
  • 🔰 [Good look and feel]

(back to top)

🚀 Live Demo

  • ✅ You can see the live demo of this webpage by clicking here;

(back to top)

💻 Getting Started

To get a local copy up and running, follow these steps.

  1. Download or clone this repostory.
  2. Provide a browser.
  3. Open the ./dist/index.html file using webpage browser.

Prerequisites

In order to run this project you need:

  • ✔ Git installed in your machine.
  • ✔ Sign in or sign up to your Github account.
  • ✔ A professional editer such as VS Code.
  • ✔ An Updated web browser such as Google Chrome, you can download it from here.
  • ✔ Node.js installed in your machine.
  • ✔ Lighthouse.
  • ✔ Webhint
  • ✔ Stylelint
  • ✔ ESLint
  • ✔ WebPack
npm init -y
npm install --save-dev hint@7.x
npx hint .
  • ✔ Stylelint
npm install --save-dev stylelint@13.x stylelint-scss@3.x stylelint-config-standard@21.x stylelint-csstree-validator@1.x
  • ✔ ESLint
npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x

Configuring WebPack

  1. Initialize package.json:
npm init y
  1. Install webpack:
npm install webpack webpack-cli --save-dev
  1. Install CSS style loader:
npm install --save-dev style-loader css-loader

Setup

  • Clone this repository to your desired folder:

  • Example commands:

  cd [YOUR FOLDER]
  git clone https://github.com/M-Anwar-Hussaini/To-Do-List.git

Install

  • Install this project by cloning or downloading the master branch of this repository and run index.html file on the root of repository.

Usage

  • To run the project, execute the following command:
 cd [YOUR FOLDER]
 git clone https://github.com/M-Anwar-Hussaini/To-Do-List.git

Run tests

  1. WebHint ☑
npx hint .
  1. Stylelint ☑
npx stylelint "**/*.{css,scss}"
  1. ESLint ☑
npx eslint .

Deployment

This project is deployed by the author, no permission for deployment by any other client.

(back to top)

👥 Authors

👤 Mohammad Anwar Hussaini (Main Author)

(back to top)

🔭 Future Features

  • [Add New Task dynamically]
  • [Local Storage Usage]
  • [Manipulate Tasks]

(back to top)

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

(back to top)

⭐️ Show your support

If you like this project, kindly drop a start for the repository;

(back to top)

🙏 Acknowledgments

I would like to thank the following individuals and organizations for their contribution to this project.

  • 🙏 Microvere for its arrangement and supports to all Micronauts and me.
  • 🙏 IonIcon for its free flexable icons.
  • 🙏 Bootstrap Bootstrap for its invaluable framework that greatly enhanced this project.
  • 🙏 Hafizullah Rasa for his instructions on cinfiguring the WebPack (@hafiz1379).

(back to top)

📝 License

This project is MIT licensed.

(back to top)