Skip to content

Latest commit

 

History

History
163 lines (106 loc) · 6.37 KB

SETUP_WINDOWS.md

File metadata and controls

163 lines (106 loc) · 6.37 KB
Raw

Windows Setup

This will take 1 hour or longer depending on Internet and your laptop speed.

In a nutshell, these are the steps:

  • Install react native pre-requisites for Windows
  • Run HelloWorld React Native app on an Android device
  • Run Code & Robots app on an Android device

Troubleshooting

There are quite a few gotchas when setting up right now. We're working towards a better experience to get started but it's best if you visit the Troubleshooting guide before starting and refer to it if you run into problems. For further support, send an email to [email protected].

Install react native pre-requisites

I would recommend you follow the steps below. Alternatively you can follow the React Native getting started docs instead.

So grab a coffee ☕ and let's get started.

Open an Administrator Command Prompt

When running the below steps in a command prompt, it's best to do it as an Administrator.

  1. To open an Administrator Command Prompt

Install Chocolatey

  1. Open an Administrator Command Prompt

  2. Install chocolatey (popular package manager for Windows - see https://chocolatey.org/install)

    • @"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"

Install Node, Python2, JDK8, Yarn and Git using Chocolatey

This will take up to 5 mins or longer to complete.

  1. Open an Administrator Command Prompt

  2. Install Node, Python2, JDK8, Yarn and Git

    • choco install -y nodejs.install python2 jdk8 yarn git

  3. Refresh env in your command prompt (important!)

    • refreshenv

Install React Native command line interface (CLI)

  1. Open an Administrator Command Prompt

  2. Install the React Native CLI

    • npm install -g react-native-cli

Install and Setup Android Studio

This will take up to 20 mins or longer to complete.

  1. Download and install Android Studio (1gb download)

  2. Install Android Studio (it will use 3gb of space)

  3. Click Finish, then start and setup Android Studio (it will use 1gb of space)

    • Choose 'Do not import settings' if you don't have an Android Studio config that you can copy from another laptop
    • Choose 'Standard' setup

Configure the ANDROID_HOME system environment variable

  1. Open a Administrator Command Prompt and get your username

    • echo %username%

  2. Get the path to the Android SDK

    • Copy C:\Users\YOUR_USERNAME\AppData\Local\Android\Sdk and replace YOUR_USERNAME with your username from Step 1

  3. Add ANDROID_HOME system environment variable

    • Search "Edit system", click "Edit the system environment variables", click on "Environment Variables"
    • Click New under the System variables section (NOT the User variables section)
    • Set ANDROID_HOME as the Variable name
    • Paste the path to the Android SDK from Step 2 as the Variable value
    • Click OK

  4. Refresh env in your command prompt (important!)

    • refreshenv

  5. Check that ANDROID_HOME is set correctly

    • echo %ANDROID_HOME%

Add Android SDK platform tools to Path user environment variable

  1. Open a Administrator Command Prompt and get your username

    • echo %username%

  2. Get the path to the Android SDK platform tools

    • Copy C:\Users\YOUR_USERNAME\AppData\Local\Android\Sdk\platform-tools and replace YOUR_USERNAME with your username from Step 1

  3. Edit Path user environment variable and add the Android SDK platform tools path

    • Search "Edit system", click "Edit the system environment variables", click on "Environment Variables"
    • Select "Path" under the User variables section (NOT the System variables section) and click on Edit
    • Click New
    • Paste the path to the Android SDK platform tools from Step 2
    • Click OK

  4. Refresh env in your command prompt (important!)

    • refreshenv

  5. Check adb (e.g. a useful Android platform tool) is available

    • adb version

Accept Android SDK licenses

  1. Open a Administrator Command Prompt

  2. Accept Android SDK licenses

    • cd "%ANDROID_HOME%"\tools\bin
    • sdkmanager --licenses
    • Accept the licenses

Run HelloWorld React Native app

Time to test that React Native works on a real Android device.

Hint: You can also test on a virtual device, see https://developer.android.com/studio/run/managing-avds.html.

  1. Open a Administrator Command Prompt

  2. Create the HelloWorld project

    • cd C:\Users\%username%
    • react-native init HelloWorld

  3. Enable developer options on your Android device (See https://developer.android.com/studio/debug/dev-options#enable)

    • Open the Settings app on your device
    • Select System (Only on Android 8.0 or higher)
    • Scroll to the bottom and select About phone
    • Scroll to the bottom and tap Build number 7 times
    • Return to the previous screen, scroll down and select Developer options
    • Scroll down a little and enable USB debugging

  4. Connect your Android device via USB to your laptop

The next step will take a few minutes, make sure to click "Allow Access" if asked to by a Firewall popup.

  1. Install and run the app on your Android device
    • cd HelloWorld
    • react-native run-android

HelloWorld React Native app troubleshooting

Device is UNAUTHORIZED

If you see the error "Device is UNAUTHORIZED", make sure to click OK when the popup "Allow USB debugging" shows on your device.

To check to see if your device is connected and authorized:

  • adb devices

Run the Code & Robots app

Follow the instructions in https://github.com/codeandrobots/codeandrobots-app#arrow_up-how-to-setup, i.e:

  • cd C:\Users\%username%
  • git clone https://github.com/codeandrobots/codeandrobots-app.git
  • yarn install --ignore-engines
  • copy .env.example .env
  • react-native run-android --variant=devDebug