Archive for the Category: React Native

React Native 开发教程

React Native 开发教程 原文地址:http://facebook.github.io/react-native/docs/tutorial.html#content 序言 该教程的主要目的是让开发者使用React Native 快速开发一个iOS app。学习该教程需要有React基础。 安装 React Native目前只支持iOS App的开发,因此只能在mac osx 系统上使用。需要安装的软件包括 xcode、Homebrew,node,npm和watchman,Flow可选安装。 安装完上面的软件后,在命令行执行下面的命令用来安装开发环境和创建React Native工程。 1 安装开发环境 npm install -g react-native-cli react-native-cli 是react native 的命令行工具,可以直接在终端中使用。 2 创建React Native工程 react-native init AwesomeProject 上面的命令创建一个包含React Native源代码的工程,可以直接使用xcode打开。 开发 使用xcode打开AwesomeProject/AwesomeProject.xcodeproj工程文件,点击Run按钮或者cmd+R运行工程,可以查看运行结果。应用运行的时候会自动启动一个node server来host js文件。修改index.ios.js文件后,重新运行应用,即可看到应用的变化。 本开发教程将开发一个简单的电影应用(Movie App)。在该应用中将获取电影的海报和名称使用ListView来显示。 hello world react-native init 命令会拷贝Examples/SampleProject工程名重命名为作为init参数的工程名,在上面例子中为AwesomeProject,这是一个hello world的工程。开发者可以通过修改index.ios.js文件来查看应用的变化。 模拟数据 在开始写代码之前,先创建一些模拟数据。打开index.ios.js文件,在文件顶部定义MOCKEDMOVIESDATA,如下面代码: var MOCKED_MOVIES_DATA = [ {title: […]

Leave a comment