Setting up your first React Native app using VS Code and Expo is a straightforward process, especially for beginners. Here's a step-by-step guide:

🔧 Prerequisites

Before you begin, install the following:

  1. Node.js: Download Node.js
  2. VS Code: Download VS Code
  3. Expo CLI: Will be installed via terminal/command prompt
  4. Expo Go App (on your mobile phone): Available in the App Store or Google Play

🚀 Step-by-Step Setup

1. Install Expo CLI

Open a terminal (Command Prompt, PowerShell, or Terminal on macOS):

npm install -g expo-cli

2. Create a New Project

npx create-expo-app MyFirstApp

This will prompt you to choose a template. You can choose the blank template (with or without TypeScript).

cd MyFirstApp

3. Open in VS Code

In the same terminal:

code .

This opens your project in VS Code.

4. Start the App

Run the development server:

npx expo start

It will open a browser tab with a QR code.

5. Run on Your Device

  • Open the Expo Go app on your mobile phone.
  • Scan the QR code from the browser.
  • The app will load on your phone!

✅ Alternatively, you can use an Android/iOS emulator if you’ve set one up.

🎨 File Structure Overview

MyFirstApp/
├── App.js         // Entry point
├── package.json   // Dependencies and scripts
├── node_modules/
└── ...

🛠️ Optional: Install Useful VS Code Extensions

  • ESLint – for JavaScript linting
  • Prettier – code formatting
  • React Native Tools – debugging and development support
  • Expo Tools – Expo-specific utilities

Would you like a sample App.js code to get started with a simple UI?