Open Alumns Portal 🎓

A production-ready, open source alumni portal theme / template designed for colleges and communities for community building, networking and maintaining alumni engagement.

✨ Features

• 🎨 Fully Configurable: Customize everything via site.config.yml without touching code
• 📱 Responsive Design: Beautiful UI that works on all devices
• 🔍 Advanced Search: Fuzzy search with faculty and year-based filtering
• 📊 Content Collections: Markdown-driven content using Astro Content Collections
• 🎯 SEO Optimized: Built-in SEO features and meta tags
• ⚡ Performance: Fast, static site generation with minimal JavaScript
• 🎭 Theme System: Easy color customization with CSS variables
• 📚 Documentation: Comprehensive guides for users and contributors

🚀 Quick Start

Prerequisites

• Node.js 18+
• npm or yarn

Installation

1. Clone the repository

   git clone https://github.com/noskofficial/openalumns.git
   cd open-alumns-portal

2. Install dependencies

   npm install

3. Start development server

   npm run dev

4. Open your browser Navigate to http://localhost:4321

🛠️ Configuration

The theme is fully configurable through the site.config.yml file. Here's what you can customize:

Site Information

site:
  name: "Your Alumni Portal"
  description: "Connect with your institution's alumni"
  url: "https://your-domain.com"
  logo: "/logo.svg"
  favicon: "/favicon.ico"
  hero_image: "/hero-bg.jpg"

Colors

colors:
  primary:
    500: "#22c55e"  # Main brand color
  secondary:
    500: "#eab308"  # Accent color
  accent:
    500: "#737373"  # Neutral color

Navigation

navigation:
  - label: "Home"
    url: "/"
    icon: "home"
  - label: "Alumni Directory"
    url: "/alumni"
    mega_menu: true
    submenu:
      - label: "By Year"
        url: "/alumni/years"
      - label: "By Faculty"
        url: "/alumni/faculties"

Faculties

faculties:
  - name: "Computer Science"
    slug: "cs"
    description: "Computer Science graduates"
    icon: "code"
    color: "#22c55e"

📁 Project Structure

open-alumns-portal/
├── src/
│   ├── components/          # Reusable UI components
│   ├── layouts/            # Page layouts
│   ├── pages/              # Astro pages
│   ├── content/            # Content collections
│   │   ├── alumni/         # Alumni profiles
│   │   ├── events/         # Event listings
│   │   └── blog/           # Blog posts
│   ├── styles/             # Global styles and CSS
│   └── utils/              # Utility functions
├── public/                 # Static assets
├── site.config.yml         # Main configuration file
├── tailwind.config.mjs     # Tailwind CSS configuration
└── astro.config.mjs        # Astro configuration

🎨 Customization

Adding New Pages

1. Create a new .astro file in src/pages/
2. Import the Layout component
3. Add your content

---
import Layout from '../layouts/Layout.astro';

export default function Page() {
  return (
    <Layout title="Page Title">
      <h1>Your Content Here</h1>
    </Layout>
  );
}
---

Customizing Styles

• Global CSS: Edit src/styles/global.css
• Tailwind Config: Modify tailwind.config.mjs
• Component Styles: Use Tailwind classes or custom CSS

Adding New Content Types

1. Define schema in src/content/config.ts
2. Create content files in appropriate directories
3. Update components to display new content

📚 Content Management

Alumni Profiles

Create alumni profiles in src/content/alumni/:

---
name: "John Doe"
slug: "john-doe"
faculty: "Computer Science"
year: 2020
bio: "Software engineer passionate about..."
short_bio: "Software Engineer at Tech Corp"
email: "john@example.com"
linkedin: "https://linkedin.com/in/johndoe"
current_position: "Senior Software Engineer"
company: "Tech Corp"
location: "San Francisco, CA"
skills: ["JavaScript", "React", "Node.js"]
featured: true
---

Events

Add events in src/content/events/:

---
title: "Annual Alumni Meet"
slug: "annual-alumni-meet-2024"
description: "Join us for our annual gathering..."
date: 2024-12-15
location: "Main Campus"
category: "Networking"
featured: true
---

Blog Posts

Create blog posts in src/content/blog/:

---
title: "Building Strong Alumni Networks"
description: "Tips for creating meaningful connections..."
author: "Admin"
publishDate: 2024-01-15
category: "Community"
tags: ["networking", "alumni", "community"]
---

Your blog content here...

🚀 Deployment

Vercel (Recommended)

1. Push your code to GitHub
2. Connect your repository to Vercel
3. Deploy automatically

Netlify

1. Build the project: npm run build
2. Deploy the dist/ folder to Netlify

Other Platforms

The theme generates static files, so it works with any static hosting service.

🤝 Contributing

We welcome contributions from the community! Here's how you can help:

Getting Started

1. Fork the repository
2. Create a feature branch: git checkout -b feature-name
3. Make your changes
4. Commit: git commit -m 'Add feature'
5. Push: git push origin feature-name
6. Open a Pull Request

Development Guidelines

• Follow the existing code style
• Add TypeScript types where appropriate
• Test your changes locally
• Update documentation if needed
• Ensure responsive design works

Areas to Contribute

• 🎨 UI/UX improvements
• 🚀 Performance optimizations
• 📱 Mobile experience enhancements
• 🌍 Internationalization support
• 🔧 Additional customization options
• 📚 Documentation improvements
• 🐛 Bug fixes

📖 Documentation

For Users

• Installation Guide
• Configuration Reference
• Content Management
• Customization Guide
• Deployment Guide

For Developers

• Architecture Overview
• Component API
• Content Collections
• Styling System
• Testing Guide

🎯 Roadmap

• Advanced search filters
• Alumni directory export
• Event registration system
• Newsletter integration
• Multi-language support
• Dark mode theme
• Mobile app
• Analytics dashboard

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

• NOSK (Nepal Open Source Klub) - Lead organization
• Astro Team - Amazing static site generator
• Tailwind CSS - Utility-first CSS framework
• Community Contributors - Everyone who helps improve this project

📞 Support

• GitHub Issues: Report bugs or request features
• Discussions: Join community discussions
• Email: info@nosk.org.np

🌟 Star History

---

Made with ❤️ by NOSK and the open source community.

If this project helps you, please give it a ⭐️!