Senior Mobile Engineer - Technical Interview Project

Welcome! This is a React Native learning platform app built with Expo. This codebase is designed to assess your technical skills through hands-on debugging, refactoring, and architectural discussions.

🎯 Objective

This is a realistic codebase with intentional issues including:

• Bugs that prevent the app from running
• Failing tests
• Performance problems
• Code smells and refactoring opportunities
• Architectural challenges

Your task is to work through these issues, discuss solutions, and demonstrate your mobile engineering expertise.

🚀 Quick Start

Prerequisites

• Node.js 18+ installed
• npm or yarn
• (Optional) iOS Simulator or Android Emulator
• (Optional) Expo Go app on physical device

Installation

1. Install dependencies

   npm install

2. Run tests (they will fail initially - that's expected!)

   npm test

3. Start the app

   npm start

   Then choose your platform:

   • Press w for web browser
   • Press i for iOS simulator (Mac only)
   • Press a for Android emulator
   • Scan QR code with Expo Go app

   Note: The app will crash on first load. Your first task is to debug why!

High-Level Phases:

1. Debug & Get Running - Fix critical bugs to get the app running
2. Fix Tests - Debug and fix failing test suites
3. Code Review - Identify issues and discuss architecture
4. Performance - Optimize rendering and list performance
5. Refactoring - Break down large components

🏗️ Project Structure

thinkific/
├── app/                      # Expo Router pages (file-based routing)
│   ├── (tabs)/              # Tab navigator screens
│   │   ├── index.tsx        # Course list (home) screen
│   │   └── explore.tsx      # Profile screen
│   └── course/[id].tsx      # Dynamic course detail screen
├── components/              # Reusable UI components
│   ├── CourseCard.tsx       # Course card component (has perf issues)
│   └── __tests__/           # Component tests
├── services/                # Data layer
│   ├── courseService.ts     # API/mock data service (has bugs)
│   └── __tests__/           # Service tests
├── types/                   # TypeScript type definitions
│   ├── course.ts            # Course and lesson types
│   └── navigation.ts        # Navigation types (has type errors)
├── constants/               # Theme and constants
├── hooks/                   # Custom React hooks

🧪 Testing

# Run all tests
npm test

# Run tests in watch mode
npm run test:watch

🛠️ Tech Stack

• React Native - Mobile framework
• Expo - Development platform and tooling
• Expo Router - File-based navigation
• TypeScript - Type safety
• Jest - Testing framework
• React Native Testing Library - Component testing

📱 Features

This learning platform includes:

• Course Catalog - Browse 35+ courses with search and filtering
• Course Details - View lessons, progress, and enroll
• User Profile - View stats, settings, and preferences
• Theming - Light and dark mode support

🐛 Known Issues (For Interviewers)

This section is intentionally left brief. See INTERVIEW.md for complete issue list.

The app contains various intentional issues to assess:

• Debugging skills
• Performance optimization
• Code architecture
• Testing knowledge
• TypeScript proficiency

📚 Resources

• Expo Documentation
• React Native Documentation
• Expo Router Documentation
• React Native Testing Library

💡 Tips

• Take your time to understand the codebase structure
• Use console logs and debugging tools effectively
• Ask questions when requirements are unclear
• Think out loud - explain your reasoning
• Consider edge cases and tradeoffs
• It's okay to not finish everything - we want to see your process

Good luck! 🚀