How to create expo app: Start to Finish

Alright, let's get your Expo app off the ground. Getting started is surprisingly fast. All you really need is Node.js installed, and from there, a single command, npx create-expo-app YourAppName, scaffolds a complete React Native project for you.

Once that's done, you just run npx expo start to fire up the development server. That’s it. You're ready to start building and testing.

Your Quick Guide to Creating an Expo App

Expo's biggest win is how it simplifies building universal apps for iOS, Android, and the web from one JavaScript or TypeScript codebase. It lets you skip the often frustrating and time-consuming setup with native tools like Xcode or Android Studio. Instead of fighting with configurations, you get to jump straight into writing features.

This is a huge deal for development speed. I’ve seen teams get a basic app running in just a few minutes with Expo. Compare that to the hours (or even days) it can take to get a traditional React Native project properly configured on everyone's machines.

Managed vs. Bare Workflows

Before you run that first command, you have a key decision to make: Managed or Bare workflow? This choice dictates how much control you have over the underlying native code and will shape your entire development experience.

This visual shows the simple three-stage process to create an Expo app, from initial setup to running the project.

The flow highlights how quickly you can move from a command prompt to a live application, which is a core benefit of the Expo ecosystem.

To help you decide, here’s a breakdown of what each workflow offers and who it’s best for.

Expo Managed Workflow vs Bare Workflow

The takeaway? Stick with the Managed workflow if you can. It’s the default for a reason because it’s faster, simpler, and lets you focus on building your app's features. Only "eject" to the Bare workflow if you hit a hard wall and absolutely must have a specific native module that Expo doesn't support.

For larger projects or if you're looking to scale your team, exploring options like offshore app development can also be a smart move once your project's needs start to grow beyond your initial team.

Getting Your Environment Ready

Before you can build anything, you need to get your computer set up. Think of it as preparing your workshop. You only have to do it once, and getting it right from the start saves you a world of headaches later on.

The entire Expo ecosystem runs on Node.js. It’s the engine that powers all the command-line tools you’ll be using. It's not a suggestion; it's the one thing you absolutely must have installed.

Installing Node.js

First things first, you need to install the latest LTS (Long-Term Support) version of Node.js. Why LTS? Because it's the stable, battle-tested version that gets security updates for a long time. It’s the reliable choice. Stay away from the "Current" version; it might have shiny new features, but it hasn't been through the wringer yet.

Just head over to the official Node.js website, which will automatically suggest the right installer for your operating system (macOS or Windows). Download it, run it, and click through the prompts. Simple as that.

A huge bonus of installing Node.js is that you also get npm (Node Package Manager). This little tool is your best friend for installing packages and running commands, including the one we'll use next.

Installing the Expo CLI

With Node.js and npm in place, it’s time to install the Expo CLI (Command Line Interface). This is your main control panel for everything Expo. It handles creating new projects, firing up the development server, and even managing your production builds.

To get it installed globally on your machine, open your terminal (Terminal on macOS, or PowerShell/Command Prompt on Windows) and run this single command:

npm install -g expo-cli

This tells npm to fetch the expo-cli package and make it available from anywhere in your terminal. You only need to do this once.

What if the Installation Goes Sideways?

Sometimes, things just don't work on the first try. It happens. Here are a couple of the most common snags you might hit while trying to create an Expo app and how to get past them quickly.

• Permission Errors on macOS: If your terminal screams EACCES at you, it just means npm doesn’t have the right permissions to install things globally. The quick-and-dirty fix is to run the command with sudo (sudo npm install -g expo-cli), but a better long-term solution is to configure npm to use a different directory.

• "Command Not Found" on Windows: Did you install everything, but your terminal acts like it’s never heard of expo? This is almost always a PATH issue. Your system simply doesn't know where to look for the command you just installed. The easiest fix is often just to close your terminal and open it again. Sometimes, a full reboot is needed for the Node.js installer's changes to the system PATH to kick in.

With your development environment good to go, it's time for the fun part: turning your app idea into something real. We'll walk through the exact steps to create a new Expo app, get its basic structure in place, and see it running on your own device in just a few minutes.

This immediate feedback loop is one of the most satisfying parts of working with Expo. The main tool you’ll use is create-expo-app. It’s the standard for scaffolding a new project and handles all the initial boilerplate for you, boiling down what used to be a complex process into one simple command.

Picking Your Project Template

When you kick off the command, Expo will ask you to choose a template. This isn't just about looks; it's about getting the right starting point for your project's needs.

• Blank Template: This is the most minimal option, giving you a single screen. It's perfect if you want to build your app's architecture from scratch.

• Tabs Template: A more feature-rich start that includes a pre-configured tab navigation structure. This is a great choice for apps that will have several distinct sections.

• Minimal Template: Similar to the Blank template, but with even less code. This is for developers who truly want just the bare essentials.

Ready to start? Open your terminal, cd into the directory where you want your project to live, and run this command. Just replace YourAppName with whatever you want to call your app.

npx create-expo-app YourAppName

After you hit enter, the command line will prompt you to pick a template. For your first project, the Blank template is usually the best bet. It lets you see the core components without any extra clutter getting in the way.

