Research Organization Template

A modern Next.js template for research organizations to showcase projects, foster community discussions, and manage content with role-based access control.

✨ Features

• Project Showcase - Public project gallery with filtering, search, and detailed project pages
• Community Discussions - Reddit-style discussion board with nested comments and voting
• Role-Based Access Control - Admin, Manager, and Member roles with appropriate permissions
• Admin Dashboard - Content management system for projects and user roles
• Responsive Design - Modern UI with dark mode support
• Type-Safe - Full TypeScript support with comprehensive type definitions

🚀 Tech Stack

• Framework: Next.js 15.2.4 (App Router)
• Language: TypeScript 5, React 19
• Database & Auth: Supabase
• Styling: Tailwind CSS 4, shadcn/ui, Aceternity UI
• UI Libraries: Framer Motion, Lucide React, React Icons, Radix UI
• Notifications: Sonner
• Email: Resend (optional)
• Deployment: Vercel (recommended)

📋 Prerequisites

Before you begin, ensure you have:

• Node.js 18+ installed
• A Supabase account (sign up for free)
• npm, yarn, pnpm, or bun package manager

🛠️ Quick Start

1. Clone the Repository

git clone <your-repo-url>
cd Next-ProjectSpace

2. Install Dependencies

npm install
# or
yarn install
# or
pnpm install

3. Set Up Environment Variables

Copy the example environment file:

cp .env.example .env.local

Fill in your Supabase credentials:

NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key

Get these from your Supabase project: Settings → API

4. Set Up Database

Follow the detailed setup guide in docs/SETUP.md to:

1. Create all required database tables
2. Set up Row Level Security (RLS) policies
3. Configure authentication
4. Add yourself as an admin user

5. Run the Development Server

npm run dev
# or
yarn dev
# or
pnpm dev

Open http://localhost:3000 in your browser.

📚 Documentation

• Setup Guide - Complete database setup and configuration
• Deployment Guide - Deploy to Vercel or other platforms
• API Reference - API endpoints and usage

🏗️ Project Structure

src/
├── app/
│   ├── (withNavbar)/          # Public pages
│   │   ├── page.tsx           # Home page
│   │   ├── projects/          # Project showcase
│   │   ├── community/         # Discussion board
│   │   ├── about/             # About page
│   │   └── contact/           # Contact page
│   ├── (withoutNavbar)/       # Auth-required pages
│   │   ├── login/             # Login page
│   │   ├── signup/            # Sign up page
│   │   └── dashboard/         # User dashboard
│   │       └── admin/         # Admin pages
│   └── api/                   # API routes
├── components/
│   ├── ui/                    # shadcn/ui components
│   ├── admin/                 # Admin components
│   ├── community/             # Community components
│   ├── dashboard/             # Dashboard widgets
│   └── auth/                  # Authentication components
└── utils/
    ├── supabase/              # Supabase clients
    ├── roles.ts               # Role helpers
    ├── types.ts               # TypeScript types
    └── constants.ts           # Application constants

🔐 User Roles

The template includes three role levels:

• Admin - Full access to all features, can manage users and projects
• Manager - Can create and manage projects, moderate content
• Member - Can view projects and participate in discussions

See docs/SETUP.md for details on setting up roles.

🎯 Key Features

Projects

• Public project showcase with filtering and search
• Project detail pages with updates
• Admin/Manager can create, edit, and delete projects
• Support for research papers, software, experiments, datasets

Community

• Discussion board with posts and nested comments
• Voting system (upvote/downvote)
• Category-based organization
• Link discussions to projects

Dashboard

• Role-based dashboard widgets
• Project management interface
• User role management (Admin only)
• Statistics and analytics

🚀 Deployment

Deploy to Vercel

1. Push your code to GitHub
2. Import your repository in Vercel
3. Add environment variables in Vercel dashboard
4. Deploy!

See docs/DEPLOYMENT.md for detailed instructions.

🔧 Development

Available Scripts

npm run dev      # Start development server
npm run build    # Build for production
npm run start    # Start production server
npm run lint     # Run ESLint

Type Safety

The project includes comprehensive TypeScript types in src/utils/types.ts. Import and use them throughout your codebase:

import { Project, DiscussionPost, UserRole } from '@/utils/types'

Constants

Application constants are centralized in src/utils/constants.ts:

import { ROLES, PROJECT_STATUS, ROUTES } from '@/utils/constants'

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

📝 License

This project is open source and available under the MIT License.

🆘 Support

If you encounter any issues:

1. Check the Setup Guide for common problems
2. Review the API Documentation for endpoint details
3. Open an issue on GitHub

🙏 Acknowledgments

• Next.js - The React Framework
• Supabase - Open source Firebase alternative
• shadcn/ui - Beautiful component library
• Aceternity UI - Modern UI components

---

Built with ❤️ for research organizations