Event Details & Registration System (Production Ready)

This is the most important page of the platform.

Every conversion happens here:

Visitor
 ↓
Views Event
 ↓
Reads Details
 ↓
Creates Team
 ↓
Registers
 ↓
Submits Project
 ↓
Gets Evaluated
 ↓
Wins / Gets Hired

Inspired by:

• [Devfolio](https://devfolio.co?utm_source=chatgpt.com)
• [Devpost](https://devpost.com?utm_source=chatgpt.com)
• [Hack2Skill](https://hack2skill.com?utm_source=chatgpt.com)
• [Unstop](https://unstop.com?utm_source=chatgpt.com)

---

Business Goals

User Goals

• Understand event quickly
• Register easily
• Create team
• Submit project
• Track progress

Platform Goals

• Maximize registrations
• Improve conversion rate
• Increase participation
• Improve retention

---

URL Structure

/events/:slug

Examples:

/events/ai-hackathon-2026
/events/web3-builder-challenge
/events/google-cloud-bootcamp

SEO Friendly:

Title
Meta Description
OpenGraph
Twitter Cards
Structured Data

---

Page Layout

------------------------------------------------
Hero Section
------------------------------------------------
Quick Stats
------------------------------------------------
Register CTA
------------------------------------------------
About Event
------------------------------------------------
Tracks & Themes
------------------------------------------------
Prizes
------------------------------------------------
Timeline
------------------------------------------------
Sponsors
------------------------------------------------
Judges
------------------------------------------------
Mentors
------------------------------------------------
Rules
------------------------------------------------
Resources
------------------------------------------------
FAQs
------------------------------------------------
Discussion Board
------------------------------------------------
Participants
------------------------------------------------
Footer
------------------------------------------------

---

Hero Section

Display:

Event Banner
Event Logo
Event Name
Organizer
Mode
Location
Registration Deadline
Event Dates
Prize Pool
Participants Count

Actions:

Register
Bookmark
Share
Join Discord
Visit Website

---

Event Status Engine

Draft

Not Public

---

Upcoming

Registration Open

---

Registration Closing Soon

Less than 48 Hours

---

Live

Event Started

---

Submission Open

Project Submission Active

---

Judging

Evaluation Running

---

Completed

Event Finished

---

Quick Stats Section

Display:

Prize Pool
Participants
Teams
Tracks
Mentors
Judges

Example:

₹5,00,000 Prize Pool
2500 Participants
600 Teams

---

Registration CTA

Sticky section.

Display:

Registration Status
Seats Remaining
Deadline Countdown

Buttons:

Register Now
Create Team
Join Team

---

About Event Section

Supports:

Rich Text
Markdown
Images
Videos
Embeds

Content:

Problem Statement
Event Objective
Organizer Message
Expected Outcomes

---

Tracks & Themes

Example:

AI & ML
Web3
FinTech
HealthTech
EdTech
Open Innovation

Each Track:

{
  title: string;
  description: string;
  icon: string;
}

---

Prize Section

Display:

Winner
Runner Up
Second Runner Up
Track Winners
Special Awards

Example:

Winner - ₹100,000
Runner Up - ₹50,000
Best AI Project - ₹25,000

---

Timeline Section

Critical feature.

Display:

Registration Opens
Registration Closes
Team Formation Ends
Hackathon Starts
Submission Opens
Submission Closes
Judging
Winner Announcement

Schema:

{
  title: string;
  date: Date;
  description: string;
}

---

Team Formation System

Create Team

Fields:

Team Name
Team Description
Invite Members

Rules:

Minimum Team Size
Maximum Team Size

Example:

Min 1
Max 4

---

Join Team

Methods:

Invite Link
Join Request
Team Code

---

Team Dashboard

Display:

Team Members
Pending Requests
Project Status
Submission Status

---

Participant Registration

Registration Form Builder

Admin Configurable Fields:

Name
Email
Phone
College
Company
Experience
Resume
GitHub
LinkedIn
Custom Questions

---

Custom Questions

Types:

Text
Textarea
Dropdown
Radio
Checkbox
File Upload

Example:

Why do you want to join?

---

Participant Dashboard

After Registration:

Display:

Registration Status
Team Status
Project Status
Certificates
Announcements

---

Judges Section

Display:

Photo
Name
Role
Company
Bio
LinkedIn

Schema:

{
  id: string;
  name: string;
  role: string;
  company: string;
  image: string;
}

---

Mentors Section

Display:

Photo
Name
Specialization
Availability

---

Sponsors Section

Sponsor Tiers:

Title Sponsor
Gold Sponsor
Silver Sponsor
Community Partner
Hiring Partner

Display:

Logo
Website
Description

---

Resources Section

Provide:

Rulebook PDF
Problem Statements
Starter Kits
Documentation
API Keys
Workshop Recordings

---

FAQ Section

Example:

Who can participate?
Is there a registration fee?
Can I participate solo?
What is the team size?

---

Discussion Board

Features:

Create Post
Reply
Mention Users
Pin Post
Moderation

Types:

Question
Announcement
Discussion
Bug Report

---

Announcements System

Organizers can publish:

Schedule Changes
Important Updates
Deadline Extensions

Notification Channels:

Email
Push
In-App

---

Participants Section

Public Display:

Total Participants
Teams Count
Colleges Represented
Countries Represented

Optional:

Public Participant List

---

Bookmark System

Users Can:

Save Event
View Later
Receive Updates

---

Share System

Support:

LinkedIn
X
WhatsApp
Telegram
Copy Link

Track:

Share Count
Traffic Source

---

Event Analytics

Track:

Views
Unique Visitors
Registrations
Conversion Rate
Bookmarks
Shares
Team Creation

---

Database Schema

Event

{
  id: string;
  title: string;
  slug: string;
  description: string;
  bannerUrl: string;

  registrationStart: Date;
  registrationEnd: Date;

  eventStart: Date;
  eventEnd: Date;

  prizePool: number;

  status: string;

  organizerId: string;
}

---

Registration

{
  id: string;
  userId: string;
  eventId: string;

  status: string;

  registeredAt: Date;
}

---

Team

{
  id: string;

  eventId: string;

  name: string;

  leaderId: string;

  maxMembers: number;
}

---

Team Member

{
  teamId: string;
  userId: string;
}

---

Timeline

{
  eventId: string;
  title: string;
  date: Date;
}

---

API Endpoints

Get Event

GET /api/events/:slug

---

Register Event

POST /api/events/:id/register

---

Create Team

POST /api/events/:id/team

---

Join Team

POST /api/team/:id/join

---

Bookmark Event

POST /api/events/:id/bookmark

---

Submit Discussion

POST /api/events/:id/discussion

---

Frontend Components

EventHero
EventStats
EventTimeline
PrizeSection
TrackSection
RegistrationCTA
TeamCreator
JudgesSection
MentorsSection
SponsorsSection
FAQAccordion
DiscussionBoard
AnnouncementFeed

---

Security

Protect:

Spam Registrations
Bot Accounts
Fake Teams
Abusive Discussions

Implement:

Rate Limiting
RBAC
CAPTCHA
Audit Logs

---

Performance Requirements

Page Load < 2 Seconds
API < 200ms
Discussion Realtime < 500ms

---

Mobile Requirements

Must Support:

Sticky Register Button
Mobile Timeline
Touch Friendly Forms
Responsive Team Management

---

Tech Stack

Frontend

• Next.js 15
• TypeScript
• Tailwind CSS
• ShadCN UI
• TanStack Query

Backend

• NestJS
• PostgreSQL
• Prisma
• Redis

Realtime

• Socket.IO

Storage

• [AWS S3](https://aws.amazon.com/s3/?utm_source=chatgpt.com)

Analytics

• [PostHog](https://posthog.com?utm_source=chatgpt.com)

---

Acceptance Criteria

✅ Event details render correctly
✅ Registration works
✅ Team creation works
✅ Team joining works
✅ Timeline works
✅ Judges section works
✅ Mentors section works
✅ Sponsors section works
✅ FAQ works
✅ Resources work
✅ Discussion board works
✅ Announcements work
✅ Analytics tracked
✅ Mobile responsive
✅ SEO optimized
✅ Production ready

No implementation files or tests are named. Start by locating the EventHero, EventStats, EventTimeline, RegistrationCTA, TeamCreator, DiscussionBoard, and AnnouncementFeed entry points, then trace the listed event and team API endpoints. Done would require all listed acceptance criteria, including registration, teams, content sections, analytics, SEO, security, performance, and mobile behavior.