最近用React Native写了一个小游戏,写点文章记录下开发过程,这些文章只记录一些重要的知识点,不是完全的新手教程,太基础的东西就不讲了
项目地址https://github.com/elfman/CrosswordPuzzle
通过React Native可以只写一次JS代码就能同时在Android和iOS上运行,提高开发效率
React Native与其它全平台框架相比最大的优势就是它是通过JS来控制原生控件,可以实现原生APP的所有功能。
1. 语言基础
JavaScript:http://www.runoob.com/js/js-tutorial.html,只需要了解语法,有关DOM、BOM和表单的都不需要去了解
React:https://discountry.github.io/react/docs/hello-world.html
ES6:http://es6.ruanyifeng.com/
flex布局:Flex 布局教程:语法篇
CSS基础:http://www.runoob.com/css/css-tutorial.html
至于Java和Objective-C/Swift,只是做一些简单的东西,不需要写原生代码
2. 环境搭建
- 官网教程https://facebook.github.io/react-native/docs/getting-started.html
中文版https://reactnative.cn/docs/0.46/getting-started.html - Android开发强烈推荐使用Genymotion的模拟器,�性能比Google自带的模拟器好太多了,安装教程见Genymotion安装及使用教程详解
- IDE推荐使用WebStorm,原生支持React和ES6,有语法高亮和自动补全,不需要再去安装插件。
- 调试方法见https://reactnative.cn/docs/0.46/debugging.html,推荐安装react-devtools,可以实时查看DOM的props和state,在调试时十分有用
- 推荐使用淘宝npm镜像来替代npm官方源,速度快很多,替换方法见https://npm.taobao.org/
3. 运行程序
git clone https://github.com/elfman/CrosswordPuzzle.git
npm install
react-native run-android
react-native run-ios
网友评论