Expo 入门宝典 一 (Quick Start)React Native 简单可门 一。

自家决心翻译Expo,为上学Rn(react
native)的学习者提供救助。传统上Rn开发,优势还以Mac Ios ,很少发生因此Windows
andriod开发的,而2017年上线的Expo为咱普遍windows做Rn开发提供了杀挺之方便条件。Rn开发为迎来了春天。

入门准备

创造react native app有少栽办法,一种植是很快开计,无需安装android
studio或xcode,借助官方的工具App
Expo客户端可以快捷翻效果,另一样种植是含有原生代码,需要安装android或xcode,可以扩大原生插件,可以包出app,下面简单说生零星种植方式的装置步骤。


敏捷开

乃一旦安装有node,如果没的话,请到node官网下载安装。安装好node之后,使用npm安装create-react-native-app,打开一个下令行终端,输入下面发号施令:

npm install -g create-react-native-app

若是速度极慢,可以设置一下npm国内镜像或者对上网,通过下发号施令设置npm镜像

npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global

顺手说一下,这里要持续之各种安装不怎么建议利用cnpm,可能会见因设置之模块路径和npm的无顶相同产生有另的题材。安装好create-react-native-app,输入下面发号施令创建工程并打开服务

create-react-native-app AwesomeProject

cd AwesomeProject
npm start

翻开服务后,最终你可当命令行终端中见到如下图的出口

一声令下执行输出

,控制高出口了一个二维码和ip地址,接下打开Expo
App,这个App可以以google play和ios的app
stroe下载。不能够对上网的android同学,这边放一个Expo
2.0.0网盘链接。
使用Expo扫描命令行终端上的第二维码,不设扫我之,PC和手机如果当平网段内。

有关Rn的简说明,目前市场高达主流的有数死移动端系统,Android

Ios,而支出这片只体系上的App,传统上,分为Ios开发暨Android开发,这就生一个题目,一个商家如果达标丝同样缓app,但是需要至少需一个Ios开发,和一个Android开发,这就是造成App成本的升迁,而今天,如果我们为此Rn做开发,我们无非需要一致模仿代码,开发出来的App,可以运作于Ios和Android上,这大的提高了开销效率,也也企业付出产品降低了本钱,所以Rn一出产,就收了普遍程序员朋友等的热捧,学习Rn,没有出于的时日,拿起键盘就是是关系!

创办带原生代码的RN工程

及时边仅介绍windows系统下android环境的搭建,其他环境搭建之请赴RN官网或国内RN中文网查看。
公得安装的发生NodeReact Native
CLI
Python2JDKAndroid Studio
产生平安梯子的言语可应用Chocolatey来装Node,Python2和Jdk,Chocolatey是一个windows的担保管理器。安装好Chocolatey,输入下面发号施令

choco install -y nodejs.install python2 jdk8

要不的口舌就顶个别的官网上下载安装上面这些,或者您前面曾经安装好了,检查一下Node的本是否过等于4,JDK的版大于等于8。
安装好地方那些之后,通过npm安装React Native CLI

npm install -g react-native-cli

说到底便android开发环境之搭建
面前失去官网下载安装android
studio,上未失之得交android
studio国语社区下载或自行检索下载。下载好后打开装,安装完成后赶来下的欢迎界面

android studio

,点击右侧下脚的configure,然后选取SDK Manager安装SDK,在SDK platforms
tab页遭遇,勾选android 6.0,在SDK
tools勾选23.0.1点击应用起来下载。最后右键我之电脑,新建一个SDK的环境变量ANDROID_HOME如下图

环境变量

,注意这边的路为投机电脑上SDK的放路径。
及这边,算是非常功告成了。可以起新建第一独品类了。

react-native init AwesomeProject

连接下去测试安装

cd AwesomeProject
react-native run-android
``

好了,如果您准备抓Rn开发了,首先要恭喜你下,如果您见到自己之章,那么重如恭喜你,我们老有或变为朋友,如果你准备高Rn开发了,那么还面临一个,那便是工欲善其事,必先利其器!我们作Rn开发,用啊工具也?


