Kembali ke Karya

Sirkel Main

Sirkel Main was built to be the digital home for these circles, providing a premium, centralized space to track every match and ranking.

Kategori:androidweb
Tech:FlutterMongoDBNode.js
Cover for Sirkel Main

Premise

In almost every friend group, there’s a sport or game that becomes a weekly ritual. Whether it’s badminton on Wednesdays or a weekend football match, these games are the core of the group’s social life. Sirkel Main was built to be the digital home for these circles, providing a premium, centralized space to track every match and ranking.

The ‘Why’

The idea came from a recurring frustration: "Data Amnesia." After a great game, scores are usually shared in a WhatsApp or Telegram group, only to be buried under hundreds of messages an hour later. There was no sense of progression, no history to look back on, and no clear way to settle the debate of who was actually the top player in the group. I wanted to build something that turned these casual sessions into a structured, competitive experience without making it feel like "work."

What It Does

I designed the app to handle the entire lifecycle of a casual sports circle:

  • Unified Tracking: One app for everything. Thanks to a flexible architecture, it supports Badminton, Tennis, Football, and more, all in one place.

  • Live Leaderboards: Rankings update in real-time. The moment a score is submitted, the circle's leaderboard reflects the new standings.

  • Built for Sharing: It’s not just about the data; it’s about the bragging rights. The app generates custom achievement cards that users can instantly share to social media.

  • Frictionless Experience: With Google Sign-In and full localization (English & Indonesian), the onboarding is fast and feels native to users regardless of their background.

Tech Behind the App

The goal was to build a "lean" but powerful stack that could handle real-time updates while remaining easy to maintain:

  • Flutter & Riverpod: I chose Flutter for its ability to deliver a highly polished, 60fps UI across both iOS and Android. I used Riverpod for state management because its functional approach makes handling complex, reactive data (like live rankings) incredibly clean.

  • Node.js & MongoDB: The backend is powered by Node.js for performance, with MongoDB serving as the data store. The NoSQL nature of MongoDB was crucial here, allowing the app to store varying data structures for different sports without rigid schema constraints.

  • Vercel Serverless: To keep the infrastructure efficient, I deployed the backend as serverless functions on Vercel. This setup ensures the API scales automatically and stays cost-effective.

  • RESTful API: Communication between the app and server is handled via a standardized REST API, ensuring a predictable and secure flow of data.

What's Next?

We aims to implement more features and provide supports for various games and sports. The next steps also include the plan to build premium paid features for serious users who took matches seriously!

My Role

I act as the... superman? Basically I did everything. I did.