Back to projects
Jan 26, 2026
HackRadar
Hero snapshot from the final experience

HackRadar

Discover how HackRadar revolutionizes hackathon discovery by aggregating events from 7+ major platforms into a unified interface, featuring real-time updates, advanced filtering, and seamless tracking through modern web technologies and brutalist design aesthetics.

Next.js

TypeScript

Tailwind CSS

Convex

View live project
Case study · 6 min read

Overview

In an era where hackathons are scattered across multiple platforms, HackRadar emerges as the ultimate solution for developers seeking opportunities to innovate and compete. It's a comprehensive hackathon discovery platform that aggregates events from 7+ major platforms into a single, unified interface with real-time updates and intelligent tracking capabilities.

The concept was clear - if developers are constantly switching between multiple platforms (Devfolio, Devpost, MLH, DoraHacks, and more) to find hackathons, why not create a centralized hub that brings all opportunities together with advanced filtering, bookmarking, and real-time notifications?

Key Features

  • Multi-Platform Aggregation: Browse hackathons from 7+ platforms including Devfolio, Devpost, DoraHacks, MLH, Unstop, Hack2Skill, and Kaggle — all in one place. The platform normalizes data from different sources for consistent viewing and comparison.

  • Real-Time Updates: Information is fetched from official sources and kept automatically updated, ensuring you never miss registration deadlines. The system monitors platforms continuously to provide the latest hackathon details.

  • Save & Track System: Bookmark interesting hackathons and access them anytime from your personalized dashboard. Keep track of deadlines, prizes, and important dates without switching between platforms.

  • Advanced Filtering: Search and filter hackathons by platform, date range, prize pool, theme, difficulty level, and more. Find events that perfectly match your interests and skills with intelligent search algorithms.

  • Brutalist Design Aesthetic: Clean, functional interface with bold brutalist design principles that prioritize usability and information clarity. The design cuts through noise to deliver exactly what developers need.

  • Responsive Experience: Fully responsive design ensures seamless hackathon discovery across desktop, tablet, and mobile devices, allowing developers to explore opportunities anywhere, anytime.

Technologies Used

  • Next.js 14 & TypeScript: Leveraging the latest App Router features, server components, and type-safe development for robust application architecture with optimized performance and developer experience.

  • Custom Web Scrapers: Sophisticated scraping systems that extract hackathon data from multiple platforms while respecting rate limits, handling API changes, and ensuring data accuracy and freshness.

  • API Integration: Seamless integration with multiple hackathon platform APIs, implementing efficient data fetching strategies, caching mechanisms, and error handling for reliable service delivery.

  • Tailwind CSS: Modern utility-first CSS framework enabling rapid UI development with consistent design patterns, responsive layouts, and maintainable styling across components.

  • Real-Time Data Processing: Scheduled data fetching systems with intelligent caching strategies that balance freshness with performance, ensuring users always see up-to-date information.

  • Vercel Deployment: Cloud-native hosting on Vercel's edge network providing global CDN distribution, automatic scaling, and zero-downtime deployments for optimal user experience worldwide.

Challenges and Learnings

The primary challenge was normalizing data from 7+ different platforms, each with unique API structures, data formats, and update frequencies. The solution involved creating a flexible data schema that accommodates varying information types while maintaining consistency across the platform.

Another significant hurdle was implementing efficient web scraping without overwhelming source platforms or getting blocked. Developing intelligent rate limiting, respectful scraping intervals, and robust error handling ensures reliable data collection while maintaining good platform citizenship.

Performance optimization was crucial when dealing with thousands of hackathons across multiple platforms. Implementing smart caching strategies, database indexing, and lazy loading techniques ensures lightning-fast search and filter operations even with large datasets.

Technical Innovations

  • Unified Data Schema: Custom data normalization layer that transforms disparate API formats from 7+ platforms into a consistent, queryable structure enabling seamless cross-platform comparison.

  • Intelligent Scraping System: Adaptive web scraping with rotating user agents, proxy support, and automatic retry mechanisms that maintain data freshness while respecting platform rate limits.

  • Smart Caching Strategy: Multi-layer caching architecture combining client-side, CDN, and database caching to minimize API calls while ensuring users see fresh data within acceptable time windows.

  • Advanced Search Algorithm: Full-text search with fuzzy matching, relevance scoring, and intelligent filtering that helps developers discover hackathons matching their specific criteria quickly.

  • Bookmark Synchronization: Book marking system that persists user selections across sessions with local storage and server-side synchronization for seamless access to saved hackathons.

Architecture Highlights

  • Server-Side Rendering: Next.js App Router with server components provides optimized initial page loads, SEO benefits, and efficient data fetching patterns for improved performance.

  • Database Design: Optimized schema with proper indexing for fast queries across thousands of hackathons, supporting complex filtering and search operations with sub-second response times.

  • API Route Handlers: Efficient Next.js API routes managing data aggregation, user bookmarks, and real-time updates with proper error handling and response caching.

  • Responsive Grid Layouts: Adaptive card-based layouts using CSS Grid and Flexbox that gracefully adjust to different screen sizes while maintaining information hierarchy and readability.

User Experience Features

  • Intuitive Dashboard: Clean, distraction-free interface presenting hackathon information in scannable cards with key details prominently displayed for quick decision-making.

  • Quick Filters: One-click filtering by platform, date, and prize range allows rapid narrowing of search results to find relevant opportunities in seconds.

  • External Navigation: Direct links to official hackathon pages on source platforms ensure users can quickly register and access detailed information without confusion.

  • Persistent Bookmarks: User bookmarks persist across sessions with local storage backup, ensuring saved hackathons remain accessible even during platform updates.

Impact and Outcomes

HackRadar demonstrates how modern web scraping and API integration can solve real developer pain points by consolidating fragmented information into a unified, accessible platform. What started as a simple aggregation tool evolved into a comprehensive hackathon discovery ecosystem.

The platform showcases measurable improvements in hackathon discovery:

  • 7+ platforms aggregated into one unified interface
  • Real-time updates ensuring current information across all sources
  • Zero cost for users completely free hackathon discovery platform
  • Advanced filtering saving hours of manual platform browsing
  • Brutalist design providing distraction-free, information-first experience

The integration of multi-platform scraping with Next.js 14's performance improvements and TypeScript's type safety results in a platform that responds instantly to searches, provides accurate data, and connects developers with opportunities that match their interests and skills.

Developer Community Impact

HackRadar addresses critical gaps in hackathon discovery by providing:

  • Centralized Access: Single source of truth for hackathons across major platforms
  • Time Savings: Eliminates hours spent checking multiple websites manually
  • Opportunity Discovery: Helps developers find events they might have otherwise missed
  • Career Growth: Connects developers with opportunities to build skills, network, and compete

Credits

Inspired by Anish Dabhane's Discord app for hackathon discovery, HackRadar extends the concept to a comprehensive web platform with enhanced features, multi-platform support, and modern design aesthetics that prioritize developer experience.

This project demonstrates expertise in web scraping, API integration, data normalization, real-time data processing, and modern React patterns — showcasing skills essential for building scalable aggregation platforms that solve real developer needs while maintaining performance, reliability, and exceptional user experience.