Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/starsheriff2/todo-list-code-review
https://github.com/starsheriff2/todo-list-code-review
Last synced: about 7 hours ago
JSON representation
- Host: GitHub
- URL: https://github.com/starsheriff2/todo-list-code-review
- Owner: StarSheriff2
- License: mit
- Created: 2021-07-19T21:21:34.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2021-07-20T14:02:35.000Z (over 3 years ago)
- Last Synced: 2023-03-10T19:02:38.924Z (over 1 year ago)
- Language: JavaScript
- Size: 33 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# To Do List app
![](https://img.shields.io/badge/Microverse-blueviolet)
![](https://img.shields.io/badge/Academic-blue)
![](https://img.shields.io/badge/HTML-red)
![](https://img.shields.io/badge/JavaScript-yellow)
![](https://img.shields.io/badge/CSS-blue)To-Do list app is an academic project to learn how to use Webpack and ES6 JS standards.
> The app has a minimalist approach. Users can add new tasks and check them off once completed. Users can also move them around through drag-and-drop and edit their content.
![screenshot](./other/README_images/app_screenshot.png)
I built this project using webpack and Vanilla JS.
Features:
- add a new task
- check completed task
- remove completed tasks from the list
- drag and drop tasks to change their order## Live Demo
See demo here [https://starsheriff2.github.io/To-Do-list-app/](https://starsheriff2.github.io/To-Do-list-app/)
## Built With
- HTML, CSS, JS
- NPM 7.18.1
- Webpack 5.44.0
- HtmlWebpackPlugin
- webpack-dev-server
- Linters: ESLint, Stylint, WebHint
- VS Code
## Getting StartedTo get a local copy up and running, follow these simple example steps.
### Prerequisites
- A browser to open the main file
- Node.js
- NPM
### Setup
1. Open your terminal or command prompt.
2. If you do not have git installed in your system, skip this step and go to step 3; otherwise, go to the directory where you want to copy the project files and clone it by copying this text into your command prompt/terminal: `[email protected]:StarSheriff2/To-Do-list-app.git`.
Now go to the ***"Install Dependencies"*** section
3. Download the program files by clicking on the green button that says “**Code**” on the upper right side of the project frame.
4. You will see a dropdown menu. Click on “**Download ZIP**.”
5. Go to the directory where you downloaded the **ZIP file** and open it. Extract its contents to any directory you want in your system.### Install Dependencies
1. Go to the root directory of the project
2. In your command line, while in the root dir, type `npm install`. It will install all necessary dependencies in your project files
3. Now type `npm run start`. It will load the project in your default browser.
**Note:
_This command will not stop on its own. If you change something in your project files, it will recompile and reload the page in your browser. To exit, hit "ctrl + c"_**
### Linters
To run the linters included in this repository, you will need to install them locally. **Note:** You will need node.js for this and npm:
- to install WebHint, run `npm install --save-dev [email protected]`
- for Stylelint, `npm install --save-dev [email protected] [email protected] [email protected] [email protected]`
- for ESlint, `npm install --save-dev [email protected] [email protected] [email protected] [email protected]`To run the linters, go the root directory of your repository, and copy/paste the following commands in your terminal:
- to check the HTML file, `npx hint .`
- to check the stylesheets, `npx stylelint "**/*.{css,scss}"`
- to check the JS files, `npx eslint .`### Usage
- You can add new tasks once the app has loaded to your browser
- Enjoy## Author
👤 **Arturo Alvarez**
- Github: [@StarSheriff2](https://github.com/StarSheriff2)
- Twitter: [@ArturoAlvarezV](https://twitter.com/ArturoAlvarezV)
- Linkedin: [Arturo Alvarez](https://www.linkedin.com/in/arturoalvarezv/)## 🤝 Contributing
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](https://github.com/StarSheriff2/To-Do-list-app/issues).
## Show your support
Give a ⭐️ if you like this project!
## 📝 License
This project is [MIT](https://github.com/StarSheriff2/To-Do-list-app/blob/development/LICENSE) licensed.