https://github.com/callmedeci/taskify-react
A simple yet flexible task manager built with React, showcasing different approaches to handling tasks, state management, and UI interactions. This project explores various ways to implement a task manager, from basic local state handling to advanced state management solutions. 🚀
https://github.com/callmedeci/taskify-react
Last synced: 5 months ago
JSON representation
A simple yet flexible task manager built with React, showcasing different approaches to handling tasks, state management, and UI interactions. This project explores various ways to implement a task manager, from basic local state handling to advanced state management solutions. 🚀
- Host: GitHub
- URL: https://github.com/callmedeci/taskify-react
- Owner: callmedeci
- Created: 2025-02-03T17:30:15.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2025-02-05T19:32:05.000Z (11 months ago)
- Last Synced: 2025-02-16T03:38:37.691Z (11 months ago)
- Language: JavaScript
- Homepage: https://taskify-react-oupq.vercel.app
- Size: 125 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Taskify React 📝🚀
A simple yet flexible task manager built with React, showcasing different ways to manage tasks, state, and UI interactions. This project demonstrates various approaches to implementing a task manager, from basic local state handling to advanced state management with Redux.
## Features 🌟
- 📝 **Add, Edit, and Delete Tasks**
- 🎨 **Styled with TailwindCSS**
- 🔥 **Toasts for Notifications (`react-hot-toast`)**
- 🚀 **React Router for Navigation**
- ⚡ **Fast Development with Vite**
## Tech Stack 🛠️
| Library | Purpose |
|----------------|---------|
| React 18 | Core framework |
| Redux Toolkit | State management |
| React Redux | Redux bindings for React |
| React Router | Client-side routing |
| TailwindCSS | Utility-first styling |
| date-fns | Date formatting & manipulation |
| react-hot-toast | User-friendly notifications |
| Vite | Lightning-fast development build tool |
## Getting Started 🚀
### 1️⃣ Clone the repository
```sh
git clone https://github.com/yourusername/taskify-react.git
cd taskify-react
```
2️⃣ Install dependencies
```sh
npm install
```
3️⃣ Run the development server
```sh
npm run dev
```
Your app should now be running on http://localhost:5173 🎉.
## Available Scripts 🏗️
- **`npm run dev`** – Start the development server.
- **`npm run build`** – Build the project for production.
- **`npm run preview`** – Preview the production build.
- **`npm run lint`** – Lint the codebase.
### Folder Structure 📂
```php
taskify-react/
│── src/
│ ├── components/ # Reusable UI components
│ ├── features/ # features
│ ├── hooks/ # Custom hooks
│ ├── pages/ # Page components (Home, Tasks, etc.)
│ ├── App.jsx # Main App component
│ ├── main.jsx # Entry point
| |── index.css # Global styles
│── public/ # Static assets
│── package.json # Dependencies & scripts
│── README.md # Project documentation
```
### Contributions 🤝
If you'd like to contribute, feel free to fork the repo and submit a pull request! 🚀