From 9fe54641c499bbbbb74b1a617d660d08d8da111b Mon Sep 17 00:00:00 2001 From: Website Deployment Script Date: Tue, 10 May 2016 20:30:56 +0000 Subject: [PATCH] Updated docs for 0.26 --- releases/0.26/docs/getting-started.html | 53 ++++++++++-------- .../0.26/docs/javascript-environment.html | 2 +- .../0.26/img/react-native-congratulations.png | Bin 0 -> 40338 bytes .../img/react-native-sorry-not-supported.png | Bin 0 -> 61409 bytes versions.html | 4 +- 5 files changed, 33 insertions(+), 26 deletions(-) create mode 100644 releases/0.26/img/react-native-congratulations.png create mode 100644 releases/0.26/img/react-native-sorry-not-supported.png diff --git a/releases/0.26/docs/getting-started.html b/releases/0.26/docs/getting-started.html index f2cbee16def..7f6eb50c1ac 100644 --- a/releases/0.26/docs/getting-started.html +++ b/releases/0.26/docs/getting-started.html @@ -26,12 +26,12 @@ block { display: none; } display: block; } Platform: -iOS -Android +iOS +Android OS: -Mac -Linux -Windows +Mac +Linux +Windows @@ -40,24 +40,26 @@ block { display: none; }

Unsupported #

Unfortunately, Apple only lets you develop for iOS on a Mac machine. Please check out the Android instructions instead.
-
+

Installation #

Required Prerequisites #

Homebrew #

Homebrew, in order to install the required NodeJS, in addition to some -recommended installs.

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

We recommend periodically running brew update && brew upgrade to keep your programs up-to-date.

Node #

Use Homebrew to install Node.js.

NodeJS 4.0 or greater is required for React Native. The default Homebrew package for Node is +recommended installs.

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Node #

Use Homebrew to install Node.js.

NodeJS 4.0 or greater is required for React Native. The default Homebrew package for Node is currently 6.0, so that is not an issue.

brew install node

React Native Command Line Tools #

The React Native command line tools allow you to easily create and initialize projects, etc.

npm install -g react-native-cli

If you see the error, EACCES: permission denied, please run the command: sudo npm install -g react-native-cli.

-

XCode #

Xcode 7.0 or higher. Open the App Store or go to https://developer.apple.com/xcode/downloads/. This will also install git as well.

+

Xcode #

Xcode 7.0 or higher. Open the App Store or go to https://developer.apple.com/xcode/downloads/. This will also install git as well.

-

Android Studio #

Android Studio 2.0 or higher. This will provide you -the Android SDK and emulator required to run and test your React Native apps.

Android Studio requires the Java Development Kit [JDK] 1.8 or higher. You can type +

Android Studio #

Android Studio 2.0 or higher.

Android Studio requires the Java Development Kit [JDK] 1.8 or higher. You can type javac -version to see what version you have, if any. If you do not meet the JDK requirement, you can -download it.

You will need to customize your installation:

  • Choose a Custom installation

custom installation

  • Choose both Performance and Android Virtual Device

additional installs

  • After installation, choose Configure | SDK Manager from the Android Studio welcome window.

configure sdk

  • In the SDK Platforms window, choose Show Package Details and under Android 6.0 (Marshmallow), make sure that Google APIs, Intel x86 Atom System Image, Intel x86 Atom_64 System Image, and Google APIs Intel x86 Atom_64 System Image are checked.

platforms

  • In the SDK Tools window, choose Show Package Details and under Android SDK Build Tools, make sure that Android SDK Build-Tools 23.0.1 is selected.

build tools

ANDROID_HOME Environment Variable #

Ensure the ANDROID_HOME environment variable points to your existing Android SDK. To do that, add +download it.

Android Studio will provide you the Android SDK and emulator required to run and test your React +Native apps.

Unless otherwise mentioned, keep all the setup defaults intact. For example, the +Android Support Repository is installed automatically with Android Studio, and we need that +for React Native.

You will need to customize your installation:

custom installation

additional installs

configure sdk

platforms

build tools

ANDROID_HOME Environment Variable #

Ensure the ANDROID_HOME environment variable points to your existing Android SDK. To do that, add this to your ~/.bashrc, ~/.bash_profile (or whatever your shell uses) and re-open your terminal:

# If you installed the SDK without Android Studio, then it may be something like: # /usr/local/opt/android-sdk export ANDROID_HOME=~/Library/Android/sdk
@@ -69,11 +71,11 @@ Flow as part of your codebase).

brew i

Add Android Tools Directory to your PATH #

You can add the Android tools directory on your PATH in case you need to run any of the Android tools from the command line such as android avd. In your ~/.bash or ~/.bash_profile:

