Edu Sync

Live Site: https://edu-sync-pro.web.app/

---

🚀 Project Overview

Edu Sync is a modern, collaborative platform designed to connect students, tutors, and administrators for a seamless educational experience. Our mission is to make learning accessible, engaging, and effective for everyone, everywhere. Edu Sync streamlines study session scheduling, resource sharing, and progress tracking—all in a secure, user-friendly environment.

• Connect with expert tutors and a global community of learners
• Schedule and manage study sessions with ease
• Share and access study materials and resources
• Track your learning journey and achievements
• Enjoy a responsive, modern UI/UX built for all devices

---

🌟 Website Features

• Role-Based Dashboards for Admin, Tutor, and Student with tailored statistics and controls
• Secure Authentication with email/password and social login options
• Comprehensive Study Session Management: Create, book, approve, and review sessions
• Material Upload & Download for sharing study resources
• Dynamic Announcements to keep users informed
• Animated Statistics & Charts for visual insights
• Responsive, Mobile-First Design for all devices
• Stripe-Powered Payment Integration for secure transactions
• User Profile Management with editable details and avatars
• Advanced Search & Filtering for sessions, tutors, and materials
• Notifications & Alerts for important actions and updates
• Modern UI/UX using Tailwind CSS and DaisyUI

---

🛠️ Tech Stack & Main Packages

Package	Purpose/Description
React	UI library for building interactive interfaces
Vite	Fast build tool and dev server
@tanstack/react-query	Data fetching, caching, and state management
recharts	Beautiful, customizable charts and graphs
react-countup	Animated number counters for stats
react-hook-form	Form state management and validation
axios	Promise-based HTTP client for API requests
firebase	Authentication and backend integration
@stripe/stripe-js	Stripe payment integration
@stripe/react-stripe-js	React bindings for Stripe
tailwindcss & daisyui	Utility-first CSS and UI components
lottie-react	Render Lottie animations in React
framer-motion	Animations and transitions
react-icons	Popular icon packs for React
sweetalert2	Beautiful, responsive alerts and modals
swiper, react-slick	Modern carousels and sliders
aos	Animate on scroll library

---

📦 Getting Started

1. Clone the Repository

git clone https://github.com/your-username/edu-sync-client.git
cd edu-sync-client

2. Install Dependencies

npm install

3. Start the Development Server

npm run dev

The app will be available at http://localhost:5173 (or as indicated in your terminal).

---

📁 Project Structure

edu-sync-client/
  ├── public/                # Static assets
  ├── src/
  │   ├── assets/            # Images, logos, animations, PDFs
  │   ├── components/        # Reusable UI components
  │   ├── context/           # React context providers
  │   ├── firebase/          # Firebase config
  │   ├── hooks/             # Custom React hooks
  │   ├── layout/            # Layout components
  │   ├── pages/             # Page components (dashboard, auth, etc.)
  │   ├── routes/            # Route definitions and guards
  │   └── utils/             # Utility functions
  ├── package.json
  └── vite.config.js

---

🌐 Environment Variables

Create a .env file in the root directory and add your environment-specific variables (e.g., Firebase config, API base URL, Stripe keys).

---

🤝 Contributing

Contributions are welcome! Please open issues or pull requests for suggestions, bug fixes, or improvements.

---

👨‍💻 Developer & Contact

• Portfolio: shihab-dev.web.app
• LinkedIn: linkedin.com/in/shihab-dev

---

📄 License

This project is licensed under the MIT License.

---

🙏 Acknowledgements

• React
• Vite
• Tailwind CSS
• DaisyUI
• TanStack Query
• Recharts
• Firebase
• Stripe
• And all other amazing open-source libraries used!

---

Edu Sync – Empowering education, one connection at a time.