DEV Community: Nuh

Building Roastr: A Vibe Coded Community Platform for Coffee Lovers

Nuh — Wed, 29 Jul 2026 23:59:53 +0000

Over the past two days, I sat down and decided to start working on a new app using v0, an app that I call Roastr, which was designed for coffee lovers despite me personally being someone who doesn’t drink coffee. Building the app was easy, and I thought it was pretty much perfect from the outside, until I ran it through a free security tester, which exposed 27 major vulnerabilities.

This project was a part of my summer internship program at Perfai Security, a platform which does security testing for vibe coded applications. The vision behind building Roastr was for it to serve as an interactive, lighthearted, game-like platform for coffee people. Think of Pokemon Go, but for coffee lovers.

The goal of this app was simple: provide an engaging game-like platform for the public while promoting local businesses. On Roastr, users can browse an interactive map (currently of just the San Francisco Bay Area), highlighting local coffee shops. Additionally, for each coffee shop Roastr highlights their drinks which can be collected by users for points. The points that they collect are then shown on a personal dashboard which has badges, the total amount of drinks they’ve collected, a drink rarity index and more.

Tech Stack

Framework & Language

Next.js 16 (App Router, Server Components, Server Actions, Route Handlers)
TypeScript
React 19 Styling & UI
Tailwind CSS v4
shadcn/ui (built on base-ui and Radix primitives)
Lucide icons
Custom coffee-themed design system with rarity color tokens Backend & Database
Supabase (PostgreSQL)
Row Level Security (RLS) for role-based authorization
PostgreSQL RPC functions & triggers (atomic XP awards, drink collecting, badge logic, rating recalculation) Authentication
Supabase Auth
Email/password sign-in with email confirmation
Google OAuth
Five roles: Guest, User, Coffee Shop Owner, Moderator, Admin Storage
Supabase Storage (image/photo uploads for collected drinks) Maps
React Leaflet
OpenStreetMap tiles
Results
From a security perspective there were lots of fundamental issues that would not have been immediately apparent. Running it through Perfai Security’s platform exposed 27 critical issues, all which I would not have been able to pick up on without the help of their platform. This taught me something. Vibe-coded applications can seem perfect from the outside, with good functionality, engaging UI, a modern feel and more, but behind the scenes these apps are still lacking on the security front, which can lead to major issues down the line once these apps are fully deployed and in use.

Some Challenges I Faced
Amongst the main challenges that I faced was the lack of credits for v0. Because of this I had to compromise on certain features which I would have wanted to add, but ended up leaving out since they might have been excessive, and instead focusing on the fundamentals.

Try my app below:
roastr-seven.vercel.app

[Boost]

Nuh — Wed, 29 Jul 2026 22:03:55 +0000

Post not found or has been removed.

Building RevMatch: A Community Platform for Car Enthusiasts

Nuh — Tue, 28 Jul 2026 20:35:28 +0000

Over the past few days, I decided to work on a passion project. An app for something that I am personally passionate about. After brainstorming, I landed on the main idea; I built RevMatch, a web application designed to bring car enthusiasts together through car meets, clubs, and community events. The goal of the platform is to provide a single place where users can discover local meets, organize events, showcase their vehicles, and connect with others who share the same passion for cars. As with my previous projects, I wanted to explore how effectively AI-assisted development tools could generate a feature-rich full-stack application while also creating a realistic environment for future security testing.
Unlike traditional event platforms, RevMatch is designed specifically for the automotive community. On RevMatch, users can browse an interactive map of upcoming car meets, RSVP to events, upload photos, join clubs, and interact with other members through comments and messaging. Event pages include useful information such as location, organizer, date and time, attendee lists, weather conditions, and photo galleries from previous events. The platform also supports role-based access control with different permissions for members, event organizers, moderators, and administrators, allowing different users to manage events and community content appropriately.

From a technical perspective, the application is built using Next.js, TypeScript, Tailwind CSS, Prisma, PostgreSQL, Auth.js, and Mapbox. It includes secure authentication with email/password and Google sign-in, role-based authorization, CRUD functionality, search and filtering, file uploads, REST API endpoints, and responsive dashboards tailored to different user roles. These features not only create a realistic startup-style application but also provide a wide range of functionality that can later be evaluated from both a usability and security perspective.
Now despite the first version of this app going pretty well, there are still plans that I have for this app's future. One feature that I plan to add in the future is Live Drive Mode. The idea is to allow event organizers to create scenic driving routes that participants can join after a car meet. During an active drive, users who opt in would appear on a live map, allowing everyone in the convoy to see each other's locations in real time. The feature would also include an integrated group voice call so participants could communicate hands-free while driving, similar to a walkie-talkie. Although this functionality is not yet implemented, it represents the long-term vision for expanding RevMatch beyond event discovery into a more interactive community platform.

Developing RevMatch has been another valuable opportunity for me to experiment with AI-assisted software development. Starting from a detailed prompt, I was able to generate a strong foundation for a modern web application that includes many of the features expected from a production-ready platform. While refinement and testing are still necessary, AI significantly reduced the amount of time required to build the initial structure, allowing me to focus more on the product itself rather than repetitive boilerplate code.

Finally, the folks over at PerfAI Security helped me with the security testing of this vibe-coded app and helped me make sure all ends of the application are secure, saving lots of time, effort and money, rather than learning about issues the hard way.

As I continue this project, my focus will shift toward strengthening the application and preparing it for security testing. With features such as authentication, role-based permissions, user-owned content, file uploads, and administrative functionality, RevMatch provides an excellent environment for evaluating common security concerns in AI-generated applications. Overall, this project continues to demonstrate both the strengths and the current limitations of AI-assisted development, while also serving as another step in understanding how these tools can be used to build increasingly complex software applications.

Take a look below!:

https://revmatch-one.vercel.app/