diff --git a/packages/react-navigation/README.md b/packages/react-navigation/README.md
index ff015b37..d6392aa8 100644
--- a/packages/react-navigation/README.md
+++ b/packages/react-navigation/README.md
@@ -3,7 +3,7 @@
*Learn once, navigate anywhere.*
-Browse the docs on [reactnavigation.org](https://reactnavigation.org/).
+Browse the docs on [reactnavigation.org](https://reactnavigation.org/) or try it out on [our expo demo](https://exp.host/@react-navigation/NavigationPlayground).
## Motivation
diff --git a/packages/react-navigation/circle.yml b/packages/react-navigation/circle.yml
index 76182379..618f58c4 100644
--- a/packages/react-navigation/circle.yml
+++ b/packages/react-navigation/circle.yml
@@ -21,7 +21,12 @@ jobs:
- deploy:
command: |
if [ "${CIRCLE_BRANCH}" == "master" ]; then
+ # deploy website
cd website && yarn && cd ../
yarn run build-docs
./scripts/deploy-website.sh
+
+ # deploy expo playground demo
+ yarn global add exp && exp login -u "$EXPO_USERNAME" -p "$EXPO_PASSWORD"
+ cd examples/ExpoNavigationPlayground && npm install && exp publish
fi
diff --git a/packages/react-navigation/docs/api/navigators/DrawerNavigator.md b/packages/react-navigation/docs/api/navigators/DrawerNavigator.md
index b419eeec..d25c7867 100644
--- a/packages/react-navigation/docs/api/navigators/DrawerNavigator.md
+++ b/packages/react-navigation/docs/api/navigators/DrawerNavigator.md
@@ -1,6 +1,6 @@
# DrawerNavigator
-Used to easily set up a screen with a drawer navigation.
+Used to easily set up a screen with a drawer navigation. For a live example please see [our expo demo](https://exp.host/@react-navigation/NavigationPlayground).
```js
class MyHomeScreen extends React.Component {
diff --git a/packages/react-navigation/docs/api/navigators/StackNavigator.md b/packages/react-navigation/docs/api/navigators/StackNavigator.md
index f09ac168..1f8852ec 100644
--- a/packages/react-navigation/docs/api/navigators/StackNavigator.md
+++ b/packages/react-navigation/docs/api/navigators/StackNavigator.md
@@ -164,3 +164,5 @@ The navigator component created by `StackNavigator(...)` takes the following pro
### Examples
See the examples [SimpleStack.js](https://github.com/react-community/react-navigation/tree/master/examples/NavigationPlayground/js/SimpleStack.js) and [ModalStack.js](https://github.com/react-community/react-navigation/tree/master/examples/NavigationPlayground/js/ModalStack.js) which you can run locally as part of the [NavigationPlayground](https://github.com/react-community/react-navigation/tree/master/examples/NavigationPlayground) app.
+
+You can view these examples directly on your phone by visiting [our expo demo](https://exp.host/@react-navigation/NavigationPlayground).
diff --git a/packages/react-navigation/docs/api/navigators/TabNavigator.md b/packages/react-navigation/docs/api/navigators/TabNavigator.md
index bdde081d..d48c960e 100644
--- a/packages/react-navigation/docs/api/navigators/TabNavigator.md
+++ b/packages/react-navigation/docs/api/navigators/TabNavigator.md
@@ -1,6 +1,6 @@
# TabNavigator
-Used to easily set up a screen with several tabs with a TabRouter.
+Used to easily set up a screen with several tabs with a TabRouter. For a live example please see [our expo demo](https://exp.host/@react-navigation/NavigationPlayground).
```js
class MyHomeScreen extends React.Component {
diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/.babelrc b/packages/react-navigation/examples/ExpoNavigationPlayground/.babelrc
new file mode 100644
index 00000000..2bcd546d
--- /dev/null
+++ b/packages/react-navigation/examples/ExpoNavigationPlayground/.babelrc
@@ -0,0 +1,8 @@
+{
+ "presets": ["babel-preset-expo"],
+ "env": {
+ "development": {
+ "plugins": ["transform-react-jsx-source"]
+ }
+ }
+}
diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/.gitignore b/packages/react-navigation/examples/ExpoNavigationPlayground/.gitignore
new file mode 100644
index 00000000..9f9e17e0
--- /dev/null
+++ b/packages/react-navigation/examples/ExpoNavigationPlayground/.gitignore
@@ -0,0 +1,3 @@
+node_modules/**/*
+.expo/*
+npm-debug.*
diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/.watchmanconfig b/packages/react-navigation/examples/ExpoNavigationPlayground/.watchmanconfig
new file mode 100644
index 00000000..0967ef42
--- /dev/null
+++ b/packages/react-navigation/examples/ExpoNavigationPlayground/.watchmanconfig
@@ -0,0 +1 @@
+{}
diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/assets/icons/react-navigation.png b/packages/react-navigation/examples/ExpoNavigationPlayground/assets/icons/react-navigation.png
new file mode 100644
index 00000000..9f56a231
Binary files /dev/null and b/packages/react-navigation/examples/ExpoNavigationPlayground/assets/icons/react-navigation.png differ
diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/exp.json b/packages/react-navigation/examples/ExpoNavigationPlayground/exp.json
new file mode 100644
index 00000000..d6c76fd6
--- /dev/null
+++ b/packages/react-navigation/examples/ExpoNavigationPlayground/exp.json
@@ -0,0 +1,24 @@
+{
+ "name": "NavigationPlayground",
+ "description": "Try out react-navigation now with this awesome playground",
+ "slug": "NavigationPlayground",
+ "privacy": "public",
+ "sdkVersion": "16.0.0",
+ "version": "1.0.0",
+ "orientation": "portrait",
+ "primaryColor": "#cccccc",
+ "icon": "./assets/icons/react-navigation.png",
+ "loading": {
+ "icon": "./assets/icons/react-navigation.png",
+ "hideExponentText": false
+ },
+ "packagerOpts": {
+ "assetExts": [
+ "ttf",
+ "mp4"
+ ]
+ },
+ "ios": {
+ "supportsTablet": true
+ }
+}
diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/main.js b/packages/react-navigation/examples/ExpoNavigationPlayground/main.js
new file mode 100644
index 00000000..4739b277
--- /dev/null
+++ b/packages/react-navigation/examples/ExpoNavigationPlayground/main.js
@@ -0,0 +1,4 @@
+import Expo from 'expo';
+import App from 'NavigationPlayground/js/App';
+
+Expo.registerRootComponent(App);
diff --git a/packages/react-navigation/examples/ExpoNavigationPlayground/package.json b/packages/react-navigation/examples/ExpoNavigationPlayground/package.json
new file mode 100644
index 00000000..e1813dbb
--- /dev/null
+++ b/packages/react-navigation/examples/ExpoNavigationPlayground/package.json
@@ -0,0 +1,14 @@
+{
+ "name": "ExpoNavigationPlayground",
+ "version": "0.0.0",
+ "description": "Hello Expo!",
+ "author": null,
+ "private": true,
+ "main": "main.js",
+ "dependencies": {
+ "expo": "16.0.0",
+ "react": "16.0.0-alpha.6",
+ "react-native": "https://github.com/expo/react-native/archive/sdk-16.0.0.tar.gz",
+ "NavigationPlayground": "file:../NavigationPlayground"
+ }
+}
diff --git a/packages/react-navigation/examples/NavigationPlayground/README.md b/packages/react-navigation/examples/NavigationPlayground/README.md
index 0627570c..584fc08c 100644
--- a/packages/react-navigation/examples/NavigationPlayground/README.md
+++ b/packages/react-navigation/examples/NavigationPlayground/README.md
@@ -5,3 +5,5 @@ A playground for experimenting with react-navigation in a pure-JS React Native a
## Usage
Please see the [Contributors Guide](https://github.com/react-community/react-navigation/blob/master/docs/guides/Contributors.md#development) for instructions on running these example apps.
+
+You can view this example application directly on your phone by visiting [our expo demo](https://exp.host/@react-navigation/NavigationPlayground).
diff --git a/packages/react-navigation/examples/NavigationPlayground/package.json b/packages/react-navigation/examples/NavigationPlayground/package.json
index c9d56cea..a1e7f0c6 100644
--- a/packages/react-navigation/examples/NavigationPlayground/package.json
+++ b/packages/react-navigation/examples/NavigationPlayground/package.json
@@ -8,12 +8,12 @@
"dependencies": {
"react": "16.0.0-alpha.6",
"react-native": "^0.44.0",
- "react-native-vector-icons": "^4.1.1"
+ "react-native-vector-icons": "^4.1.1",
+ "react-navigation": "file:../.."
},
"devDependencies": {
"babel-jest": "^20.0.1",
"jest": "^20.0.1",
- "react-navigation": "file:../..",
"react-test-renderer": "^15.5.4"
},
"jest": {
diff --git a/packages/react-navigation/website/src/AppFrame.js b/packages/react-navigation/website/src/AppFrame.js
index e976ac78..f3491ef0 100644
--- a/packages/react-navigation/website/src/AppFrame.js
+++ b/packages/react-navigation/website/src/AppFrame.js
@@ -21,6 +21,13 @@ const NavigationLinks = ({ navigation, className, reverse }) => {
);
}),
+
+ Demo
+ ,
+
GitHub
,