Understanding the Project Structure

Once the installer finishes, you’ll find a new folder with your app’s name. Go ahead and navigate into that directory (cd YourAppName), and you'll see a handful of key files and folders.

The App.js file (or App.tsx if you're using TypeScript) is the main entry point for your entire application. This is where you’ll start writing code. You'll also see an assets folder, which is the perfect spot for images, custom fonts, and other static files. You can dive deeper into how all these pieces fit together in our complete guide to creating an app with React Native.

Firing Up the Development Server

Alright, let's get your app running. From inside your project's directory, run this command in your terminal:

npx expo start

This command boots up the Metro Bundler, a high-performance JavaScript bundler that compiles all your code and gets it ready to serve to the Expo Go app. Once it’s up and running, your terminal will display a big QR code.

This is the magic moment. Open the Expo Go app on your phone, scan that QR code, and within seconds, your brand-new app will appear on your screen. Any changes you make to your code will now reload instantly on your device.

Connecting Your App to a Supabase Backend

A static app is a great start, but it's just a shell. To bring it to life, you need a way to store data, manage users, and handle all the logic that makes an app useful. This is where a backend comes in, and for Expo projects, Supabase is a near-perfect fit. It gives you a real Postgres database, authentication, and a whole suite of tools without forcing you to become a server admin overnight.

This step is what turns your project from a simple user interface into a full-stack application. We're going to connect your app to a live database so it can perform the fundamental operations of any dynamic app: Create, Read, Update, and Delete data (CRUD).

Setting Up Your Supabase Project

First things first, head over to the Supabase website and spin up a new project. Their free tier is incredibly generous and more than enough to get you through development and even launch a small-scale app. You get a good amount of database storage and plenty of API requests to play with.

Once your project is provisioned, you'll need two critical pieces of information from its dashboard: the Project URL and the anon public key.

Treat these keys like you would a password. While the anon key is designed to be safely used in a client-side app like Expo, you should never hardcode secrets directly into your source code. Use environment variables instead. It's a crucial security habit to build early on.

Installing the Supabase Client

With your Supabase project ready, it's time to give your Expo app the ability to talk to it. This is done by adding the Supabase client library, a package that bundles all the functions you'll need.

Open up your terminal, make sure you're in your project's root directory, and run this command:

npx expo install @supabase/supabase-js

A quick tip: always use npx expo install instead of npm install for Expo projects. This command is smart enough to grab a version of the library that's guaranteed to be compatible with your current Expo SDK version. It's a simple trick that can save you from a world of hurt caused by version mismatch headaches.

Designing a Simple Database Table

Let's make this practical by building a simple task manager. In your Supabase dashboard, find the Table Editor and create a new table called tasks.

For our tasks table, we'll need just a few columns:

• id: The primary key, which Supabase can set up to auto-increment for you.

• created_at: A timestamp that automatically records when a task was added.

• title: A simple text column for the task description itself.

• is_completed: A boolean (true/false) column to track if a task is done, which should default to false.

That's it. This basic structure is all you need to start building a real feature. For more complex applications where you need full control, you can even explore a Supabase self-hosted solution.

Performing CRUD Operations in Your App

Now for the fun part: writing the code to make your app and database communicate. Here’s a quick look at how you might fetch a list of tasks inside your App.js file.

import { createClient } from '@supabase/supabase-js';
import { useState, useEffect } from 'react';

// Initialize the client with your project's credentials
const supabaseUrl = 'YOUR_SUPABASE_URL';
const supabaseAnonKey = 'YOUR_SUPABASE_ANON_KEY';
const supabase = createClient(supabaseUrl, supabaseAnonKey);

export default function App() {
  const [tasks, setTasks] = useState([]);

  useEffect(() => {
    async function fetchTasks() {
      // Fetch all records from the 'tasks' table
      const { data, error } = await supabase
        .from('tasks')
        .select('*');

      if (!error) {
        setTasks(data);
      } else {
        console.error('Error fetching tasks:', error);
      }
    }

    fetchTasks();
  }, []);

  // ... the rest of your UI to display the tasks
}

This snippet does a few key things: it initializes the Supabase client, creates a state variable to hold our tasks, and uses a useEffect hook to fetch all records from the tasks table the moment the app loads. From here, you can easily build out functions to add, update, or delete tasks and wire them up to buttons and inputs in your UI.

Building Your App for Production with EAS

After all the coding and testing, your app is finally ready for the real world. This is where you shift from a development mindset to preparing a production-ready build, and for that, Expo Application Services (EAS) is your best friend. EAS is the official cloud build service from the Expo team, specifically designed to cut through the complexity of getting your app into the Apple App Store and Google Play Store.

Without it, you'd be wrestling with native build tools like Xcode and Android Studio directly. This path is notoriously painful, demanding specific hardware (you can't build for iOS without a Mac) and a deep, often frustrating, understanding of native code signing. EAS handles all that for you, letting you create production builds in the cloud with just a couple of commands.

Configuring Your Build Profiles in eas.json

