Appearance
Mobile App
The G2 Elite Mobile app is built with Expo (React Native) and runs on iOS.
App Navigation
When you open the app, here's the path you take:
| Step | What You See | What Happens |
|---|---|---|
| 1 | Splash screen | App loads and checks if you're signed in |
| 2 | Sign in / Sign up | Create account or enter email + password |
| 3 | Verify email | Enter 6-digit code from your inbox |
| 4 | Join organization | Scan QR code or type invite code |
| 5 | Role-specific setup | Parent: find your child. Coach: confirm team. |
| 6 | Main app | Home, Teams, Schedule, Chat, Scores |
Main App Tabs
| Tab | Icon | What's Inside |
|---|---|---|
| Home | 🏠 | Overview of your team, next game, recent scores |
| Teams | 👥 | Team roster, player details, contact info |
| Schedule | 📅 | Upcoming games and practices with locations |
| Chat | 💬 | Team messaging with parents and coaches |
| Scores | 🏆 | Live scoring, stats, and standings |
How We Switched Backends Without Rewriting the App
The app has 35+ screens that all talked to the old server. Instead of rewriting every one, we built an adapter — a thin translation layer.
The adapter speaks the same language as the old server, but routes everything through the new Cloudflare backend. Every screen works exactly as before — no code changes needed in any of the 35 screens.
| Before | After |
|---|---|
| Screen → Old Express Server | Screen → Adapter → Cloudflare Gateway → Data Service |
| Connection strings in code | Secrets managed by Cloudflare |
| Socket.IO for chat | HTTP polling (Durable Objects planned) |
| 5 different login screens | 1 Clerk sign-in screen |