此地我给大家推荐一款,Expo,这款简直时入门的神器啊!大家可以百度详细摸底,关于她的题目,欢迎加我微信jkxx123321
与自家交流【备注博客加】同时为欢迎关注本身的个人公众号:爱享黑马
以及本人保持联系!接下去,开始工作!


Expo 入门宝典 一
(Quick Start)

1.什么是Expo:

Expo是均等组工具、库与服务,可以透过编制JavaScript来构建地面的ios和Android应用程序。

Expo Apps是含有了Expo SDK的react native
Apps,SDK是一个native-and-js的堆栈,它包供针对性设施系统的访问功能,像相机、联系人、本地存储和另外硬件)。这代表你切莫待运用Xcode或Android的条件,或写任何代码也叫你的pure-JS项目特别便携带,因为其可以运行在任何自然环境包含Expo
SDK。

 

Expo还提供UI组件来拍卖各种应用程序,几乎拥有应用程序都拿给覆盖,但它们不会见突破react
native Core的核心代码,例如图标、模糊视图,等等。

 

末尾,Expo
SDK提供了看服务,这些劳务虽然非常不便管理,但差一点每个应用程序都需它们。其中最被欢迎的凡:Expo可以吧汝管理而的成本,它好啊卿处理推送通知,并且它们可构建准备安排及应用程序商店的本地二进制文件。

 

2.预备好开端了也,let’s go

 准备好的讲话虽开始了,第一步安装环境,【这里不纯粹一点,如果对rn不熟识的好事先看一下rn中文网】

http://reactnative.cn/docs/0.45/getting-started.html

  安装环境的言辞,我们得装俩个条件,一个凡是针对桌面客户端的,另一个凡对准手机客户端的。

  电脑桌面客户端的受:Expo XED 手机客户端的叫
Expo(也便一定给app)【大家温馨去下载,我这里附图,附下载链接】

  澳门葡京 1

  下充斥链接地址:

https://docs.expo.io/versions/v17.0.0/introduction/installation.html

  【补充某些:电脑需要未雨绸缪Node.js
没有底夺装一下,下载一个包后,直接生一样步下一样步就是足以了,安装完毕node测试成功为的艺术,命令台上输入
node -verson 打印一下君安装之本子】

3.你的环境设置好了吗?好了底语虽开辟试试吧

  电脑客户端打开环境Expo
XDE,首先会为您错过挂号一个属于你协调的账号(如图)

  澳门葡京 2

  注册好后,登录成功,就见面跻身一个界面了,(如图)

  澳门葡京 3

 

   创建属于你协调的门类(如图)

  澳门葡京 4

  创建成功,如图所示:

澳门葡京 5

 

   点击你的花色,让其当您的条件下走起!

  澳门葡京 6

 

   如图项目就走起了,接下去就要完善客户端了,也就算是App端。

    澳门葡京 7

  这个不晓的友好检查资料吧,也得以咨询我!

  【这里补充一下,大家用下一个夜神模拟器,在模拟器上安装一个expo也尽管是您于手机上安装的十分,这样大家可降对网环境之倚重,直接在模拟器上观望您代码运行的功用】这里附图一布置:

              澳门葡京 8

 

  这是自身个人调用微博开发者平台的接口Api,做的友好微博客户端,简单的效力来:【对随意博文的评论,发表自己之博文,转发一篇博文】这个设计到的艺不多,如果想只要源码,可以直接搜索我,也堪上github上去,我既高达污染上。

  接下去来几摆放功能图:(…不得瑟了)

  以最终好像忘记了告知你们用啊条件了,也就是写代码的环境,个人因此的是vs 
code 2017
,人们原先用Atom的呢于多,其实是到常无所谓,你用记事本也还执行,无非就是是一个描绘代码的家伙而已,建议编辑器用微软家之,特别好用啊!


 

http://www.cnblogs.com/gdsblog/p/6992410.html

 

笔者介绍:半路学IT,做开发3年,先下车于同下共享单车店,做后台开发!

 

 我开了一个公众号,欢迎各位有志同道合朋友,关注!不定期分享工作,和我得故事!

 

澳门葡京 9

转载请注明出处【郭东生blog】:http://www.cnblogs.com/gdsblog/p/6992410.html
如发生不足,请各位斧正!

 

相关文章