Mobile Development Landscape & Developer Spectrum

• Apps crucial for world interface - mobile apps = most website experiences
• React Native's value: standardized tools, introduced key concepts to mobile devs
• Led to innovations: code push, Swift UI, etc.
• Developer spectrum: backend ↔ frontend
• Mobile devs positioned further from servers than frontend devs
• Mobile devs actively avoid servers, adopt alternatives like Firebase
• Firebase success largely driven by mobile devs' server aversion

Problem with Current Mobile Development

• Products like UploadThing require server for authentication
• Most developers need servers to safely run code connecting to various sources
• Mobile development historically made this incredibly difficult
• Whole product categories formed to help mobile devs avoid backend work
• Similar to early web era: automatic GraphQL endpoints, Hasura, etc.
• Hard separation between frontend/backend considered problematic

Expo Router V3 Introduction

• Full stack React for iOS, Android, and web
• Key feature: API routes (not server components yet)
• Tailwind support added (Expo hired NativeWind creator)
• Beta support for newest Expo platform: servers
• Bold statement for mobile dev community
• File-based routing: +api.ts syntax (vs Next.js route.ts)
• Collocated backend code with mobile code
• Single file approach for backend functionality

Technical Implementation

• Import Expo request/response (browser standards compatible)
• Export GET, POST functions
• Database connections, authentication, other backend tasks possible
• tRPC support becomes trivial
• Winter CG compliant environment support
• Works on: Netlify, Cloudflare, Vercel
• Web standard code - learn once, use everywhere

Demo Setup & Configuration

• Created Expo app with TypeScript template
• Added API folder structure: app/api/test+api.ts
• Required app.json modification: "output": "server" under web
• Standard request/response handling
• Default port: 8081
• Curl testing: localhost:8081/api/test

Cross-Platform Compatibility

• Same code works in Next.js and Expo
• Demonstrated identical API code running in both frameworks
• Web standards enable portability
• UploadThing integration now possible in Expo apps
• Existing Next.js bindings work directly in React Native

Deployment Process

Vercel Deployment

• Experimental, subject to breaking changes
• Required files:
  • api/index.js - server entry point, delegates all requests
  • vercel.json - configuration file
• Build process: npx expo export + custom vercel build script
• 2-minute initial build time (caching improves subsequent builds)
• Creates both API routes and static web pages
• Full stack framework capabilities

Deployment Configuration

• Custom build command in package.json
• Vercel.json specifies:
  • Output directory location
  • Function definitions
  • Runtime requirements
  • Route redirects for unmatched pages
• TypeScript would require compilation (JavaScript simpler)

Results & Impact

• Working API endpoint deployed on Vercel
• Same codebase serves web app and mobile app
• Server endpoints accessible to both platforms
• Mobile devs can now integrate backend directly
• Sets foundation for future server components
• UploadThing and similar services now viable for mobile

Future Implications

• Server components potential for mobile
• Better integration between mobile and backend
• Reduced reliance on Firebase-style solutions
• More sophisticated mobile app architectures possible
• Full-stack React Native development reality