From fd49ced5bee3c760cc68aebf8cb02147b746c4f0 Mon Sep 17 00:00:00 2001 From: Bartosz Kaszubowski Date: Mon, 27 Jul 2020 16:19:39 +0200 Subject: [PATCH 1/2] fix Environment Setup page sections, backport all the changes to 0.63 --- docs/getting-started.md | 27 +---------- .../version-0.63/getting-started.md | 46 ++++++------------- 2 files changed, 16 insertions(+), 57 deletions(-) diff --git a/docs/getting-started.md b/docs/getting-started.md index e6033e84431..03e5ff6827e 100644 --- a/docs/getting-started.md +++ b/docs/getting-started.md @@ -185,18 +185,15 @@ React Native also requires [Java SE Development Kit (JDK)](https://openjdk.java. Open an Administrator Command Prompt (right click Command Prompt and select "Run as Administrator"), then run the following command: ```powershell -choco install -y nodejs.install python2 openjdk8 +choco install -y nodejs.install python2 openjdk8 ``` If you have already installed Node on your system, make sure it is Node 10 or newer. If you already have a JDK on your system, make sure it is version 8 or newer. > You can find additional installation options on [Node's Downloads page](https://nodejs.org/en/download/). - > If you're using the latest version of Java Development Kit, you'll need to change the Gradle version of your project so it can recognize the JDK. You can do that by going to `{project root folder}\android\gradle\wrapper\gradle-wrapper.properties` and changing the `distributionUrl` value to upgrade the Gradle version. You can check out [here the lastest releases of Gradle](https://gradle.org/releases/). - -

Xcode & CocoaPods

@@ -344,7 +341,7 @@ The SDK is installed, by default, at the following location: %LOCALAPPDATA%\Android\Sdk ``` -You can find the actual location of the SDK in the Android Studio "Preferences" dialog, under **Appearance & Behavior** → **System Settings** → **Android SDK**. +You can find the actual location of the SDK in the Android Studio "Settings" dialog, under **Appearance & Behavior** → **System Settings** → **Android SDK**. Open a new Command Prompt window to ensure the new environment variable is loaded before proceeding to the next step. @@ -493,16 +490,6 @@ npx react-native start > If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project. - - -> Metro is a lot like webpack—for React Native apps. - - - -> Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more JavaScript. - - -

Step 2: Start your application

Let Metro Bundler run in its own terminal. Open a new terminal inside your React Native project folder. Run the following: @@ -541,16 +528,6 @@ npx react-native start > If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project. - - -> Metro is a lot like webpack—for React Native apps. - - - -> Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more JavaScript. - - -

Step 2: Start your application

Let Metro Bundler run in its own terminal. Open a new terminal inside your React Native project folder. Run the following: diff --git a/website/versioned_docs/version-0.63/getting-started.md b/website/versioned_docs/version-0.63/getting-started.md index b0a159e51a6..b148f4029b9 100644 --- a/website/versioned_docs/version-0.63/getting-started.md +++ b/website/versioned_docs/version-0.63/getting-started.md @@ -153,7 +153,7 @@ brew install node brew install watchman ``` -If you have already installed Node on your system, make sure it is Node 8.3 or newer. +If you have already installed Node on your system, make sure it is Node 10 or newer. [Watchman](https://facebook.github.io/watchman) is a tool by Facebook for watching changes in the filesystem. It is highly recommended you install it for better performance. @@ -173,7 +173,7 @@ If you have already installed JDK on your system, make sure it is JDK 8 or newer

Node

-Follow the [installation instructions for your Linux distribution](https://nodejs.org/en/download/package-manager/) to install Node 8.3 or newer. +Follow the [installation instructions for your Linux distribution](https://nodejs.org/en/download/package-manager/) to install Node 10 or newer. @@ -181,18 +181,20 @@ Follow the [installation instructions for your Linux distribution](https://nodej We recommend installing Node and Python2 via [Chocolatey](https://chocolatey.org), a popular package manager for Windows. -React Native also requires a recent version of the [Java SE Development Kit (JDK)](http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html), as well as Python 2. Both can be installed using Chocolatey. +React Native also requires [Java SE Development Kit (JDK)](https://openjdk.java.net/projects/jdk8/), as well as Python2. Both can be installed using Chocolatey. Open an Administrator Command Prompt (right click Command Prompt and select "Run as Administrator"), then run the following command: ```powershell -choco install -y nodejs.install python2 jdk8 +choco install -y nodejs.install python2 openjdk8 ``` -If you have already installed Node on your system, make sure it is Node 8.3 or newer. If you already have a JDK on your system, make sure it is version 8 or newer. +If you have already installed Node on your system, make sure it is Node 10 or newer. If you already have a JDK on your system, make sure it is version 8 or newer. > You can find additional installation options on [Node's Downloads page](https://nodejs.org/en/download/). +> If you're using the latest version of Java Development Kit, you'll need to change the Gradle version of your project so it can recognize the JDK. You can do that by going to `{project root folder}\android\gradle\wrapper\gradle-wrapper.properties` and changing the `distributionUrl` value to upgrade the Gradle version. You can check out [here the lastest releases of Gradle](https://gradle.org/releases/). +

Xcode & CocoaPods

@@ -227,7 +229,7 @@ For more information, please visit [CocoaPods Getting Started guide](https://gui

Java Development Kit

-React Native requires version 8 of the Java SE Development Kit (JDK). You may download and install [OpenJDK](http://openjdk.java.net) from [AdoptOpenJDK](https://adoptopenjdk.net/) or your system packager. You may also [Download and install Oracle JDK 8](http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html) if desired. +React Native requires at least the version 8 of the Java SE Development Kit (JDK). You may download and install [OpenJDK](http://openjdk.java.net) from [AdoptOpenJDK](https://adoptopenjdk.net/) or your system packager. You may also [Download and install Oracle JDK 14](https://www.oracle.com/java/technologies/javase-jdk14-downloads.html) if desired. @@ -239,7 +241,7 @@ Setting up your development environment can be somewhat tedious if you're new to

1. Install Android Studio

-[Download and install Android Studio](https://developer.android.com/studio/index.html). Choose a "Custom" setup when prompted to select an installation type. Make sure the boxes next to all of the following are checked: +[Download and install Android Studio](https://developer.android.com/studio/index.html). While on Android Studio intallation wizard, make sure the boxes next to all of the following items are checked: @@ -266,7 +268,7 @@ Once setup has finalized and you're presented with the Welcome screen, proceed t Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the `Android 10 (Q)` SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio. -The SDK Manager can be accessed from the "Welcome to Android Studio" screen. Click on "Configure", then select "SDK Manager". +To do that, open Android Studio, click on "Configure" button and select "SDK Manager". @@ -321,7 +323,7 @@ export PATH=$PATH:$ANDROID_HOME/platform-tools > `.bash_profile` is specific to `bash`. If you're using another shell, you will need to edit the appropriate shell-specific config file. -Type `source $HOME/.bash_profile` to load the config into your current shell. Verify that ANDROID_HOME has been added to your path by running `echo $PATH`. +Type `source $HOME/.bash_profile` for `bash` or `source $HOME/.zprofile` to load the config into your current shell. Verify that ANDROID_HOME has been set by running `echo $ANDROID_HOME` and the appropriate directories have been added to your path by running `echo $PATH`. > Please make sure you use the correct Android SDK path. You can find the actual location of the SDK in the Android Studio "Preferences" dialog, under **Appearance & Behavior** → **System Settings** → **Android SDK**. @@ -337,10 +339,10 @@ Type `source $HOME/.bash_profile` to load the config into your current shell. Ve The SDK is installed, by default, at the following location: ```powershell -c:\Android\tools\bin +%LOCALAPPDATA%\Android\Sdk ``` -You can find the actual location of the SDK in the Android Studio "Preferences" dialog, under **Appearance & Behavior** → **System Settings** → **Android SDK**. +You can find the actual location of the SDK in the Android Studio "Settings" dialog, under **Appearance & Behavior** → **System Settings** → **Android SDK**. Open a new Command Prompt window to ensure the new environment variable is loaded before proceeding to the next step. @@ -360,7 +362,7 @@ Open a new Command Prompt window to ensure the new environment variable is loade The default location for this folder is: ```powershell -C:\Android\tools\bin\platform-tools +%LOCALAPPDATA%\Android\Sdk\platform-tools ``` @@ -489,16 +491,6 @@ npx react-native start > If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project. - - -> Metro is a lot like webpack—for React Native apps. - - - -> Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more JavaScript. - - -

Step 2: Start your application

Let Metro Bundler run in its own terminal. Open a new terminal inside your React Native project folder. Run the following: @@ -537,16 +529,6 @@ npx react-native start > If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project. - - -> Metro is a lot like webpack—for React Native apps. - - - -> Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more JavaScript. - - -

Step 2: Start your application

Let Metro Bundler run in its own terminal. Open a new terminal inside your React Native project folder. Run the following: From 768d0aa8d00d9a1904ae161d249798726d011394 Mon Sep 17 00:00:00 2001 From: Bartosz Kaszubowski Date: Wed, 29 Jul 2020 00:48:00 +0200 Subject: [PATCH 2/2] revert notes as a single block --- docs/getting-started.md | 4 ++++ website/versioned_docs/version-0.63/getting-started.md | 4 ++++ 2 files changed, 8 insertions(+) diff --git a/docs/getting-started.md b/docs/getting-started.md index 03e5ff6827e..805c2e5b83b 100644 --- a/docs/getting-started.md +++ b/docs/getting-started.md @@ -490,6 +490,8 @@ npx react-native start > If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project. +> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more JavaScript. +

Step 2: Start your application

Let Metro Bundler run in its own terminal. Open a new terminal inside your React Native project folder. Run the following: @@ -528,6 +530,8 @@ npx react-native start > If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project. +> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more JavaScript. +

Step 2: Start your application

Let Metro Bundler run in its own terminal. Open a new terminal inside your React Native project folder. Run the following: diff --git a/website/versioned_docs/version-0.63/getting-started.md b/website/versioned_docs/version-0.63/getting-started.md index b148f4029b9..a26da6cae83 100644 --- a/website/versioned_docs/version-0.63/getting-started.md +++ b/website/versioned_docs/version-0.63/getting-started.md @@ -491,6 +491,8 @@ npx react-native start > If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project. +> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more JavaScript. +

Step 2: Start your application

Let Metro Bundler run in its own terminal. Open a new terminal inside your React Native project folder. Run the following: @@ -529,6 +531,8 @@ npx react-native start > If you use the Yarn package manager, you can use `yarn` instead of `npx` when running React Native commands inside an existing project. +> If you're familiar with web development, Metro is a lot like webpack—for React Native apps. Unlike Kotlin or Java, JavaScript isn't compiled—and neither is React Native. Bundling isn't the same as compiling, but it can help improve startup performance and translate some platform-specific JavaScript into more JavaScript. +

Step 2: Start your application

Let Metro Bundler run in its own terminal. Open a new terminal inside your React Native project folder. Run the following: