Blau Tech - Project Summary

Inspiration

As students and young professionals in Bavaria, we constantly struggled with discovering tech opportunities. Information about hackathons, events, and scholarships was scattered across countless websites, social media platforms, and newsletters. By the time we found relevant opportunities, deadlines had often passed, or we'd missed early-bird registrations.

We realized that the Bavarian tech community needed a centralized hub that could:

  • Aggregate opportunities from across the web automatically
  • Organize information in a way that's easy to browse and search
  • Deliver real-time updates so nothing gets missed
  • Present everything in a beautiful, modern interface

Blau Tech was born from the frustration of manual research and the vision of making opportunity discovery effortless for the next generation of Bavarian tech talent.

What it does

Blau Tech is a comprehensive platform that connects students, junior talent, and early-stage founders in Bavaria with tech events, hackathons, and scholarship opportunities.

For Students

  • Browse organized opportunities: Navigate through Events, Hackathons, and Scholarships in a clean, tabbed interface
  • Personalized feed: "For You" timeline showing upcoming opportunities tailored to your interests
  • Real-time updates: Live data synchronization ensures you always see the latest opportunities
  • Detailed information: Interactive cards with full details, dates, locations, and links

For Organizers & Community Managers

  • Automated data extraction: Submit a URL via webhook, and our AI-powered system automatically extracts, structures, and stores the information
  • Intelligent classification: The system automatically determines if a link is an event or hackathon
  • Duplicate prevention: Automatic duplicate detection across all content types
  • Instant notifications: Formatted messages automatically sent to Telegram channels

Key Features

  • AI-Powered Extraction: Transforms unstructured web pages into clean, structured data
  • Smart Summarization: LLM-powered description generation from raw web content
  • Real-time Database: Supabase-powered backend with live subscriptions
  • Beautiful UI: Modern, responsive design with animated backgrounds and smooth transitions
  • Telegram Integration: Automated notifications keep the community informed

How we built it

Frontend (React + Vite)

We built a modern, responsive web application using:

  • React 18 with Vite for fast development and optimized builds
  • React Router for client-side navigation
  • Tailwind CSS for styling with a custom design system
  • Framer Motion for smooth animations and transitions
  • Three.js / Vanta.js for stunning 3D backgrounds and visual effects
  • Supabase JS for real-time database subscriptions

The frontend features a tabbed navigation system for the students section, with distinct color themes for each content type (events, hackathons, scholarships) to improve visual differentiation and user experience.

Backend & Automation (n8n Workflows)

We created three powerful automation workflows:

  1. Hackathons Pipeline: Receives hackathon URLs via webhook → validates → scrapes with Firecrawl → generates AI summary → formats location/date → inserts into Supabase → sends Telegram notification

  2. Scholarships Pipeline: Similar flow but with additional normalization for study levels (Bachelor/Masters/PhD) and fields of study categorization

  3. Intelligent Link Router: Automatically classifies links as events or hackathons using AI, prevents duplicates across both tables, and routes content to the appropriate storage

Tech Stack Integration

  • Supabase: PostgreSQL database with real-time subscriptions
  • n8n: Workflow automation platform for orchestrating the entire pipeline
  • Firecrawl: Web scraping and content extraction from any URL
  • Anthropic Claude: LLM for content summarization and classification
  • Telegram Bot API: Notification delivery to community channels

Database Design

We designed two main tables:

  • Events Table: Stores regular events and scholarships with fields for dates, locations, organizers, and types
  • Hackathons Table: Dedicated table with additional fields for prizes, end dates, and signup deadlines

Challenges we ran into

  1. Data Extraction Complexity: Different websites have vastly different structures. We had to build robust extraction logic that could handle various HTML layouts and content formats. Firecrawl helped, but we still needed to normalize dates, locations, and other fields across different formats.

  2. Duplicate Detection: Preventing duplicate entries across events and hackathons required careful URL normalization and content similarity checking. We implemented multiple layers of duplicate detection to catch variations in URLs and content.

  3. Real-time Synchronization: Getting Supabase real-time subscriptions to work smoothly with React state management required careful handling of connection states and data updates.

  4. AI Classification Accuracy: Getting the LLM to correctly classify links as events vs. hackathons required prompt engineering and testing with various examples. We iterated on prompts to improve accuracy.

  5. Date/Time Normalization: Different websites format dates and times in countless ways. We built robust parsing logic to handle various formats and timezones.

  6. Workflow Orchestration: Coordinating multiple n8n workflows, handling errors gracefully, and ensuring data consistency across the pipeline was challenging. We had to implement proper error handling and retry logic.

  7. UI/UX Polish: Creating a beautiful, modern interface while maintaining performance required careful optimization of animations, background effects, and component rendering.

