Exclusive Institutional Alumni Mentorship & Professional Network
A professional networking and structured mentorship platform for university graduates and students — replacing fractured communication channels with a single, secure space for mentorship, career referrals, active networking, and professional growth.
- Overview
- Key Features
- Tech Stack
- Project Architecture
- Roles & Dashboards
- Design System
- Getting Started
- Environment Variables
- Database Seeding
- Scripts Reference
- Contributing
AlumNet is a full-stack web platform built for universities and educational institutions to connect their students and alumni in a structured, professional environment. It goes beyond a simple directory — it provides mentorship workflows, job referral sharing, real-time chat, and AI-powered career guidance, all within a polished, role-based dashboard system.
Core Problem: University alumni networks are typically fragmented across LinkedIn groups, WhatsApp chats, and email threads — with no verified, institution-specific space for structured mentorship or referrals.
AlumNet's Solution: A single, secure, institution-scoped platform with verified roles, structured mentorship sessions, referral boards, and an AI career assistant.
| Feature | Description |
|---|---|
| 👥 Professional Connections | Verified, institution-scoped connections between alumni and current students |
| 🎓 Structured Mentorship | Mentee-mentor matching, session scheduling, and guided logs |
| 💼 Referrals Board | Post and request internal job referrals within the institutional network |
| 💬 Real-Time Messaging | Built-in direct chat system powered by Firestore |
| 🤖 AI Career Assistant | Cloud-Function-backed AI chatbot for resume tips and career direction |
| 🔔 Notification System | Alerts for connection requests, session updates, and referral activity |
| 🛡️ Multi-Role Dashboards | Four tailored dashboards for Students, Alumni, Admins, and Super Admins |
| 📁 Alumni Directory | Searchable, filterable directory of verified graduates |
| 📊 Admin Analytics | Platform-wide metrics and user management for institution admins |
| 🌙 Theme Support | Light/dark mode via next-themes |
| Layer | Technology |
|---|---|
| Framework | Next.js 16 (App Router) |
| UI Library | React 19 |
| Language | TypeScript 5 |
| Styling | Tailwind CSS v4 |
| UI Primitives | shadcn/ui + Base UI |
| Layer | Technology |
|---|---|
| Authentication | Firebase Auth |
| Database | Cloud Firestore |
| Security Rules | Firestore Security Rules |
| AI Chat | Firebase Cloud Functions + Azure AI Inference |
| Layer | Technology |
|---|---|
| Server State | TanStack React Query v5 |
| Client State | React Context API |
| Forms | React Hook Form + Zod |
| Animations | Framer Motion |
| Charts | Recharts |
| Icons | Lucide React |
| Toasts | Sonner |
app/
├── scripts/
│ └── seed.mjs # Firestore mock-data seeding script
├── src/
│ ├── app/ # Next.js App Router
│ │ ├── about/ # Public about page
│ │ ├── admin/ # College Admin dashboard
│ │ ├── ai-chat/ # AI Career Assistant page
│ │ ├── alumni/ # Alumni-facing dashboard
│ │ ├── apply/ # Institutional application flow
│ │ ├── auth/ # Auth flows (sign in, sign up, reset)
│ │ ├── connections/ # Connection management
│ │ ├── dashboard/ # Shared dashboard shell
│ │ ├── directory/ # Searchable alumni/student directory
│ │ ├── mentorship/ # Mentorship sessions & scheduling
│ │ ├── messages/ # Direct messaging inbox
│ │ ├── org/ # Organization/institution pages
│ │ ├── profile/ # User profile pages
│ │ ├── referrals/ # Job referrals board
│ │ ├── student/ # Student-facing dashboard
│ │ ├── sysadmin/ # Super Admin system controls
│ │ ├── globals.css # Global styles & CSS custom properties
│ │ ├── layout.tsx # Root layout with providers
│ │ └── providers.tsx # React Query, theme, and auth providers
│ │
│ ├── components/ # Shared, reusable presentation components
│ │ └── ... # Landing page sections, shared layouts
│ │
│ ├── features/ # Domain-driven feature modules
│ │ ├── connections/ # Connection request logic & UI
│ │ ├── mentorship/ # Mentorship session management
│ │ ├── messaging/ # Real-time chat infrastructure
│ │ ├── notifications/ # Alert hooks & badge components
│ │ ├── referrals/ # Referral posting & request flows
│ │ └── users/ # Profile management & user directory
│ │
│ ├── hooks/ # Shared custom React hooks
│ │ └── ... # useToast, useMobile, useDebounce, etc.
│ │
│ └── lib/ # Core system libraries
│ ├── firebase.ts # Firebase app initialization
│ ├── firestoreService.ts # All Firestore read/write operations
│ ├── firebaseSeeding.ts # Seeding utilities
│ ├── AuthContext.tsx # Global authentication context
│ ├── animations.ts # Shared Framer Motion variants
│ ├── types.ts # Global TypeScript type definitions
│ └── utils.ts # Shared utility functions (cn, etc.)
│
├── .env.example # Environment variable template
├── components.json # shadcn/ui configuration
├── next.config.ts # Next.js configuration
└── tsconfig.json # TypeScript configuration
AlumNet enforces a four-tier role system, each with a dedicated, purpose-built dashboard:
- Browse and search the alumni directory
- Send connection requests to alumni
- Request job referrals from connected alumni
- Book and manage mentorship sessions
- Access the AI Career Assistant for guidance
- Manage incoming connection requests
- Offer mentorship — accept student booking requests
- Post job referrals to the internal board
- Access messaging and profile management
- Moderate and manage institutional users
- Review platform-wide activity metrics
- Approve or reject student/alumni registrations
- Access reporting and analytics dashboards
- System-wide configuration
- Cross-institution management
- Global platform health metrics and overrides
AlumNet uses a custom design system with a distinctive creative north star: "The Lacquer & Grid."
The visual language is a marriage between Swiss-inspired typographic grids and minimalist Japanese aesthetic touches, targeting a level of micro-interaction polish comparable to Stripe.
- Sharp corners everywhere —
0pxborder-radius on all primary UI elements - Solid offset shadows —
6px–10pxsolid charcoal shadows instead of blurred soft shadows - High-contrast workspace — Pure white (
#FFFFFF) on dashboards for maximum readability - No soft gradients or glassmorphism on data-dense pages
| Name | Hex | Usage |
|---|---|---|
| Lacquer Crimson | #A83048 |
Primary CTAs, active states, focus rings |
| Cherry Blossom Mist | #F0CCCC |
Hover states, secondary badges |
| Warm Sand | #CC9C60 |
Status indicators, active decorators |
| Ink Black | #2D2422 |
Primary typography & foreground |
| Tatami Off-White | #FDFBF7 |
Landing page background |
| Border Charcoal | #1A1A1A |
All borders and offset shadows |
| Role | Font | Weight | Size |
|---|---|---|---|
| Display | Space Grotesk | 700 | clamp(2rem, 5vw, 3.5rem) |
| Body | Inter | 400 | 0.875rem |
| Mono / Labels | JetBrains Mono | 400–700 | 0.75rem |
- Node.js
>= 20.x - npm
>= 10.x - A Firebase project with Firestore and Authentication enabled
git clone https://github.com/Mananwebdev160408/Alumnet-latest.git
cd Alumnet-latestnpm installCopy the example environment file and fill in your Firebase project credentials:
cp .env.example .env.localSee the Environment Variables section below for details.
npm run devOpen http://localhost:3000 in your browser.
Create a .env.local file in the root directory with the following variables:
# ─── Firebase Configuration ──────────────────────────────────────────────────
# Found in Firebase Console → Project Settings → Your Apps → SDK Setup
NEXT_PUBLIC_FIREBASE_API_KEY=your_firebase_api_key
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your_project_id.firebaseapp.com
NEXT_PUBLIC_FIREBASE_PROJECT_ID=your_project_id
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your_project_id.firebasestorage.app
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=your_messaging_sender_id
NEXT_PUBLIC_FIREBASE_APP_ID=your_firebase_app_id
# ─── AI Chat Cloud Function ───────────────────────────────────────────────────
# URL of the deployed Firebase Cloud Function for the AI assistant
# Use http://localhost:5001 for local emulator development
NEXT_PUBLIC_AICHAT_FUNCTION_URL=http://localhost:5001Tip: To find your Firebase credentials, go to the Firebase Console → select your project → Project Settings → Your apps → Firebase SDK snippet → Config.
Important: Never commit your
.env.localfile. It is already listed in.gitignore.
To populate your Firestore database with realistic mock data for development (users, connections, mentorship sessions, referrals, messages, notifications):
npm run seedThe seed script (scripts/seed.mjs) creates a complete set of test data including all four user roles, so you can immediately log in and explore all platform features without manual setup.
Test credentials (populated by the seed script) are available in src/lib/testCredentials.ts.
| Script | Command | Description |
|---|---|---|
| Development | npm run dev |
Start Next.js dev server with hot reload |
| Build | npm run build |
Create an optimized production build |
| Start | npm run start |
Start the production server |
| Lint | npm run lint |
Run ESLint across the codebase |
| Seed | npm run seed |
Populate Firestore with mock development data |
Contributions are welcome! Here's how to get started:
- Fork the repository
- Create a feature branch:
git checkout -b feature/your-feature-name - Commit your changes:
git commit -m 'feat: add some feature' - Push to the branch:
git push origin feature/your-feature-name - Open a Pull Request
Please follow the existing code style and ensure your changes don't break the build (npm run build).
This project is licensed under the MIT License.
Built with ❤️ by Manan Gupta · LinkedIn