⏱️ Tito – Time Tracking for Shift Workers

Tito is a minimalist mobile app built with React Native and Expo for shift workers to log hours, calculate earnings, and track weekly goals.
The project demonstrates building a fully functional mobile app from start to finish, including authentication, backend integration, local caching, cloud sync, and deployment readiness.

📦 Technologies

• React Native
• Expo
• TypeScript
• Supabase
• AsyncStorage
• React Navigation
• Expo Application Services (EAS)
• Model Context Protocol (MCP)

✨ Features

Shift Logging & Tracking

• Quick logging of shifts with start/end times, hourly rate, and notes
• Automatic earnings calculation in real-time
• Weekly goal tracking and visualization

Authentication & Data Sync

• Google Sign-In for secure authentication
• Cloud sync via Supabase to access data across devices
• Local caching with AsyncStorage for offline support

User Experience & Design

• Clean, minimalist interface with warm beige palette and bright accents
• Export shift history and earnings reports
• Privacy-first: all data encrypted and never sold

👩🏽‍🍳 Development Process

• Designed a minimal interface prioritizing speed and usability
• Built a cross-platform app using React Native and Expo
• Integrated Supabase for authentication and real-time database
• Implemented local caching with AsyncStorage for offline access
• Configured environment variables and EAS for production builds
• Applied consistent design system: colors, typography, and spacing
• Used MCP to assist development and debugging
• Tested workflows end-to-end to ensure smooth user experience

📚 What I Learned

🧠 Full-Stack Mobile Development

• Implemented cloud authentication and database using Supabase
• Managed local and remote data sync with AsyncStorage and Supabase

🎨 UI & Design Systems

• Created consistent themes, spacing, and typography for a polished app
• Designed minimal interfaces that emphasize speed and usability

🔍 Environment & Deployment

• Learned to configure environment variables for production builds
• Prepared the app for deployment with Expo Application Services (EAS)

📈 Overall Growth

• Strengthened ability to build a full mobile app from start to deployment
• Gained practical experience integrating backend services, UI, and user workflows
• Improved skills in privacy-first development and cross-platform considerations

💭 Possible Improvements

• Add micro-interactions and animations for smoother UI
• Implement charts and visualizations for earnings trends
• Support multiple jobs with different rates
• Add dark mode for night shift users
• Notifications for logging reminders
• Quick-add recurring shifts

🚦 Running the Project

To run the project locally, follow these steps:

1. Clone the repository.
2. Install dependencies: npm install
3. Start the development server: npx expo start
4. Run on device or simulator: npx expo start --ios , npx expo start --android

🍿 Demo / Video

🎥 Video demo and screenshots coming soon. Currently in closed beta testing on Google Play Store.