Project 004

UNIVERSITY
PORTAL

EdTechManagement System2024
ReactTailwind CSSJavaScriptAuth SystemRole-Based Access
University Portal full screenshot

Project Overview

University Portal is a dual-role EdTech management system serving both students and administrators. Students can register, view their profile, courses, and grades. Admins get a dedicated dashboard to manage student records, courses, and system-wide data.

Built with React and Tailwind CSS, the system implements role-based access control that cleanly separates the student and admin experiences within a single unified application.

The Problem

Educational institutions often struggle with fragmented tools — one system for enrollment, another for grades, another for communication. Students and staff navigate multiple logins and interfaces, creating friction and data silos.

The Solution

A unified portal where both students and admins authenticate through a single login, then get routed to their role-appropriate dashboard. Students self-register; admins are provisioned with elevated credentials. Everything is accessible from one clean URL.

Visit Portal

KEY FEATURES

Student Self-Registration

Students create their own accounts independently — no admin intervention needed for enrolment onboarding.

Role-Based Access

A single login endpoint routes users to either the student or admin dashboard based on their credentials and role.

Admin Dashboard

Administrators get a full management dashboard with oversight of students, courses, and portal-wide data.

Course Management

Create, edit, and assign courses to student cohorts. Students see their assigned courses in a structured view.

Grade Tracking

Students can view their current grades and academic progress. Admins can update records in real time.

Responsive Interface

The portal works across all devices — students and staff can access it from phones, tablets, or desktops.

TECHNICAL
DETAILS

Tech Stack

ReactFramework
Tailwind CSSStyling
JavaScriptLanguage
Context APIState / Auth
VercelDeployment

Challenges & Solutions

Challenge

Implementing secure role separation so students cannot access admin routes, even if they know the URL.

Solution

Used React Context for auth state with protected route wrappers that redirect non-authorized roles before rendering any admin UI — no admin content is ever sent to the client for student sessions.

Challenge

Allowing student self-registration while preventing abuse or impersonation of admin accounts.

Solution

Admin accounts are pre-seeded and not creatable through the registration form. The self-registration flow only creates student-role records, with the admin role locked behind provisioned credentials.

PROJECT PREVIEW

NEED AN
EDTECH PORTAL?

I build role-based management systems and educational platforms that are clean, accessible, and easy to maintain.