Small project(s) to kickstart my learning in React
A minimalist and responsive to-do list app built using React, TypeScript, and CSS Modules. Tasks are saved in the browser's localStorage so your list persists even after refreshing the page.
- ✅ Add tasks using the input field or Enter key
- ✅ Rejects tasks that are empty or contain only numbers/special characters
- ✅ Shows an inline error message if the input is invalid
- ✅ Delete tasks individually
- ✅ Tasks persist using
localStorage - ✅ Clean, responsive UI with custom styling using CSS Modules
- React
- TypeScript
- CSS Modules
localStoragefor data persistence
-
Clone the repository
git clone https://github.com/yourusername/todo-app.git cd todo-app -
Install dependencies
npm install
-
Run the app
npm start
-
Open http://localhost:3000 to view it in the browser.
src/
├── App.tsx # Main React component
├── App.module.css # Component-level styles using CSS Modules
└── index.tsx # App entry point
- The app uses a regex check to ensure that each task contains at least one letter. It won't accept inputs that are only numbers or special characters.
- All tasks are stored in your browser's localStorage and will remain until manually cleared or deleted.
This project is open-source and available under the MIT License.
Built with love using React & TypeScript 💙
---