[FEATURE] Enterprise Events Platform – Public Event Discovery, Registration & Management

[abhishek-nexgen-dev]

Create a scalable Event Listing Page similar to:

• Devfolio
• Unstop
• Hack2Skill
• Devpost

The page should allow users to discover events efficiently through advanced filtering, searching, sorting, recommendations, and personalized feeds.

This module will be the primary traffic source of the platform.

---

Business Goals

User Goals

• Find relevant events quickly
• Discover hackathons matching skills
• Filter events by interests
• Track registration deadlines
• Save events for later
• Share events

Business Goals

• Increase registrations
• Improve engagement
• Increase retention
• Promote sponsored events
• Generate analytics data

---

Supported Event Types

Hackathon
Workshop
Webinar
Bootcamp
Conference
Meetup
Hiring Challenge
Coding Contest
Design Challenge
Open Source Program
Internship Drive
Scholarship Program
Fellowship Program

---

Page Layout

---------------------------------------------------
Navbar
---------------------------------------------------
Announcement Banner
---------------------------------------------------
Search Bar
---------------------------------------------------
Quick Filters
---------------------------------------------------
Category Tabs
---------------------------------------------------
Featured Events Carousel
---------------------------------------------------
Event Listing Grid
---------------------------------------------------
Pagination
---------------------------------------------------
Footer
---------------------------------------------------

---

Search System

Global Search

Users should search by:

• Event Name
• Organizer Name
• Technologies
• Tags
• Location
• Skills

Example:

React Hackathon
AI Competition
Google Developer Event
Web3 Challenge

---

Search Features

Instant Search

• Debounced Search
• Search Suggestions
• Recent Searches

Search History

Store:

{
  userId: string;
  query: string;
  searchedAt: Date;
}

---

Filter System

Event Type Filter

Hackathon
Workshop
Webinar
Conference
Meetup
Contest

---

Mode Filter

Online
Offline
Hybrid

---

Price Filter

Free
Paid

---

Difficulty Filter

Beginner
Intermediate
Advanced

---

Team Size Filter

Solo
2-4 Members
5-10 Members

---

Prize Pool Filter

0-10k
10k-50k
50k-100k
100k+

---

Date Filter

Today
This Week
This Month
Upcoming

---

Technology Filter

React
Node.js
AI
Machine Learning
Blockchain
Web3
Cloud
DevOps
Cyber Security

---

Location Filter

India
USA
Europe
Asia
Remote

---

Sorting

Users can sort by:

Newest
Most Popular
Registration Deadline
Highest Prize Pool
Trending
Most Registered

---

Event Card Design

Every Event Card should contain:

Banner Image
Event Name
Organizer Logo
Organizer Name
Event Type
Mode
Location
Prize Pool
Registration Deadline
Participants Count
Tags
Bookmark Button
Share Button
Register Button

---

Event Card States

Registration Open

Status: Open
Green Badge

Registration Closing Soon

Status: Closing Soon
Orange Badge

Registration Closed

Status: Closed
Red Badge

Live

Status: Live
Blue Badge

---

Featured Events Section

Top section carousel.

Selection Criteria:

Sponsored Events
Trending Events
Popular Events
Editor's Choice

---

Recommended Events

For Logged-In Users

Recommendation based on:

Skills
Past Registrations
Interests
Bookmarks
Search History

AI Recommendation Score:

{
  eventId: string;
  userId: string;
  score: number;
}

---

Bookmark System

Users can:

• Save Event
• Remove Event
• View Saved Events

Schema:

{
  userId: string;
  eventId: string;
  createdAt: Date;
}

---

Share System

Supported:

LinkedIn
Twitter/X
WhatsApp
Telegram
Copy Link

Tracking:

Share Count
Share Source

---

Event Analytics

Track:

Impressions
Views
Clicks
Registrations
Bookmarks
Shares
CTR

---

Database Schema

Event

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

  type: string;
  mode: string;

  prizePool: number;

  location: string;

  registrationStart: Date;
  registrationEnd: Date;

  eventStart: Date;
  eventEnd: Date;

  organizerId: string;

  participantsCount: number;

  tags: string[];

  isFeatured: boolean;

  createdAt: Date;
  updatedAt: Date;
}

---

Organizer

{
  id: string;
  name: string;
  logo: string;
  verified: boolean;
}

---

API Endpoints

Get Events

GET /api/events

Query Params:

?page=1
&limit=20
&search=react
&type=hackathon
&mode=online
&sort=popular

---

Event Details

GET /api/events/:id

---

Bookmark Event

POST /api/events/:id/bookmark

---

Remove Bookmark

DELETE /api/events/:id/bookmark

---

Frontend Components

EventCard
EventGrid
EventFilterSidebar
SearchBar
CategoryTabs
FeaturedCarousel
Pagination
BookmarkButton
ShareButton
EmptyState
LoadingState

---

Performance Requirements

Core Web Vitals

LCP < 2.5s
CLS < 0.1
FID < 100ms

---

Optimization

• Infinite Scroll
• Image Lazy Loading
• CDN
• Query Caching
• Server Side Rendering
• Edge Caching

---

Security

Search Protection

• Rate Limiting
• Input Validation
• SQL Injection Protection

APIs

• JWT Validation
• RBAC
• Audit Logs

---

Mobile Responsiveness

Breakpoints

Mobile
Tablet
Laptop
Desktop
Ultra Wide

Must support:

• Touch Gestures
• Mobile Filters Drawer
• Sticky Search

---

Acceptance Criteria

• Users can discover events easily
• Search returns results under 300ms
• Filters work together
• Event cards load correctly
• Mobile responsive
• Analytics tracking implemented
• Bookmarking works
• Sharing works
• Featured events work
• Pagination/Infinite Scroll works
• SEO optimized

---

Tech Stack

Frontend

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

Backend

• NestJS
• PostgreSQL
• Prisma
• Redis

Search

• Elasticsearch / Meilisearch

Analytics

• PostHog
• Google Analytics