Pinmaps

• 

  Our figma plan

Project Story: VibeCheck 🌿 The Inspiration The digital world is crowded with "perfection," but often lacks "vibe." I was inspired by the simple frustration of searching for a local spot—a cafe, a speakeasy, or a gallery—and being met with generic star ratings rather than a visual, curated feeling. I wanted to build a platform where discovery is prioritized; a place where you can find your next favorite spot through the lens of others, while keeping the experience fresh by focusing only on what the community has to offer.

🛠 How I Built It VibeCheck is built on a modern, reactive stack designed for speed and a sleek, "zine-like" aesthetic:

Frontend: Next.js with Tailwind CSS for a high-fashion, minimalist UI.

Icons: Lucide-React for clean, sharp interface elements.

Backend & Auth: Supabase (PostgreSQL) handles the real-time data and secure user sessions.

The core of the app is a customized discovery logic. I wanted the "Explore" page to feel like a true discovery engine, so I built a filtering system that ensures you only see high-quality posts from other users, keeping your own content tucked away in your personal profile.

🧠 What I Learned This project was a masterclass in User-Centric Logic. I learned how to handle complex authentication states where the UI must react instantly to whether a user is logged in or browsing anonymously.

I also dove deep into State Management. Learning how to fetch global data and then slice it up to show different views (like "Discovery" vs. "My Posts") taught me a lot about how to keep a web app feeling fast and responsive without over-complicating the database.

Challenges I Faced The biggest hurdle was the "Ghost Feed" issue. Initially, the app struggled to decide what to show when a user wasn't logged in or when older posts didn't have "owners." I overcame this by implementing a Strict Verification Filter:

TypeScript

// Only show posts that are verified and don't belong to the current viewer postData = postData.filter(post => post.user_id !== null && post.user_id !== currentUserId ); Ensuring that the feed stayed populated while still filtering out the user's own content required a few rounds of testing to get the logic perfectly smooth.

🚀 The Future VibeCheck is just the beginning. I’m looking forward to adding Map Integration so you can see exactly where these spots are located in the real world, and a Save feature so users can build a "bucket list" of the vibes they find.

Built With

• backend-as-a-service
• google-maps
• next.js
• postgresql
• supabase
• tailwind
• vercel