Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/m-anwar-hussaini/to-do-list
A simple app that lists your daily tasks with the ability to add, edit, delete and store them.
https://github.com/m-anwar-hussaini/to-do-list
bootstrap css html javascript linters webpack
Last synced: 12 days ago
JSON representation
A simple app that lists your daily tasks with the ability to add, edit, delete and store them.
- Host: GitHub
- URL: https://github.com/m-anwar-hussaini/to-do-list
- Owner: M-Anwar-Hussaini
- License: mit
- Created: 2023-06-06T20:43:31.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-06-13T00:57:49.000Z (over 1 year ago)
- Last Synced: 2024-12-27T15:10:30.541Z (22 days ago)
- Topics: bootstrap, css, html, javascript, linters, webpack
- Language: JavaScript
- Homepage:
- Size: 319 KB
- Stars: 10
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 📗 Table of Contents
- [📗 Table of Contents](#-table-of-contents)
- [📖 \[To-Do List\] ](#-to-do-list-)
- [🛠 Built With ](#-built-with-)
- [Tech Stack ](#tech-stack-)
- [Key Features ](#key-features-)
- [🚀 Live Demo ](#-live-demo-)
- [💻 Getting Started ](#-getting-started-)
- [Prerequisites](#prerequisites)
- [Configuring WebPack](#configuring-webpack)
- [Setup](#setup)
- [Install](#install)
- [Usage](#usage)
- [Run tests](#run-tests)
- [Deployment](#deployment)
- [👥 Authors ](#-authors-)
- [🔭 Future Features ](#-future-features-)
- [🤝 Contributing ](#-contributing-)
- [⭐️ Show your support ](#️-show-your-support-)
- [🙏 Acknowledgments ](#-acknowledgments-)
- [📝 License ](#-license-)
**[To-Do List]** is my first Capstone project that mimics a real-world project.
1. ✅ **HTML**
2. ✅ **CSS**
3. ✅ **BootStrap**
4. ✅ **JavaScript**
5. ✅ **WebPack**
6. ✅ **LightHouse**
7. ✅ **WebHint**
8. ✅ **Styelint**
9. ✅ **ESLint**
10. ✅ **Git**
11. ✅ **Github**
Markup
- THML
- MD markup
Style
- CSS
- Bootstrap
Dynamic
- JavaScript
- 🔰 **[Add New Task]**
- 🔰 **[See All Tasks]**
- 🔰 **[Simple Design]**
- 🔰 **[Responsive]**
- 🔰 **[Good look and feel]**
- ✅ You can see the live demo of this webpage by clicking [here](https://m-anwar-hussaini.github.io/To-Do-List/dist/);
**To get a local copy up and running, follow these steps.**
1. Download or clone this [repostory](https://github.com/M-Anwar-Hussaini/To-Do-List).
2. Provide a browser.
3. Open the `./dist/index.html` file using webpage browser.
### Prerequisites
**In order to run this project you need:**
- ✔ [Git](https://git-scm.com/downloads) installed in your machine.
- ✔ Sign in or sign up to your [Github](https://github.com/) account.
- ✔ A professional editer such as [VS Code](https://code.visualstudio.com/download).
- ✔ An Updated web browser such as Google Chrome, you can download it from [here](https://www.google.com/chrome/).
- ✔ [Node.js](https://nodejs.org/en/download) installed in your machine.
- ✔ Lighthouse.
- ✔ Webhint
- ✔ Stylelint
- ✔ ESLint
- ✔ WebPack
```sh
npm init -y
npm install --save-dev [email protected]
npx hint .
```
- ✔ Stylelint
```sh
npm install --save-dev [email protected] [email protected] [email protected] [email protected]
```
- ✔ ESLint
```sh
npm install --save-dev [email protected] [email protected] [email protected] [email protected]
```
### Configuring WebPack
1. Initialize package.json:
```sh
npm init y
```
2. Install webpack:
```sh
npm install webpack webpack-cli --save-dev
```
3. Install CSS style loader:
```sh
npm install --save-dev style-loader css-loader
```
### Setup
- Clone this [repository](https://github.com/M-Anwar-Hussaini/To-Do-List) to your desired folder:
- Example commands:
```sh
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](https://github.com/M-Anwar-Hussaini/To-Do-List) and run `index.html` file on the root of repository.
### Usage
- To run the project, execute the following command:
```sh
cd [YOUR FOLDER]
git clone https://github.com/M-Anwar-Hussaini/To-Do-List.git
```
### Run tests
1. WebHint ☑
```
npx hint .
```
2. Stylelint ☑
```
npx stylelint "**/*.{css,scss}"
```
3. ESLint ☑
```
npx eslint .
```
### Deployment
**This project is deployed by the author, no permission for deployment by any other client.**
👤 **Mohammad Anwar Hussaini (Main Author)**
- 👤 GitHub: [@Anwar Hussaini](https://github.com/M-Anwar-Hussaini)
- 👤 Twitter: [@MAnwarHussaini](https://twitter.com/MAnwarHussaini)
- 👤 LinkedIn: [Mohammad Anwar Hussaini](https://www.linkedin.com/in/mohammad-anwar-hussaini-876638267/)
- [x] **[Add New Task dynamically]**
- [x] **[Local Storage Usage]**
- [x] **[Manipulate Tasks]**
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](https://github.com/M-Anwar-Hussaini/To-Do-List/issues).
If you like this project, kindly drop a start for the [repository](https://github.com/M-Anwar-Hussaini/To-Do-List);
**I would like to thank the following individuals and organizations for their contribution to this project.**
- 🙏 [**Microvere**](https://www.microverse.org/?grsf=mohammad-a-nbtazu) for its arrangement and supports to all Micronauts and me.
- 🙏 [**IonIcon**](https://ionic.io/ionicons) for its free flexable icons.
- 🙏 [**Bootstrap**](https://getbootstrap.com/) Bootstrap for its invaluable framework that greatly enhanced this project.
- 🙏 [**Hafizullah Rasa**](https://github.com/hafiz1379) for his instructions on cinfiguring the WebPack (@hafiz1379).
This project is [MIT](LICENSE) licensed.