Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 

Repository files navigation

TaskFlow

A colorful and responsive to-do list application built with HTML, CSS, and vanilla JavaScript as a front-end practice project.

Features

  • Add tasks with a title and description
  • Mark tasks as completed
  • Move completed tasks back to active tasks
  • Remove individual tasks
  • Clear all tasks
  • Display counters for active and completed tasks
  • Save tasks in Local Storage
  • Keep tasks after refreshing the page
  • Responsive layout for mobile devices

Technologies

  • HTML5
  • CSS3
  • Vanilla JavaScript
  • Local Storage
  • ES Modules
  • Google Fonts

Project Structure

TaskFlow

A colorful and responsive to-do list application built with HTML, CSS, and vanilla JavaScript as a front-end practice project.

Features

  • Add tasks with a title and description
  • Mark tasks as completed
  • Move completed tasks back to active tasks
  • Remove individual tasks
  • Clear all tasks
  • Display counters for active and completed tasks
  • Save tasks in Local Storage
  • Keep tasks after refreshing the page
  • Responsive layout for mobile devices

Technologies

  • HTML5
  • CSS3
  • Vanilla JavaScript
  • Local Storage
  • ES Modules
  • Google Fonts

Project Structure

taskflow-vanilla-js/
├── index.html
├── style.css
├── main.js
├── render.js
└── storage.js

How to Run
1. Clone this repository: git clone https://github.com/your-username/taskflow-vanilla-js.git
2. Open the project folder.
3. Run it with a local development server, for example Live Server in VS Code.

What I Practiced:
DOM manipulation
Event delegation
JavaScript array methods such as filter, findIndex, and forEach
Working with objects and application state
Saving and loading data with Local Storage
Splitting JavaScript into modules
Creating responsive layouts with CSS Grid

About

A colorful and responsive to-do list application built with HTML, CSS, and vanilla JavaScript as a front-end practice project. It lets users add, complete, reactivate, and remove tasks, with all data saved locally using Local Storage.

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages