TaskHub - Modern Task Management Platform

Features

Task Management

• Create tasks with detailed descriptions and budgets
• Browse available tasks
• Claim tasks you're interested in
• Track task progress and status
• View your task history (created and claimed tasks)

User Authentication

• Secure user registration and login
• Profile management with personal information
• Remember me functionality for convenience
• Password confirmation and validation
• Terms and conditions acceptance

Modern UI/UX

• Clean, responsive design with Material-UI components
• Smooth animations and transitions
• Interactive forms with real-time validation
• Modern input styling with focus states
• Error handling and user feedback

Technical Stack

Frontend

• React with Vite
• TypeScript for type safety
• Material-UI for components
• Framer Motion for animations
• React Hook Form for form handling
• Zod for schema validation
• React Query for data fetching
• TailwindCSS for styling

Backend

• Node.js with Express
• MongoDB with Mongoose
• Passport.js for authentication
• Express Session for session management
• Environment variable configuration
• TypeScript for backend development

Getting Started

Prerequisites

• Node.js (v18 or higher)
• MongoDB
• npm or yarn

Installation

1. Clone the repository

git clone [repository-url]

cd TaskBounty
npm install
cd client
npm install
cd ../server
npm install


2. Set up environment variables
SESSION_SECRET=your-secure-secret-key
NODE_ENV=development
MONGODB_URI=mongodb://localhost:27017/taskhub

# Start server
cd server
npm run dev

# Start client
cd ../client
npm run dev

### Project Directory Structure
TaskBounty/
├── client/                    # Frontend application
│   ├── src/
│   │   ├── components/       # Reusable UI components
│   │   ├── pages/           # Page components
│   │   ├── hooks/           # Custom React hooks
│   │   └── utils/           # Utility functions
│   └── public/              # Static assets
├── server/                   # Backend application
│   ├── src/
│   │   ├── routes/         # API routes
│   │   ├── auth/          # Authentication logic
│   │   ├── storage/       # Data storage
│   │   └── utils/         # Utility functions
│   └── config/            # Configuration files
└── shared/                  # Shared types and schemas


npm run dev

cd client
npm run dev