
AHMED FAYYAZ
THE WORK / A CLOSER LOOK

01 / overview
A comprehensive mobile educational platform built with React Native and Expo for mastering the English language.
02 / story
All-English is a comprehensive mobile educational platform designed to help users master the English language. Built using React Native and Expo, the application provides a structured learning path through categorized lessons, video content, and interactive materials.
The app targets Sinhala-speaking learners (indicated by the localized payment instructions and author profiles) who seek to improve their translation and English communication skills.
Traditional English learning methods often lack accessibility and personalized pacing. For many learners in specific regions (like Sri Lanka), there is a high demand for content that bridges the gap between their native language (Sinhala) and English, especially in professional fields like translation and banking.
The All-English mobile app was developed to provide a "classroom in your pocket" experience.
03 / architecture
Modular React Native Architecture with Global Context providers and API services.
04 / case study
Focused on accessibility for Sinhala-speaking learners in Sri Lanka.
05 / challenges
Optimizing for 16KB memory page sizes for Android 15 compatibility.
Explore more projects, read the engineering field notes, or browse the services if you're planning something similar.
The application follows a modular and service-oriented architecture, ensuring scalability and maintainability.
React Native with Expo for rapid development and cross-platform consistency.React Navigation (Stack) manages the flow between authentication, dashboard, and learning screens.React Native Paper is used for a consistent Material Design aesthetic, supplemented by custom components.ThemeContext supports dynamic light/dark mode switching and brand-specific color palettes.AuthContext: Manages user authentication status and profile data.LessonContext: Handles lesson data and user progress.ThemeContext: Controls the visual appearance of the app.ApiService class (found in src/services/apiService.js) handles all RESTful interactions.Facebook SDK (react-native-fbsdk-next) is integrated for tracking user engagement and app launch events.react-native-iap facilitates secure in-app purchases on Play Store and App Store.| Category | Technology |
|---|---|
| Core | React Native, Expo |
| Navigation | @react-navigation/stack |
| State | React Context API |
| UI Framework | React Native Paper, Vector Icons |
| Backend | REST API (Supabase/Custom) |
| IAP | react-native-iap |
| Analytics | Facebook SDK |
| Storage | @react-native-async-storage/async-storage |
/
├── App.js # Entry point & Root Navigation
├── src/
│ ├── components/ # Shared UI components (Layouts, Buttons, etc.)
│ ├── config/ # API and environment configurations
│ ├── context/ # Global state providers (Auth, Lesson)
│ ├── screens/ # Main application views (Dashboard, Lessons, etc.)
│ ├── services/ # API clients and analytics services
│ ├── theme/ # Custom styling and theme definitions
│ └── utils/ # Helper functions and constants
├── android/ # Native Android project files
└── assets/ # Project images, icons, and fonts
The application is built with modern Android standards in mind, ensuring long-term compatibility and performance.
To comply with upcoming Google Play requirements (targeting Android 15+), the app has been optimized for 16 KB memory page sizes. This involved:
AndroidManifest.xml with the 16k_page_size.supported property.build.gradle and proguard-rules.pro.react-native-screenshot-prevent).