Act as a senior full-stack software engineer, UI/UX designer...

Prompt

Act as a senior full-stack software engineer, UI/UX designer, database architect, and AI engineer. Build a complete, modern, responsive AI-Powered Student Management System for a university/college. Project Goal Create a professional student management platform where Admins, Teachers, and Students can securely manage academic activities, attendance, marks, assignments, fees, schedules, and performance analytics from separate dashboards. User Roles 1. Admin 2. Teacher 3. Student Implement secure authentication and role-based access control. Admin Dashboard Include: - Total students - Total teachers - Departments - Courses - Attendance overview - Fee collection overview - Recent activities - Student performance analytics - Add/edit/delete students - Add/edit/delete teachers - Manage departments and courses - Manage semesters/classes - Manage timetable - Manage fees - Generate reports Teacher Dashboard Include: - Teacher profile - Assigned courses - Student list - Attendance management - Add/edit marks - Assignment creation - Assignment submission review - Student performance analytics - Class timetable - Announcements Student Dashboard Include: - Student profile - Attendance percentage - Subjects/courses - Marks and grades - GPA/CGPA - Assignments - Assignment submission - Fee status - Timetable - Announcements - Academic performance charts AI Performance Analysis Add an AI-powered analytics module that analyzes: - Attendance - Previous marks - Assignment performance - Quiz/exam scores - Course-wise performance The AI should: - Identify students who may be academically at risk - Predict possible performance trends - Generate personalized study recommendations - Highlight weak subjects - Provide understandable explanations for recommendations Display AI insights using clean cards, charts, and warning indicators. UI/UX Create a premium modern dashboard design: - Clean professional interface - Responsive on desktop, tablet, and mobile - Sidebar navigation - Top navigation bar - Modern cards - Interactive charts - Tables with search/filter/sort - Modal forms - Toast notifications - Loading states - Empty states - Error states - Dark/light mode Use a consistent professional color system and typography. Avoid an overly complicated design. Database Design a normalized relational database containing appropriate tables for: - Users - Students - Teachers - Departments - Courses - Enrollments - Attendance - Assignments - Submissions - Exams - Marks - Grades - Fees - Timetable - Announcements - AI performance reports Use proper primary keys, foreign keys, indexes, timestamps, and relationships. Security Implement: - Secure authentication - Password hashing - Role-based authorization - Protected routes - Input validation - API validation - Secure database queries - Proper error handling - Session/token security Recommended Technology Frontend: - Next.js - TypeScript - Tailwind CSS - Modern component library Backend: - Node.js / Next.js API - REST APIs or server actions Database: - PostgreSQL Charts: - Recharts or an equivalent modern charting library AI: - Integrate an LLM/API for performance analysis. - Keep AI logic modular so the AI provider can easily be replaced later. Important Development Requirements - Use clean, scalable architecture. - Use reusable components. - Write maintainable TypeScript code. - Do not hardcode data unnecessarily. - Create realistic demo/seed data. - Include proper API routes. - Include database schema/migrations. - Add form validation. - Add pagination where appropriate. - Make all dashboard buttons and navigation functional. - Do not create fake UI functionality. - Handle loading, errors, and empty data properly. Main Pages Create: - Landing/Login page - Admin dashboard - Teacher dashboard - Student dashboard - Students - Teachers - Departments - Courses - Attendance - Assignments - Exams & Marks - Grades - Fees - Timetable - Announcements - AI Performance Analytics - Reports - Profile - Settings Final Requirement Build this as a real full-stack application, not just a static frontend mockup. Start by designing the project architecture and database schema, then implement authentication, backend APIs, database integration, dashboards, AI analytics, and finally polish the UI/UX. Make the final application look like a professional commercial university management product.

A system prompt was added to support web rendering