# Your exact string here may be different. PATH="~/Library/Android/sdk/tools:~/Library/Android/sdk/platform-tools:${PATH}" -export PATH

Gradle Daemon #

Enable Gradle Daemon which greatly improves incremental build times for changes in java code.

Other Optional Installs #

Git #

Git version control. If you have installed XCode, Git is +export PATH

Gradle Daemon #

Enable Gradle Daemon which greatly improves incremental build times for changes in java code.

Other Optional Installs #

Git #

Git version control. If you have installed Xcode, Git is already installed, otherwise run the following:

brew install git
-

Nuclide #

[Nuclide] is an IDE from Facebook providing a first-class development environment for writing, -running and +

Nuclide #

Nuclide is an IDE from Facebook providing a first-class development environment +for writing, running and debugging React Native applications.

Get started with Nuclide here.

@@ -104,13 +106,15 @@ sudo ln -s /

Fire up the Termimal and use Chocolatey to install NodeJS.

choco install nodejs.install

React Native Command Line Tools #

The React Native command line tools allow you to easily create and initialize projects, etc.

npm install -g react-native-cli

If you see the error, EACCES: permission denied, please run the command: -sudo npm install -g react-native-cli.

Android Studio #

Android Studio 2.0 or higher. This will provide you -the Android SDK and emulator required to run and test your React Native apps.

Android Studio requires the Java Development Kit [JDK] 1.8 or higher. You can type +sudo npm install -g react-native-cli.

Android Studio #

Android Studio 2.0 or higher.

Android Studio requires the Java Development Kit [JDK] 1.8 or higher. You can type javac -version to see what version you have, if any. If you do not meet the JDK requirement, you can download it, or use a pacakage manager to install it (e.g. choco install jdk8, -apt-get install default-jdk).

+apt-get install default-jdk).

Android Studio will provide you the Android SDK and emulator required to run and test your React +Native apps.

Unless otherwise mentioned, keep all the setup defaults intact. For example, the +Android Support Repository is installed automatically with Android Studio, and we need that +for React Native.

You will need to customize your installation:

custom installation

additional installs

@@ -170,7 +174,7 @@ improves incremental build times for changes in java code.

Add Android Tools Directory to your PATH #

You can add the Android tools directory on your PATH in case you need to run any of the Android tools from the command line such as android avd.

-

In your ~/.bash or ~/.bash_profile:

# Your exact string here may be different. +

In your ~/.bashrc or ~/.bash_profile:

# Your exact string here may be different. PATH="~/Android/Sdk/tools:~/Android/Sdk/platform-tools:${PATH}" export PATH
@@ -240,20 +244,23 @@ folder in Nuclide and
  • Open index.ios.js in your text editor of choice (e.g. Nuclide) and edit some lines.
  • Hit ⌘-R in your iOS simulator to reload the app and see your change!
-
  • Press the R key twice OR open the menu (F2 by default, or ⌘-M in Genymotion) and select Reload JS to see your change!
  • Run adb logcat *:S ReactNative:V ReactNativeJS:V in a terminal to see your app's logs
+
  • Open index.android.js in your text editor of choice (e.g. Nuclide) and edit some lines.
  • Press the R key twice OR open the menu (F2 by default, or ⌘-M in Genymotion) and select Reload JS to see your change!
  • Run adb logcat *:S ReactNative:V ReactNativeJS:V in a terminal to see your app's logs
-

That's It #

Congratulations! You've successfully run and modified your first React Native app.

+

That's It #

Congratulations! You've successfully run and modified your first React Native app.

Testing Installation #

react-native init AwesomeProject cd AwesomeProject -react-native run-android
+react-native run-android
-

Troubleshooting Run #

A common issue on Windows is that the packager is not started automatically when you run +

Troubleshooting Run #

A common issue is that the packager is not started automatically when you run react-native run-android. You can start it manually using:

cd AwesomeProject -react-native start

Or if you hit a ERROR Watcher took too long to load on Windows, try increasing the timeout in this file (under your node_modules/react-native/).

Modifying Project #

Now that you successfully started the project, let's modify it:

  • Press the R key twice OR open the menu (F2 by default, or ⌘-M in Genymotion) and select Reload JS to see your change!
  • Run adb logcat *:S ReactNative:V ReactNativeJS:V in a terminal to see your app's logs

That's It #

Congratulations! You've successfully run and modified your first React Native app.

+react-native start +

Or if you hit a ERROR Watcher took too long to load on Windows, try increasing the timeout in this file (under your node_modules/react-native/).

+ +

Modifying Project #

