Running a React Native Starter Project on Moto G with Expo Go

Good to see you again. In the previous lesson, you installed Expo Go and opened Expo Snack in your Moto G’s browser. You also identified the main project file, usually App.js or App.tsx.

Today you will connect those tools: open the provided starter project in Snack, launch it in Expo Go on the same phone, and confirm that a real React Native app is running. You do not need to understand or edit the starter code yet. The goal is a reliable “edit in browser, run on phone” loop.

Plan for about 25–30 minutes.

---

What it means to run a Snack project

Snack is where the project’s code lives. Expo Go is the app that loads that project and displays it as a mobile app on Android.

When you launch a Snack project through Expo Go, Expo Go downloads the project while your phone is connected to the internet, then shows the app’s interface. This is why both the browser and Expo Go need a working network connection during this course.

The exact layout can differ on a Moto G, especially in portrait mode. Do not worry about matching the screenshot. Look for the project files, the code editor, and a device-preview area or control.

Before you begin, connect to Wi-Fi if possible. Mobile data can work too, but a stable connection makes loading projects more dependable.

---

The connection between Snack and Expo Go

Expo’s documentation describes Snack as a web-based editor and identifies the My device area as the way to open a project in Expo Go.

A few words may be useful now:

• A project is the collection of files that makes up an app.
• A preview is a running version of that project.
• Expo Go is the Android app that displays the preview on your Moto G.
• A bundle is the project code prepared for Expo Go to load. You may see a loading message while this happens.

---

Open the provided starter project in Snack

1. Open your mobile browser and go to the Snack project provided for this course. If it is still open from the previous lesson, return to that browser tab.

2. Wait for Snack to finish loading. You should see code in App.js or App.tsx.

3. Do not type or delete anything in the file today.

4. Look for a status message such as No errors, if Snack displays one. A starter project can sometimes take a short time to prepare, so give it a minute before treating a message as a problem.

5. Find the device-preview controls. Depending on the current Snack layout, this may be a tab, a phone icon, a preview panel, or a button labeled My Device.

The preview controls sometimes include Android, iOS, and Web. These are useful representations of different platforms, but they are not the same as running the app on your actual Moto G. For this lesson, choose My Device or the option that explicitly mentions Expo Go.

---

Launch the starter project in Expo Go

Use the direct Expo Go launch option

In Snack’s My Device area, look for a button or link with wording similar to:

• Open in Expo Go
• Open project in Expo Go
• Launch Expo Go
• Open on your device

Tap that option. Android may show a confirmation asking whether your browser may open Expo Go. Choose Open or Allow for Expo Go.

Your phone should switch from the browser into Expo Go. You may briefly see a loading screen while Expo Go fetches the starter project.

Wait for the app, rather than repeatedly tapping

Give Expo Go up to a minute or two on the first load. The app has started successfully when you see the starter project’s screen rather than:

• Expo Go’s home screen,
• a permanent loading spinner,
• or a red error screen.

The text and layout depend on the starter project. It may show a simple greeting, a sample interface, or a basic task-related screen. What matters is that it is the project launched from Snack, not merely the Expo Go home page.

A note about QR codes on one phone

You may also see a QR code in Snack. QR codes are useful when Snack is open on a computer and Expo Go is open on a separate phone.

Because Snack and Expo Go are both on your Moto G, your phone camera cannot conveniently scan a QR code displayed on that same phone. Prefer the direct Open in Expo Go launch control in the My Device panel. Do not get stuck trying to scan your own screen.

---

Confirm that the starter app is running

Once Expo Go opens the project, do these simple checks:

1. Look for visible text or an interface from the starter project.
2. Tap or scroll only if the starter screen clearly contains a control that invites interaction.
3. Check that you do not see a red error message.
4. Leave Expo Go open for a few seconds, confirming that the preview remains on screen.

At this stage, seeing an app screen is enough. You are not expected to recognize the JavaScript, React, or React Native code behind it yet.

One useful habit is to remember where you are working:

What you are doing	Where to do it
Opening and viewing project files	Snack in your browser
Changing code	Snack in your browser
Running the Android version	Expo Go
Checking whether the app looks right on the Moto G	Expo Go

To return to Snack, use Android’s Overview/Recent apps button or gesture and select your browser. You can switch between Snack and Expo Go whenever you need to, without closing either one.

---

If the app does not open

Small setup issues are normal. Work through the relevant case calmly, in this order.

What you see	What to do
Snack is still loading or shows a blank editor	Check your connection, wait briefly, then refresh the browser tab once.
Tapping the launch control does nothing	Tap it once more and watch for an Android prompt asking to open Expo Go. If needed, return to the browser and ensure Expo Go is installed.
Expo Go opens but keeps loading	Confirm the phone has internet access. Return to Snack, wait for the project to finish preparing, then launch again.
Expo Go shows a red error screen	Return to Snack and check whether it reports an error too. Do not change code at random; reload the Snack page once and retry the launch.
Snack only shows a QR code	Look carefully around the My Device area for an Expo Go launch button or link. A QR code alone is designed mainly for a second screen.
Expo Go shows its home screen instead of the app	Switch back to Snack and use the project’s My Device or Expo Go launch control again.

Avoid uninstalling Expo Go, clearing all browser data, or downloading unofficial apps to solve a first-run loading issue. Those actions rarely address the actual cause, which is usually a temporary connection delay or an incomplete Snack load.

---

Finish-line check

Before you end the session, confirm each statement:

• The provided starter project is open in Snack on the Moto G.
• You found the My Device or Expo Go launch option.
• Snack opened Expo Go, or Android allowed the browser to switch to Expo Go.
• Expo Go displayed the starter project on the phone.
• The project screen did not show a red error message.

---

You have now completed the essential phone-only development loop: Snack holds the project, and Expo Go runs it on your Android phone. A successful launch proves that your browser editor and Android preview environment can communicate.

Next, you will make your first controlled code change: replacing displayed text in the starter project and verifying that the updated wording appears in Expo Go.