Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save codingthefuturewithai/8d1b10f0256b3aaa454b3625eace9b21 to your computer and use it in GitHub Desktop.
Save codingthefuturewithai/8d1b10f0256b3aaa454b3625eace9b21 to your computer and use it in GitHub Desktop.
Dev Env Setup for YouTube video: "Continue and Claude 3.5: Develop a Mobile App Without Writing ANY Code!"

Dev Setup

NOTE: If you ever run into development setup issues, I recommend using your AI chatbots to help you out. Once you explain what you’re trying to do and what OS you’re on, they’re usually very good at providing very detailed step-by-step guidance.

API Keys (needed regardless of your OS)

You will need accounts and API keys for both of the below:

!!READ THIS Before Starting the below Setup Procedures

  • The below setups allow you to create and work on React Native projects using Expo.
  • You have the flexibility to test your apps on either physical devices or desktop simulators.
  • The Expo Go app provides a quick way to test on physical devices without additional setup.
  • Using simulators allows you to test your app directly on your desktop, which can be convenient during development.
  • If you choose to use simulators, you'll need to install additional software (Xcode for iOS or Android Studio for Android), which requires more disk space and setup time.
  • Although you can use Android emulators on Windows machines, my experience has been that, unless you have a somewhat decent GPU/graphics card, the Android emulators can be very slow.
  • The Expo setup guide provides customized instructions based on your specific development environment and needs.

For more detailed information on the Expo development workflow, refer to:

Mac Setup

  1. Install Node.js and npm:

  2. Install Watchman:

    • Open Terminal and run:

      brew install watchman
      
    • If you don't have Homebrew, install it first from https://brew.sh/

  3. Install Expo CLI:

    • In Terminal, run:

      npm install -g expo-cli
      
  4. Install VS Code:

  5. Install React Native extensions for VS Code:

    • Open VS Code
    • Go to the Extensions view (Cmd+Shift+X)
    • Search for and install these extensions:
      • React Native Tools (by Microsoft)
      • React-Native/React/Redux snippets for es6/es7 (by EQuimper)
      • Continue (by continue.dev)
  6. Choose your preferred method for running and testing your app:

    Option A: Using a physical device with Expo Go

    Option B: Using desktop simulators

    • If you prefer to run your app on your desktop using simulators, you'll need to set up the necessary phone simulation software.
    • Visit the Expo setup guide: https://docs.expo.dev/get-started/set-up-your-environment/
    • The guide will then provide you with step-by-step instructions tailored to your OS and desired development method, including how to install Xcode (for iOS simulation) or Android Studio (for Android simulation).

Windows Setup

  1. Install Node.js and npm:

  2. Install Expo CLI:

    • Open Command Prompt and run:
    npm install -g expo-cli
    
  3. Install VS Code:

  4. Install React Native extensions for VS Code:

    • Open VS Code
    • Go to the Extensions view (Ctrl+Shift+X)
    • Search for and install these extensions:
      • React Native Tools (by Microsoft)
      • React-Native/React/Redux snippets for es6/es7 (by EQuimper)
      • Continue (by continue.dev)
  5. Choose your preferred method for running and testing your app:

    Option A: Using a physical device with Expo Go

    Option B: Using desktop simulators

    • If you prefer to run your app on your desktop using simulators, you'll need to set up the necessary phone simulation software.
    • Visit the Expo setup guide: https://docs.expo.dev/get-started/set-up-your-environment/
    • The guide will then provide you with step-by-step instructions tailored to your OS and desired development method, including how to install Android Studio for Android simulation.

Note: iOS simulation is not available on Windows. If you need to test iOS apps, you'll need to use a physical iOS device or use a Mac for development.

Linux Setup (Debian-based Systems)

  1. Install Node.js and npm:

    • Open a terminal and run the following commands:
    curl -fsSL <https://deb.nodesource.com/setup_lts.x> | sudo -E bash -
    sudo apt-get install -y nodejs
    
    • This installs the latest LTS version of Node.js and npm
  2. Install Watchman:

  3. Install Expo CLI:

    • In the terminal, run:
    sudo npm install -g expo-cli
    
  4. Install VS Code:

    sudo dpkg -i <path-to-downloaded-file>.deb
    
  5. Install React Native extensions for VS Code:

    • Open VS Code
    • Go to the Extensions view (Ctrl+Shift+X)
    • Search for and install these extensions:
      • React Native Tools (by Microsoft)
      • React-Native/React/Redux snippets for es6/es7 (by EQuimper)
      • Continue (by continue.dev)
  6. Choose your preferred method for running and testing your app:

    Option A: Using a physical device with Expo Go

    Option B: Using desktop simulators

    • If you prefer to run your app on your desktop using simulators, you'll need to set up the necessary phone simulation software.
    • Visit the Expo setup guide: https://docs.expo.dev/get-started/set-up-your-environment/
    • The guide will then provide you with step-by-step instructions tailored to your OS and desired development method, including how to install Android Studio for Android simulation.

Note: iOS simulation is not available on Linux. If you need to test iOS apps, you'll need to use a physical iOS device or use a Mac for development.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment