Skip to content

In this project, we built a todo application using React and the Context API, focusing on state management and component composition.

Notifications You must be signed in to change notification settings

JohannaBN/ToDos

 
 

Repository files navigation

Todo - useContext Project

In this project, we built a todo application using React and the Context API, focusing on state management and component composition.

The Problem

To tackle the task, we first outlined the necessary components and sketched the app's UI in figma. Breaking down the UI into smaller components helped organize our approach. We utilized React for building components and employed the Context API to manage state globally across the app. By creating a context with createContext() and providing it using <Context.Provider>, we ensured data accessibility throughout the app.

For managing todo items, we created functions within the context to toggle completion status, add new tasks, remove tasks, and clear all tasks. These functions were used to interact with the todo list state stored in the context. Additionally, we implemented features like displaying the current date, marking tasks as completed, and removing tasks.

To style the app, we opted for a clean and simple design, enhancing usability and readability. Utilized CSS for styling, ensuring a visually appealing and intuitive user interface.

If we had more time, we would have liked to implement some of the stretch goals, such as adding timestamps. Additionally, we would have explored features like filtering tasks, categorizing tasks with tags, and creating projects for task organization to enhance the app's functionality further.

View it live

https://daily-startup-checklist.netlify.app/

About

In this project, we built a todo application using React and the Context API, focusing on state management and component composition.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 65.3%
  • CSS 27.4%
  • HTML 7.3%