msaleemdev/react-todo-context

This is a small browser-based task manager written in React, built by Muhammad Saleem as a learning exercise to show one specific React pattern. A live version is hosted on Vercel. The app lets you add tasks, mark them complete, edit them inline, and delete them. Your task list is saved in the browser's LocalStorage, so it survives page reloads without needing a server or a database. The stated focus of the project is state management. Instead of passing data down through many layers of components by hand, the app uses the React Context API. A single Provider component holds the list of tasks and the functions that change it, and any child component can read from or write to that shared state through a custom useTodo hook. The README points out three habits the code follows: initializing state lazily from LocalStorage on first render, using the functional form of state updates so quick clicks always see the latest list, and treating arrays as immutable by building new ones with .map and .filter. The code is organized into a contexts folder for the Provider and the custom hook, and a components folder for the input form and the individual task item. App.jsx is the top-level layout that wires everything together. Styling is done with Tailwind CSS version 4. The README also mentions that the author worked on the project entirely from a mobile setup using Termux, Neovim with LazyVim, and a file explorer app. To run it locally, you clone the repository, run npm install, and start the dev server with npm run dev. The author calls this Milestone 1 of a planned series and says a second repository, rebuilding the same app on top of Redux Toolkit, is in progress. If you are learning React and want a compact example of Context API plus LocalStorage persistence, this is the kind of small reference project you can read end to end in one sitting.