EduTrack: Modern Student Record Management System

A modern, full-stack student record management application that simplifies the tracking and management of student information. Built with FastAPI and Next.js, EduTrack provides a seamless, responsive interface for educational institutions to maintain student records efficiently.

Experience the perfect blend of powerful backend capabilities with FastAPI and an elegant, user-friendly frontend powered by Next.js and Tailwind CSS. This application demonstrates modern web development practices with type safety, real-time updates, and a clean, intuitive user interface.

Key Highlights

• 🚀 Lightning-fast performance with FastAPI backend
• 💻 Modern, responsive UI with Next.js 14 and Tailwind CSS
• ✨ Real-time notifications and instant updates
• 🔒 Type-safe development with TypeScript
• 📱 Mobile-friendly design
• 🛠 Easy setup and deployment

Features

• Create, Read, Update, and Delete student records
• Responsive user interface with Tailwind CSS
• Form validation and error handling
• Real-time notifications using react-hot-toast
• SQLite database for data persistence
• Type-safe development with TypeScript

Tech Stack

Backend

• FastAPI
• SQLAlchemy
• Pydantic
• SQLite

Frontend

• Next.js 14
• TypeScript
• Tailwind CSS
• Axios
• React Hot Toast

Prerequisites

• Python 3.8 or higher
• Node.js 16 or higher
• npm

Backend Setup

1. Navigate to the backend directory:

cd backend

2. Create and activate a virtual environment:

python -m venv venv
.\venv\Scripts\activate  # Windows
source venv/bin/activate  # Unix/MacOS

3. Install dependencies:

pip install -r requirements.txt

4. Start the backend server:

uvicorn app.main:app --reload

The backend will be available at http://localhost:8000

Frontend Setup

1. Navigate to the frontend directory:

cd frontend

2. Install dependencies:

npm install

3. Start the development server:

npm run dev

The frontend will be available at http://localhost:3000

API Documentation

Once the backend is running, you can access the API documentation at:

• Swagger UI: http://localhost:8000/docs
• ReDoc: http://localhost:8000/redoc

Project Structure

.
├── backend/                # FastAPI backend
│   ├── app/
│   │   ├── database/      # Database configuration
│   │   ├── models/        # SQLAlchemy models
│   │   ├── routes/        # API endpoints
│   │   └── schemas/       # Pydantic schemas
│   └── requirements.txt
└── frontend/              # Next.js frontend
    ├── src/
    │   ├── app/          # Next.js pages
    │   ├── components/   # React components
    │   ├── services/     # API client
    │   └── types/        # TypeScript types
    └── package.json