[10]Mobile, Productivity

GrindUp

2025 – 2026

DEMO

WHAT IT DOES

GrindUp is a cross-platform mobile app for building and tracking daily routines. Users create routines with categories and priorities, check them off each day, and visualize consistency through a GitHub-style contribution graph. The app tracks streaks, shows weekly and monthly completion analytics, and sends push notification reminders to keep habits on track.

WHY I BUILT IT

I wanted a habit tracker that felt minimal and motivating — something that shows progress visually without overwhelming the user with features. Most apps I tried were either too bloated or lacked the contribution-graph style view that makes GitHub streaks so satisfying. I also wanted to go deeper with React Native and Firebase in production, and practice Clean Architecture patterns in a mobile context.

TECH STACK

FRONTEND

React Native 0.78TypeScriptReact NavigationReanimatedReact Native Paperreact-native-svg

BACKEND

Firebase AuthCloud FirestoreCloud Messaging (FCM)Firebase Storage

DX & TOOLING

JestESLintPrettieri18nextCocoaPods

ARCHITECTURE

Layered architecture — Platform → React Native (Atomic Design + Domain layer) → Firebase BaaS

KEY CHALLENGES

Atomic Design at Scale

Organized 100+ components into atoms, molecules, and organisms. Enforced strict import boundaries so that atoms never import molecules, keeping the component tree predictable and reusable across screens.

GitHub-style Contribution Graph

Built a custom heatmap calendar from scratch using react-native-svg and Reanimated. Each cell maps to a day's completion ratio, with smooth color interpolation and tap-to-inspect interactions.

Firestore Real-time Sync

Designed Firestore document structure for per-user routines and daily logs. Implemented onSnapshot listeners for real-time updates while handling offline persistence and conflict resolution gracefully.

Cross-platform Push Notifications

Integrated Firebase Cloud Messaging for both iOS (APNs) and Android. Handled permission flows, token refresh, background message handling, and scheduled daily reminders per routine.

Clean Architecture Separation

Isolated domain logic (models, repositories, use cases) from UI and infrastructure. This made it straightforward to swap data sources or test business logic independently of React Native.

HOW TO RUN

git clone https://github.com/moolair/grindup.git
cd grindup
npm install
npx pod-install        # iOS only
npx react-native run-ios
npx react-native run-android

Requires Node 18+, Xcode 15+ (iOS), and Android Studio (Android). Firebase config files are not included — set up your own Firebase project.

FUTURE IMPROVEMENTS

Widget support for iOS and Android home screen quick-check
Social features — share streaks and challenge friends
Apple Watch companion app for wrist-level check-ins
AI-powered routine suggestions based on completion patterns
App Store and Google Play release

→ GITHUB