Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/oguntayomicheal/to-do-list
A single-page application that allow users to add their To Do items. The items could be checked as completed and the completed task can be removed. Built with JavaScript, HTML and CSS
https://github.com/oguntayomicheal/to-do-list
css3 html5 javascript
Last synced: 25 days ago
JSON representation
A single-page application that allow users to add their To Do items. The items could be checked as completed and the completed task can be removed. Built with JavaScript, HTML and CSS
- Host: GitHub
- URL: https://github.com/oguntayomicheal/to-do-list
- Owner: oguntayomicheal
- Created: 2022-10-04T17:29:33.000Z (about 2 years ago)
- Default Branch: master
- Last Pushed: 2023-04-05T03:12:50.000Z (over 1 year ago)
- Last Synced: 2024-10-09T14:09:47.082Z (about 1 month ago)
- Topics: css3, html5, javascript
- Language: JavaScript
- Homepage:
- Size: 473 KB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# π Table of Contents
- [π Table of Contents](#-table-of-contents)
- [π ToDo-List-App ](#-todo-list-app-)
- [π Built With ](#-built-with-)
- [Tech Stack ](#tech-stack-)
- [Key Features ](#key-features-)
- [π Live Demo ](#-live-demo-)
- [π» Getting Started ](#-getting-started-)
- [Prerequisites](#prerequisites)
- [Setup](#setup)
- [Install](#install)
- [Usage](#usage)
- [Run tests](#run-tests)
- [Deployment ](#deployment-)
- [π€ Author ](#-author-)
- [π Future Features ](#-future-features-)
- [π€ Contributing ](#-contributing-)
- [βοΈ Show your support ](#οΈ-show-your-support-)
- [π Acknowledgments ](#-acknowledgments-)
- [β FAQ ](#-faq-)
- [π License ](#-license-)> This is a single page application that allows users to keep track of their tasks. The CRUD (create, read, update, delete) methods were implemented. Thus, Users can add the task and also check the checkbox if the task has been completed. The updated tasks list is stored in the local storage.
Client
- **Responsive Design.**
- **Pixel Perfect design.**
- **Local Storage**
[Live Demo Link](https://oguntayomicheal.github.io/To-Do-list/dist/)
To get a local copy up and running, follow these steps.
### Prerequisites
In order to run this project you need:
- A web browser to view output e.g [Google Chrome](https://www.google.com/chrome/).
- An IDE e.g [Visual studio code](https://code.visualstudio.com/).
- [A terminal](https://code.visualstudio.com/docs/terminal/basics).
### Setup
Clone this repository to your desired folder or download the Zip folder:
```
git clone https://github.com/oguntayomicheal/To-Do-list.git
```
- Navigate to the location of the folder in your machine:
**``you@your-Pc-name:~$ cd To-Do-List``**
### Install
Install all dependencies:
```
npm install
```
### Usage
To run the project, follow these instructions:
- After Cloning this repo to your local machine.
- To get it running on your default browser and local host, run:
```
npm start
```
### Run tests
To run tests, run the following command:
- Track HTML linter errors run:
```
npx hint .
```
- Track CSS linter errors run:
```
npx stylelint "**/*.{css,scss}"
```
- Track JavaScript linter errors run:
```
npx eslint .
```
- For unit testing, run:
```
npm test
```
You can deploy this project using: GitHub Pages,
- I used GitHub Pages to deploy my website.
- For more information about publishing sources, see "[About GitHub pages](https://docs.github.com/en/pages/getting-started-with-github-pages/about-github-pages#publishing-sources-for-github-pages-sites)".
π€ **Micheal Oguntayo**
- GitHub: [@oguntayomicheal](https://github.com/oguntayomicheal)
- Twitter: [@OguntayoMicheal](https://twitter.com/Oguns_micky)
- LinkedIn: [@OguntayoMicheal](https://www.linkedin.com/in/ogunsmicky/)
- [ ] **Implement button to switch sort type (ascending or descending).**
- [ ] **Implement completed and not-completed routes for completed and non-completed tasks, respectively.**
- [ ] **Add backend to store tasks.**
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](../../issues/).
Give a βοΈ if you like this project and how I managed to build it!
- The original design ideal from Microverseπ.
- Project from [Microverse](https://www.microverse.org/?grsf=bcrgi3) JavaScript module.
- Thanks to the Microverse team for the great curriculum.
- Thanks to the Code Reviewer(s) for the insightful feedbacks.
- A great thanks to My coding partner(s), morning session team, and standup team for their contributions.
- Hat tip to anyone whose code was used.
- **Can I fork and reuse the repository**
- Yes please, feel free.
- **Can I improve the repository, and my changes will be accepted if they are good?**
- Yes please, nice ideas are welcome, please.
This project is [MIT](./MIT) licensed.