📊 UniTrack: Attendance Monitoring Platform for Universities

Easily track and analyze student attendance through a robust dashboard. Gain valuable insights and manage academic administration more effectively with powerful data analytics and visualizations.

Introduction ✦ Features ✦ Tech Stack ✦ Directory Structure ✦ Getting Started ✦ Roadmap

📝 Introduction

UniTrack Dashboard is an admin tool for tracking and analyzing student attendance in universities. It offers a user-friendly interface for managing students, classes, and lectures, with detailed attendance analytics. Built with Next.js, Tailwind CSS, and Prisma.

✨ Features

🔍 Attendance Analytics: View visualizations and insights on university-wide attendance.
📊 Data Tables: Access, filter, and manage data for students, classes, and lectures.
⚙️ Admin Controls: Manage courses, users, and more with full control.
🛠️ Real-Time Data: Live updates for attendance metrics using React Query and tRPC.
📈 Customizable Dashboards: Tailor the platform to show the most relevant data to administrators.

🛠️ Tech Stack

Next.js - Fullstack framework for server-side rendering and API routes
React - UI framework with server components for dynamic UIs
TypeScript - Strongly typed language for safer, maintainable code
Prisma - ORM for interacting with the database efficiently
tRPC - End-to-end type-safe API layer for smooth client-server communication
Tailwind CSS - Utility-first CSS framework for rapid UI development
Radix UI - Modular and accessible UI components
TanStack Table - Powerful table data management for UI
Next-Auth.js - Authentication management
Railway - Database hosting for scalable deployments

📂 Project Structure

.
├── .github              # GitHub Actions CI/CD workflows
│    └── workflows
│        ├── build       # Build the project on every push to the main branch
│        └── lint-pr     # Lint PR titles to enforce conventional commits
│
├── .vscode              # Recommended extensions and settings for VSCode
├── prisma               # Prisma schema and migrations
│
├── src                  # Main source code
│   ├── app              # Next.js App Router directory for pages and API routes
│   │     └── api        # API routes for the attendance scanner hardware units
│   ├── components       # UI and shared components, with shadcn-ui
│   ├── lib              # Shared utility functions and hooks
│   ├── pages            # (deprecated) Next.js Pages Router directory
│   ├── server           # tRPC Routers, Prisma Client, and NextAuth server-side code
│   │     └── routers    # tRPC Procedures for type-safe API endpoints
│   ├── styles           # Global styles, Tailwind CSS configuration, and custom font imports
│   ├── types            # Shared TypeScript types and Zod schemas for validation
│   └── env.mjs          # Type-safe environment variables using t3-env
│
├── docker-compose.yml   # Docker Compose file for local development databases
├── .nvmrc               # Node Version Manager (nvm/fnm) file for setting a specific Node version
└── package.json         # Project metadata and dependencies

🚀 Getting Started

Prerequisites

Node.js v16.x or higher
PostgreSQL (or equivalent) database
Vercel (optional for deployment)

Installation

Clone the repository:

git clone https://github.com/UniTrackApp/dashboard.git
cd dashboard

Install dependencies:

npm install

Set up environment variables by copying .env.example to .env and adding your credentials:

cp .env.example .env

Apply database migrations:

npx prisma migrate dev

Run the development server:

npm run dev

Open http://localhost:3000 to view the app in your browser.

✌️ Team

🎯 Roadmap

Implement some advanced charts using Recharts and shadcn-ui charts
Add multi-campus support
Enable real-time student location tracking
Expand data export capabilities (CSV, PDF)
See GitHub Issues for more details and upcoming features

🔑 License

GNU GPLv3.