Back to Blog
2026-07-28·8 min read·14 okunma

React Under the Hood #3: The True Face of Expo, Prebuild, and Universal Routing

When building apps with React Native, leveraging the underlying power of C++ and JSI is fantastic. However, when it comes to adding device-specific notification permissions, linking camera modules, or preparing the app for the store, you might suddenly find yourself lost in a sea of Objective-C and Java files. Historically, the React Native world offered two choices: either stick with Expo and forfeit certain native features, or "eject" your project and confront the chaos of native directories. Today, however, Expo has resolved this dilemma with a groundbreaking approach to software architecture: Continuous Native Generation. But how exactly?

ExpoPrebuildExpo Routing

1. Goodbye to Native Folders: The Prebuild System

In modern Expo projects (in your GitHub repository), you won't see

typescript
ios
and
typescript
android
folders. You only have your JavaScript/TypeScript code and an
typescript
app.json
configuration file.

When you install a native module to your project (for example,

typescript
expo-camera
, which uses the device camera), Expo's Prebuild system comes into play. The moment you run the
typescript
npx expo prebuild
command in the terminal (or trigger a build via EAS), the following happens under the hood:

  1. Expo reads the
    typescript
    app.json
    file in your project.
  2. It generates pristine, brand-new
    typescript
    android
    and
    typescript
    ios
    folders from scratch.
  3. Thanks to Config Plugins, it automatically "injects" all the native configurations required by the packages you installed (camera permissions, Info.plist modifications, Gradle configurations) into these new folders.

A Metaphor: Manufacturing with a 3D Printer Think of the

typescript
ios
and
typescript
android
folders in the past like a sculpture you shaped by hand with clay; when you messed something up, it was very hard to fix. The Prebuild architecture, on the other hand, is like a 3D Printer. You only provide the 3D model (
typescript
app.json
). If the output (the native folders) gets corrupted, you don't care; you just delete the folders and "print" a flawless copy from scratch in seconds with a single click.

This way, you never have to deal with native code blocks (Java/Swift). Everything is managed from the JavaScript world and via

typescript
app.json
.

2. Moving the Build Process to the Cloud: EAS (Expo Application Services)

To convert these automatically generated native folders into a physical

typescript
.apk
or
typescript
.ipa
file, you need a powerful computer (and mandatorily, a Mac for iOS).

EAS Build takes this process off your local machine and moves it to cloud servers. The system running in the background:

  • Clones your code to a remote Virtual Machine.
  • Executes the
    typescript
    prebuild
    process mentioned above over there.
  • Compiles the code by running Apple's
    typescript
    xcodebuild
    or Android's
    typescript
    gradlew
    commands.
  • Delivers the signed installation file to you.

So essentially, while writing code on a Windows or Linux machine, you are renting a Mac in the cloud to have your project built for iOS.

3. Universal Routing: Expo Router

The biggest revolution from Expo in recent times is undoubtedly Expo Router.

In traditional React Native projects,

typescript
React Navigation
was used for navigating between screens. We would manually define screens and struggle with structures that turned into spaghetti code while setting up nested navigation hierarchies. On the web side, meanwhile, Next.js's file-based routing was a lifesaver.

The Expo team asked, "Why don't we bring this convenience to mobile?"

Under the hood, Expo Router still uses the native power of

typescript
React Navigation
. However, it completely changes the developer experience (DX):

  • You create a file named
    typescript
    app/profile/settings.tsx
    .
  • Expo Router analyzes this folder structure in the background.
  • During the bundle phase, it automatically converts this structure into
    typescript
    React Navigation
    screens and native routers.

Why "Universal"?

The real magic of Expo Router is its ability to produce both web and mobile applications from the same codebase. During the build time, the Metro bundler:

  • Creates native tab bar and stack structures for mobile devices.
  • When it compiles the same code for the web, it generates classic web routing (URL routing) that directly maps to the browser URL.

With the same mental model, you get to master iOS, Android, and web platforms all at once.

Summary

This code journey, which begins with React's Virtual DOM and is translated into hardware language via JSI and Hermes, has become highly manageable, modern, and "Universal" with Expo's Prebuild and Router architecture.

Today, writing a modern React Native / Expo application is not just about developing a mobile app; it is about building a single, scalable architecture for all platforms.

All Articles