Accomplishments that we're proud of

  1. Complete Automation: We successfully built a system that transforms hours of manual data entry into seconds of automation. What used to take community managers hours now happens automatically.

  2. AI-Powered Intelligence: Our system doesn't just scrape data—it understands content, classifies it intelligently, and generates concise summaries. The AI classification feature that automatically routes links to the right database table is particularly innovative.

  3. Real-time Experience: The frontend provides a truly real-time experience with Supabase subscriptions, so users always see the latest opportunities without refreshing.

  4. Beautiful Design: We created a modern, polished UI that stands out. The animated backgrounds, smooth transitions, and thoughtful color theming create an engaging user experience.

  5. Scalable Architecture: The workflow-based architecture means we can easily add new content types or extraction methods without major refactoring.

  6. Community Impact: We built something that genuinely solves a real problem for the Bavarian tech community. The platform makes opportunity discovery accessible and effortless.

  7. Full-Stack Integration: Successfully integrating frontend, backend, automation workflows, AI services, and messaging platforms into a cohesive system was a significant technical achievement.

What we learned

Technical Learnings

  • n8n Workflow Design: Learned how to design robust automation workflows with proper error handling, data transformation, and multi-step processing
  • AI Integration: Gained experience with prompt engineering, LLM API integration, and using AI for content classification and summarization
  • Real-time Data: Deepened understanding of Supabase real-time subscriptions and how to handle connection states in React
  • Web Scraping: Learned about the challenges of extracting structured data from unstructured web content and the importance of normalization
  • Modern React Patterns: Applied best practices with React Router, Framer Motion, and modern state management

Process Learnings

  • Rapid Prototyping: Hackathon constraints forced us to prioritize features and build an MVP quickly, teaching us valuable lessons about scope management
  • API Integration: Working with multiple third-party services (Supabase, Firecrawl, Anthropic, Telegram) taught us about API design patterns and integration strategies
  • User-Centric Design: Building for a real community helped us focus on solving actual problems rather than theoretical ones
  • Automation First: We learned that investing time in automation upfront saves significant time later and enables scalability

Domain Learnings

  • Community Needs: Gained insights into what students and young professionals in Bavaria actually need when discovering opportunities
  • Content Categorization: Learned about the nuances of classifying different types of opportunities and the importance of clear taxonomies

What's next for Blau Tech

Short-term Enhancements

  • User Authentication: Add user accounts to enable personalized recommendations and saved opportunities
  • Calendar Integration: Implement Google Calendar integration and .ics export functionality so users can add events directly to their calendars
  • Advanced Filtering: Add date range filters, location filters, and category-based filtering
  • Search Functionality: Implement full-text search so users can quickly find specific opportunities
  • Bookmarking: Allow users to save opportunities and track application status

Medium-term Features

  • Email Reminders: Send email notifications for upcoming deadlines and events
  • Push Notifications: Browser push notifications for time-sensitive opportunities
  • Analytics Dashboard: Provide organizers with insights into event views, engagement, and reach
  • Multi-language Support: Expand beyond German/English to serve a broader international audience

Long-term Vision

  • Mobile App: Build a React Native mobile app for iOS and Android
  • Recommendation Engine: Use machine learning to provide personalized opportunity recommendations based on user interests and behavior
  • Community Features: Add user profiles, networking features, and the ability to connect with other participants
  • Expansion: Scale beyond Bavaria to serve tech communities across Germany and Europe
  • Partnership Integrations: Integrate with university systems, job boards, and other opportunity platforms
  • Gamification: Add achievements, badges, and leaderboards to encourage engagement

Technical Improvements

  • Performance Optimization: Further optimize database queries and frontend rendering
  • Error Monitoring: Implement comprehensive error tracking and monitoring
  • Testing: Add automated testing for workflows and frontend components
  • Documentation: Expand documentation for contributors and users

Built with ❤️ at Hackatum 2025 🎉

Built With

Share this project:

Updates