✅ Todo App

React 19 • Redux Toolkit • Vite • Tailwind CSS

A modern Todo Application built with React 19 and Vite, designed to showcase clean architecture, scalable state management, and smooth UI animations.

🔗 Live Demo
👉 https://amiraligrr.ir/todo

⚠️ Important
The backend (json-server) is not running on the live demo.
Only the Login page and Main UI are accessible.

---

✨ Features

• 🔐 Authentication UI (Login page – demo only)
• 📝 Task management structure (Add / Edit / Delete)
• 🧠 Global state management with Redux Toolkit
• 🎞 Smooth animations using Framer Motion
• 🎨 Responsive design with Tailwind CSS
• 🌐 API-ready structure using Axios
• 🍪 Cookie handling with js-cookie
• 🧭 Routing with React Router v7
• 🧩 Icons by Lucide React

---

🛠 Tech Stack

🚀 Frontend

• React 19
• Vite
• Redux Toolkit
• React Redux
• React Router DOM v7
• Tailwind CSS
• Framer Motion
• Axios
• Lucide React
• js-cookie

🧰 Tools

• ESLint
• Vite Plugin React
• TypeScript types (React & React DOM)

---

📦 Installation

1️⃣ Clone repository

git clone https://github.com/amiraligrr/todo-react-app
cd todo

2️⃣ Install dependencies

npm install

3️⃣ Start development server

npm run dev

4️⃣ Run mock backend (optional)

npm run server
Backend runs on http://localhost:3001 using json-server

---

📜 Scripts

npm run dev # Development server
npm run build # Production build
npm run preview # Preview build
npm run lint # Run ESLint
npm run server # Run json-server

---

🚫 Live Demo Limitations

• ❌ No real authentication
• ❌ No backend API
• ✅ UI and routing available
• ✅ Layout and animations visible

Run the project locally for full functionality.

---

📌 Status

🟡 In Development

Portfolio project demonstrating modern React patterns and clean UI design.

---

👨‍💻 Author

Amirali
🌐 https://amiraligrr.ir

---

Thanks for reading

Made by AmirAli Granmaye