To get started with EAS, you first need to set it up in your project. A single command, eas build:configure, will generate a new eas.json file at the root of your project. Think of this file as the command center for all your builds. It's one of the most important configuration files you'll touch when you create an Expo app for production.

The real power of eas.json comes from "profiles," which let you define separate configurations for different situations. This is a game-changer. You can set up distinct profiles for:

• Development: A build meant for your internal team, usually with debugging tools switched on.

• Preview: A build that's nearly identical to a final release, which you can share with testers using a simple link or QR code.

• Production: The final, optimized build that you’ll actually submit to the app stores.

Inside each profile, you can control things like environment variables, credentials, and distribution settings. For example, your development profile could point to a test backend, while your production profile connects to the live one.

This separation is more than a convenience; it's a critical best practice. It prevents common but costly mistakes, like accidentally shipping an app with development keys or pointing thousands of users to a test database. Well-configured profiles make your deployment process safe and predictable.

Initiating Your First Production Build

Once your eas.json file is configured, kicking off a build couldn't be simpler. You just run a command from your terminal, telling EAS which platform you're targeting.

For an Android build, you’d run: eas build -p android --profile production

And for an iOS build, it’s: eas build -p ios --profile production

When you execute one of these, the EAS CLI securely packages and uploads your project to Expo's build servers. From there, the service spins up a clean virtual environment, installs your dependencies, and compiles the final native binary (.aab or .apk for Android, .ipa for iOS). You can follow the whole thing on a web dashboard, watching the logs in real-time.

Managing Credentials and Secrets Securely

One of the biggest headaches in mobile deployment is managing signing credentials. These are the digital keys Apple and Google require to verify that you are who you say you are. EAS takes this entire burden off your shoulders by managing them securely for you.

On your first build, EAS will ask if you want it to generate new credentials or if you want to upload your existing ones. It then stores them securely within your Expo account, automatically pulling them in for future builds. This is a massive security win because it means you don't have sensitive key files sitting on your laptop.

EAS does the same for environment variables and other secrets, making sure they are never hardcoded in your app's source code. You can define these secrets in your EAS account and have them safely injected into your builds through the eas.json file. This is a foundational practice for any secure deployment pipeline. To learn more about setting up these kinds of workflows, check out these continuous deployment best practices.

As you get ready to publish, it's always smart to review each store's specific rules. For Android, the official Google Play Store deployment documentation is the best place to find the latest requirements and ensure a smooth submission.

Common Questions About Creating Expo Apps

As you get your first project off the ground, you're bound to run into questions. The Expo ecosystem is incredibly powerful, but it has its own way of doing things that can be new territory, even for developers coming from other backgrounds. Here are the answers to the most common sticking points people hit when building an Expo app.

Can I Use Any React Native Library with Expo?

This is easily the most common and most important question people ask. The answer really comes down to which "workflow" you're using.

• Managed Workflow: In this setup, you can use any library written purely in JavaScript. But if a library needs custom native code (think Objective-C/Swift for iOS or Java/Kotlin for Android) it just won't work with the standard Expo Go app.

• Bare Workflow or Development Builds: This is your path forward for libraries with native modules. You'll need to either "eject" to the Bare workflow or, more commonly these days, create a custom development build. A development build is basically your own personalized version of Expo Go that includes the specific native code your project depends on.

What Is the Difference Between Expo Go and a Development Build?

They look similar, but they solve different problems. Expo Go is a pre-built app you download from the app store that contains the entire Expo SDK. It’s fantastic for getting started and testing things out quickly in the Managed workflow because you never have to compile any native code yourself.

A development build, on the other hand, is a custom version of your own app that you compile. It includes any third-party native libraries you've decided to add. You'll make one of these the moment you need something that isn't in the standard Expo Go client, like a library for in-app purchases or a specific analytics tool.

The modern approach is to start with Expo Go for quick prototyping, then immediately switch to a development build as soon as you need any custom native code. This gives you the best of both worlds: rapid iteration at the start and total native flexibility when you need it.

How Do I Handle App Updates?

Expo has a killer feature for this called EAS Update, which lets you push Over-the-Air (OTA) updates. This means you can send changes to your app's JavaScript code and images directly to users' phones, completely skipping the painful app store review process. It's perfect for shipping quick bug fixes, tweaking the UI, or adding small features on the fly.

However, for any change that touches native code, like adding a new library or upgrading your Expo SDK version, you’ll have to submit a completely new build to the app stores.

Is Expo Free to Use?

Absolutely. The core open-source Expo framework is 100% free. You can develop and build your app entirely on your own computer without ever paying a dime.

Expo also offers a suite of cloud services called Expo Application Services (EAS), which takes care of the annoying parts like building your app in the cloud, managing updates, and submitting to the stores. EAS runs on a freemium model. The free tier is quite generous and works perfectly for most solo developers and small projects. Paid plans are available for teams and companies that need more build time or advanced collaboration features.

Ready to turn your app idea into a reality without the steep learning curve? CatDoes uses AI agents to translate your descriptions into production-ready code, complete with a backend and app store submission prep. Skip the complexities and focus on your vision. Build your first app for free on CatDoes.