安裝：

npm install -g react-native-cli

查看當(dāng)前版本：

react-native --version

我自己當(dāng)前的版本是：react-native-cli: 2.0.1，react-native: 0.51.0

創(chuàng)建：

react-native init FirstProject

運行 APP (iOS)：

cd FirstProject
react-native run-ios

運行 APP (Android)：

cd FirstProject
react-native run-android

創(chuàng)建目錄如下：

+ __tests__
+ ios
+ android
+ node_modules
- package-lock.json
- package.json
- app.json
- index.js
- App.js

寫上“Hello, world!”：
把App.js里面的代碼全部刪了，寫上下面的代碼：

import React, { Component } from 'react';
import { Text } from 'react-native';

export default class App extends Component {
  render() {
    return (
      <Text>Hello, world!</Text>
    );
  }
}

當(dāng)然你寫上這段代碼后悔看到的效果是——
“Hello, world!”，這段文字的位置在屏幕左上角頂部開始的。

調(diào)整一下代碼：

import React, { Component } from 'react';
import {
    View,
    Text,
    StyleSheet,
    Platform
} from 'react-native';

const instructions = Platform.select({
  ios: 'Hello, iOS!',
  android: 'Hello, Android!',
});

export default class App01 extends Component<{}> {
  render() {
    return (
            <View style={styles.container}>
                <Text> Hello, world! </Text>
                <Text> {instructions} </Text>
        </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#fff',
  }
});