Phase 2: React Native & Cross-Platform

React Native CLI vs Expo: trade-offs & project init

Beginner ~3 min read
Think of it this way A friendly analogy. Read this if the technical version feels dense. Show Hide

Hey there! So, you’re thinking about making your own mobile app, like the ones on a phone or tablet? That's super cool! When you start building with something called React Native, one of the first things you'll decide is kind of like picking your toolset for a big building project.

Imagine you want to build a fantastic castle out of LEGOs. You have two main ways to start. One way is like buying a special LEGO castle kit. This kit comes with clear instructions, all the right pieces are grouped together, and maybe even some tricky parts like the drawbridge or a tall tower are pre-assembled for you. This is a bit like using something called Expo. With Expo, many of the complicated setup steps are already handled, so you can just jump right into building your castle walls and turrets, focusing on the fun creative part. It’s really fast to get started, perfect for when you're learning or just want to quickly try out an idea.

The other way to build your castle is like having a giant, overflowing box of every single LEGO brick ever made – all different shapes, sizes, and colors. This is more like using the React Native CLI (which just means the basic React Native tools). With this huge box, you have total freedom. You can build absolutely anything you can dream up, even making custom parts or connecting your castle to other fancy LEGO creations that aren’t in a standard kit. But, it also means you have to sort through all those thousands of pieces yourself, figure out how to put every single tiny brick together, and sometimes even set up the baseplate before you can even start building walls. It takes more work and time to get going, but once you do, you have complete control over every little detail.

So, when you're making your app, choosing between Expo and the React Native CLI is like choosing between the ready-to-go LEGO kit (Expo) for a quick and easy start, or the giant box of bricks (React Native CLI) for ultimate control and flexibility. This means you can pick the best way for your project: whether you want to quickly build a fun practice app, or if you're ready to tackle a super unique, advanced app that needs a lot of custom touches from scratch.

When you embark on your React Native journey, one of the first decisions you'll face is choosing between initializing your project with Expo or the React Native CLI. Think of Expo as a friendly wrapper that simplifies React Native development by handling much of the complex native setup for you. It provides a managed workflow, meaning you don't typically need to touch Xcode (for iOS) or Android Studio directly. This makes it incredibly fast to get started, perfect for beginners and rapid prototyping, as you can focus purely on writing JavaScript code and immediately see your app run on devices or simulators without intricate native environment configurations.

On the other hand, React Native CLI (Command Line Interface) gives you direct, unbridled access to the underlying native projects (iOS and Android). This means you'll have more control over native modules, custom native code, and project configurations. The trade-off is a more involved setup process; you'll need to configure your native development environments (Xcode, Android Studio, Java SDK, etc.) manually. While this offers maximum flexibility, allowing you to integrate any native library or write custom native code, it adds complexity and a steeper learning curve, especially if you're new to mobile development.

For a beginner, we generally recommend starting with Expo. It removes significant hurdles, allowing you to quickly build and deploy apps. Many common functionalities like camera access, push notifications, and maps are easily integrated via Expo's SDK, often without needing to link native modules manually. You can also develop and test using Expo Go on your phone. If, however, your project later requires a very specific native module not supported by Expo's managed workflow, or if you need to deeply customize native code, you can use Expo's prebuild command to generate the native project files (similar to a React Native CLI project), or start directly with the React Native CLI from the outset. The decision often boils down to balancing ease of development and rapid iteration (Expo) against ultimate control and flexibility (React Native CLI).

Key Takeaways

  • Expo offers a simplified, managed workflow for rapid development, ideal for beginners.
  • React Native CLI provides full control over native code but requires more manual setup.
  • Expo is excellent for most projects and prototyping; you can add native code with Expo prebuild later.
  • Choose React Native CLI if you know you need deep native customization or specific un-supported native modules.
  • Start with Expo to learn React Native without getting bogged down in native environment setup.

Code Example

bash
# Initialize an Expo project (recommended for beginners):
npx create-expo-app MyExpoApp
cd MyExpoApp
npx expo start

# Initialize a React Native CLI project:
npx react-native init MyRNCLIApp --template react-native-template-typescript # (or without --template for plain JavaScript)
cd MyRNCLIApp
npx react-native run-android # or npx react-native run-ios

How this code works

This code demonstrates how to initialize and launch two distinct types of React Native projects: one using Expo and another using the React Native CLI. For an Expo project, npx create-expo-app MyExpoApp generates a new project directory with essential files. After navigating into this new directory using cd MyExpoApp, npx expo start launches the development server, allowing quick app previews. A helpful detail here is that npx automatically runs the necessary tools without requiring a global installation, streamlining the initial setup.

For a bare React Native CLI project, npx react-native init MyRNCLIApp sets up the project structure. A crucial point is the --template react-native-template-typescript option; this explicitly configures the project to use TypeScript, whereas omitting it would default to a plain JavaScript setup, which can trip up beginners expecting TypeScript. Once inside the project directory via cd MyRNCLIApp, npx react-native run-android or npx react-native run-ios then builds and deploys the application to an Android or iOS emulator or device, respectively.

Related Articles

Hand-picked reads to go deeper on react native setup & tooling.

Back to Mobile Developer Roadmap