Scholar Stream 🎓📚

Scholar Stream is a modern web application built with React 19 and Vite, designed for fast development, scalability, and a smooth developer experience. It leverages powerful tools like React Query, Firebase, Tailwind CSS, and React Hook Form to deliver a robust and responsive UI.

---

🚀 Tech Stack

Frontend

• React 19 – Component-based UI
• React Router v7 – Client-side routing
• Vite – Lightning-fast build tool
• Tailwind CSS v4 – Utility-first styling
• DaisyUI – Prebuilt Tailwind components
• React Icons – Icon library

State & Data Management

• @tanstack/react-query – Server-state management
• Axios – HTTP client

Forms & UI Feedback

• React Hook Form – Form handling & validation
• React Hot Toast – Toast notifications
• SweetAlert2 – Elegant alerts & modals

Backend / Services

• Firebase – Authentication, database, and hosting
• @dataconnect/generated – Local generated data connector

Tooling & Quality

• ESLint – Code linting
• Vite Plugin React – React fast refresh & optimizations

---

📂 Project Structure (Typical)

src/
├── assets/            # Static assets
├── components/        # Reusable UI components
├── pages/             # Route-level pages
├── hooks/             # Custom React hooks
├── services/          # API & Firebase logic
├── routes/            # App routing
├── styles/            # Global styles
├── main.jsx           # App entry point
└── App.jsx            # Root component

🛠️ Installation & Setup Prerequisites

Node.js v18 or later

npm or pnpm

Install dependencies
npm install

Start development server
npm run dev

The app will be available at:

http://localhost:5173

📦 Available Scripts

Script Description
npm run dev Start development server
npm run build Build for production
npm run preview Preview production build
npm run lint Run ESLint

🎨 Styling

Tailwind CSS v4 is used for styling

DaisyUI provides ready-made components

Fully responsive and customizable design system

🔐 Firebase Integration

Firebase is used for:

Authentication

Database / backend services

Make sure to add your Firebase configuration in an environment file

📈 Best Practices Followed

Modular folder structure

Server-state caching with React Query

Form validation with React Hook Form

Clean and consistent linting rules

Modern ES modules (type: module)

🧪 Linting

npm run lint

Ensures code quality using ESLint with React Hooks rules.

📜 License

This project is private and not licensed for public distribution.

🙌 Acknowledgements

Built with ❤️ using:

React

Vite

Tailwind CSS

Firebase

📬 Contact

For questions or collaboration, feel free to reach out.