Now that you successfully started the project, let's modify it:

  • Open index.android.js in your text editor of choice (e.g. Nuclide) and edit some lines.
  • Press the R key twice OR open the menu (F2 by default, or ctrl-M in the emulator) and select Reload JS to see your change!
  • Run adb logcat *:S ReactNative:V ReactNativeJS:V in a terminal to see your app's logs

That's It #

Congratulations! You've successfully run and modified your first React Native app.

 diff --git a/releases/0.26/docs/javascript-environment.html b/releases/0.26/docs/javascript-environment.html index edce764d981..83ae222e006 100644 --- a/releases/0.26/docs/javascript-environment.html +++ b/releases/0.26/docs/javascript-environment.html @@ -1,4 +1,4 @@ -JavaScript Environment – React Native | A framework for building native apps using React
React Native0.26

Quick Start

Community Resources

Guides

Guides (iOS)

Guides (Android)

components

apis

Polyfills

JavaScript Environment #

Edit on GitHub

JavaScript Runtime #

When using React Native, you're going to be running your JavaScript code in two environments:

  • On iOS simulators and devices, Android emulators and devices React Native uses JavaScriptCore which is the JavaScript engine that powers Safari. On iOS JSC doesn't use JIT due to the absence of writable executable memory in iOS apps.
  • When using Chrome debugging, it runs all the JavaScript code within Chrome itself and communicates with native code via WebSocket. So you are using V8.

While both environments are very similar, you may end up hitting some inconsistencies. We're likely going to experiment with other JS engines in the future, so it's best to avoid relying on specifics of any runtime.

JavaScript Syntax Transformers #

Syntax transformers make writing code more enjoyable by allowing you to use new JavaScript syntax without having to wait for support on all interpreters.

As of version 0.5.0, React Native ships with the Babel JavaScript compiler. Check Babel documentation on its supported transformations for more details.

Here's a full list of React Native's enabled transformations.

ES5

  • Reserved Words: promise.catch(function() { });

ES6

ES7

Specific

  • JSX: <View style={{color: 'red'}} />
  • Flow: function foo(x: ?number): string {}

Polyfills #

Many standards functions are also available on all the supported JavaScript runtimes.

Browser

ES6

ES7

Specific

  • __DEV__
Next →
© 2016 Facebook Inc.
React Native0.26

Quick Start

Community Resources

Guides

Guides (iOS)

Guides (Android)

components

apis

Polyfills

JavaScript Environment #

Edit on GitHub

JavaScript Runtime #

When using React Native, you're going to be running your JavaScript code in two environments:

  • On iOS simulators and devices, Android emulators and devices React Native uses JavaScriptCore which is the JavaScript engine that powers Safari. On iOS JSC doesn't use JIT due to the absence of writable executable memory in iOS apps.
  • When using Chrome debugging, it runs all the JavaScript code within Chrome itself and communicates with native code via WebSocket. So you are using V8.

While both environments are very similar, you may end up hitting some inconsistencies. We're likely going to experiment with other JS engines in the future, so it's best to avoid relying on specifics of any runtime.

JavaScript Syntax Transformers #

Syntax transformers make writing code more enjoyable by allowing you to use new JavaScript syntax without having to wait for support on all interpreters.

As of version 0.5.0, React Native ships with the Babel JavaScript compiler. Check Babel documentation on its supported transformations for more details.

Here's a full list of React Native's enabled transformations.

ES5

  • Reserved Words: promise.catch(function() { });

ES6

ES7

Specific

  • JSX: <View style={{color: 'red'}} />
  • Flow: function foo(x: ?number): string {}

Polyfills #

Many standards functions are also available on all the supported JavaScript runtimes.

Browser

ES6

ES7

Specific

  • __DEV__
Next →
© 2016 Facebook Inc.
React Nativenext

React Native Versions

React Native is following a 2-week train release. Every two weeks, a Release Candidate (rc) branch is created off of master and the previous rc branch is being officially released.

masterDocs
0.26-rcDocsRelease Notes
(current) 0.25DocsRelease Notes
0.24DocsRelease Notes
0.23DocsRelease Notes
0.22DocsRelease Notes
0.21DocsRelease Notes
0.20DocsRelease Notes
0.19DocsRelease Notes
0.18DocsRelease Notes
© 2016 Facebook Inc.
React Native0.26

React Native Versions

React Native is following a 2-week train release. Every two weeks, a Release Candidate (rc) branch is created off of master and the previous rc branch is being officially released.

masterDocs
0.26-rcDocsRelease Notes
(current) 0.25DocsRelease Notes
0.24DocsRelease Notes
0.23DocsRelease Notes
0.22DocsRelease Notes
0.21DocsRelease Notes
0.20DocsRelease Notes
0.19DocsRelease Notes
0.18DocsRelease Notes
© 2016 Facebook Inc.
\ No newline at end of file