Building Roast Feast: A Solo Developer's Journey with Nuxt 3 and Supabase

Mateusz Szczudłowski

Mateusz Szczudłowski

2025-09-04T18:28:31Z

3 min read

The Idea That Became a Passion Project

As a developer looking to expand my skills with Vue.js and Supabase, I wanted to build something more substantial than the typical TODO app. I craved a project that would challenge me with real-world complexities — user authentication, real-time interactions, content moderation, and community features.

As someone who loves humor and sarcastic comments, the idea struck: why not create a specialized platform dedicated entirely to comedy roasts?

While general social platforms exist, there wasn't a purpose-built space that understood the unique dynamics of roast events — structured rounds, fair participation, creative scoring systems, community safety measures, and the ability to create private roasts for friends.

The Tech Stack

After evaluating various options, I settled on a modern, scalable architecture:

  • Frontend : Nuxt.js for reactive, server-side rendered pages
  • Backend : Supabase for real-time database, authentication, and edge functions
  • Styling : Vuetify 3 with custom SCSS for a polished, responsive design
  • Deployment : Vercel for seamless CI/CD and global edge distribution This stack provides the perfect balance of developer experience, performance, and scalability.

Key Technical Challenges

1. Real-time Interactions

Roast events need live updates as participants submit roasts and reactions. I implemented Supabase's real-time subscriptions to ensure instant updates across all connected users.

// Real-time subscription example
const { data, error } = await supabase
  .from('roasts')
  .select('*')
  .eq('event_id', eventId)
  .order('created_at', { ascending: false })

supabase
  .channel('roast-updates')
  .on('postgres_changes', 
    { event: 'INSERT', schema: 'public', table: 'roasts' },
    (payload) => {
      // Handle new roast in real-time
    }
  )
  .subscribe()
Enter fullscreen mode Exit fullscreen mode

2. Content Moderation

Balancing free expression with community safety required building sophisticated moderation tools, including flagging systems and moderator review workflows.

3. Gamification System

Creating an engaging badge and leaderboard system that encourages participation while maintaining fair competition was a complex algorithmic challenge.

4. Performance Optimization

With potentially hundreds of users viewing roast events simultaneously, I implemented materialized views, database indexing, and efficient caching strategies.

Feature Highlights

Roast Events

  • Create and manage comedy roast events
  • Real-time participant interaction
  • Voting and ranking systems
  • Event scheduling and notifications

Community Features

  • User profiles and achievements
  • Badge system for engagement
  • Leaderboards and competitions
  • Social interactions and following

Tipping System

  • Virtual coin economy
  • Creator monetization
  • Appreciation mechanisms
  • Transaction tracking

Technical Architecture

Diagram of platforms architecture

After evaluating various options, I settled on a modern, scalable architecture:

Frontend : Nuxt.js 3 for reactive, server-side rendered pages
Backend : Supabase for real-time database, authentication, and edge functions
Styling : Vuetify 3 with custom SCSS for a polished, responsive design
Deployment : Vercel for seamless CI/CD and global edge distribution
This stack provides the perfect balance of developer experience, performance, and scalability.

What Worked Well

Component-Driven Development : Building reusable Vue components accelerated development and ensured consistency across the platform.

Database-First Design : Starting with a well-structured database schema prevented major refactoring later in the project.

Lessons Learned

When I started building Roast Feast, I never anticipated how complex and expansive the project would become. What began as a simple learning exercise quickly evolved into a full-featured social platform.

The biggest challenge has been managing scope and complexity as a solo developer, working only evenings after my day job. Features that seemed straightforward on paper — like implementing a real-time notification system or building a comprehensive badge achievement system — turned out to require careful architectural planning and extensive testing.

Key Takeaways:

  • Break down complex features into smaller, manageable chunks
  • Maintain clean, well-documented code when you're the only developer
  • Good project organization is crucial for context switching
  • Write descriptive commit messages for future you

The Road Ahead

The next major milestone is implementing a payment system using Stripe to work with the existing tipping system:

  • Payment Processing : Stripe Connect integration for creator payouts
  • Coin Purchase System : Allow users to buy virtual coins
  • Creator Economy : Enable content creators to monetize their roasts

Building for the Community

One aspect I'm still figuring out is how to foster genuine community engagement. It's a complex challenge that goes beyond just technical implementation — it's about understanding human psychology, balancing participation with preventing toxicity, and designing features that promote positive interactions.

Roast Feast has taught me that the best learning projects aren't just about the code — they're about understanding user needs and building solutions that people actually want to use.

Want to experience Roast Feast yourself?

Visit our coming-soon page to join the early access list and be among the first to start roasting!

What's your experience building full-stack applications as a solo developer? Share your challenges and wins in the comments!