Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/henrylin03/tasks

Vanilla-JS web app to help you manage your to-dos
https://github.com/henrylin03/tasks

javascript odin-project tasks to-do-app to-do-list todo todolist web web-app web-application

Last synced: 25 days ago
JSON representation

Vanilla-JS web app to help you manage your to-dos

Awesome Lists containing this project

README

        

[![pages-build-deployment](https://github.com/henrylin03/tasks/actions/workflows/pages/pages-build-deployment/badge.svg?branch=gh-pages)](https://github.com/henrylin03/tasks/actions/workflows/pages/pages-build-deployment)
[![GitHub Issues](https://img.shields.io/github/issues/henrylin03/tasks?style=flat)](https://github.com/henrylin03/tasks/issues)
[![MIT License][license-shield]][license-url]
[![LinkedIn][linkedin-shield]][linkedin-url]





logo

Tasks


Vanilla-JS web app to help manage your to-dos


## About

Let Tasks help manage your various to-do lists, across all aspects of your life.

[![Screenshot](./docs/screenshots/preview-screenshot.png)](https://henrylin.io/tasks)

Tasks uses persistent storage, so your data will still be there when you open your browser up again!

### Technologies

![HTML](https://img.shields.io/badge/HTML-E34F26?style=for-the-badge&logo=html5&logoColor=black)
![CSS](https://img.shields.io/badge/CSS-1572B6?style=for-the-badge&logo=html5&logoColor=black)
![JavaScript](https://img.shields.io/badge/Vanilla-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)
[![Webpack](https://img.shields.io/badge/Webpack-8DD6F9?style=for-the-badge&logo=webpack&logoColor=black)](https://webpack.js.org/)

## Usage

Once **[Tasks](https://henrylin.io/tasks)** loads, you should see a list of tasks in your inbox or, if it's your first time, a blank inbox.

Your inbox stores once-off tasks, and any tasks you haven't categorised yet into a "project". A project is a collection of tasks that all try and achieve the same goal. For example, you might have a project called "Japan trip" and lists out all the tasks you need to do before you holiday there. You can see all of your projects to the left.

![screenshot of Japan trip example](./docs/screenshots/preview-screenshot-japan.png)

You can expand any tasks by clicking on it. In the popup, you can also edit any of the details as things evolve.


screenshot of expanded task


Once a task is done, you can tick the checkbox, and the tasks will go to the bottom of your inbox or project.

![screenshot of completed task](./docs/screenshots/screenshot-completed-task.png)

## Contributing

If you have a suggestion that would make Tasks better, please feel free to add an issue and/or fork and create a pull request.

## License

Distributed under the MIT License. See `LICENSE.txt` for more information.

## Acknowledgements

- Wireframes and diagrams completed in [draw.io](https://app.diagrams.net/)
- All icons were by [tabler icons](https://tabler.io/icons)
- Colour palette suggestions by [ColorSpace](https://mycolor.space/)
- The present README file was heavily influenced by the ["Best-README-Template"](https://github.com/othneildrew/Best-README-Template)
- Favicon was generated by [favicon.io](https://favicon.io)
- Thank you to [The Odin Project](https://www.theodinproject.com/) community on Discord

[license-shield]: https://img.shields.io/github/license/henrylin03/tasks.svg?style=flat
[license-url]: https://github.com/othneildrew/Best-README-Template/blob/master/LICENSE.txt
[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=social&logo=linkedin&colorB=555
[linkedin-url]: https://www.linkedin.com/in/henrylin03/