學習React Native需要先簡單學習JavaScript卿拴,所以在學習前可以先去了解一下JavaScript語言的常用語法。
Android環(huán)境的搭建
在window上因為只能開發(fā)Android耸三,iOS需要在Mac系統(tǒng)上開發(fā)澎埠,所以必須要有Android的開發(fā)環(huán)境措近。Android的開發(fā)環(huán)境只需要有:
- jdk的安裝以及環(huán)境變量的配置
- Android studio的下載以及安裝溶弟,網(wǎng)址可以使用Android的中文官網(wǎng)進行下載Android的中文官網(wǎng)
運行設備搭建
- 真機調(diào)試(這里連接的網(wǎng)絡必須和電腦是一個網(wǎng)絡才可以調(diào)試
- 安裝Genymotion模擬器Genymotion安裝教程
安裝Node
node.js輕量級的Web服務器,想要是React Native跑起來需要安裝node瞭郑, 如果沒有安裝node.js辜御,先去官網(wǎng)安裝node.jsNode下載地址
下載好后直接安裝,然后在命令行中敲下面的代碼:
圖片1.png
然后給node配置環(huán)境變量:
圖片2.png
具體環(huán)境變量配置可以參考Node環(huán)境變量配置
安裝React Native模塊
打開控制命令行輸入:npm install -g yarn react-native-cli屈张,按回車即開始安裝擒权,等待安裝即可。
安裝Webstore
Webstore是前端開發(fā)的IDE工具阁谆,這里可以直接創(chuàng)建react native項目碳抄,以后的react native開發(fā)都是基于這個開發(fā)工具進行的,Webstore下載地址
至于如何破解场绿,可以參考這篇博客的第二種方法剖效,試過,可以用破解地址
第一個react native項目
完成以上環(huán)境的配置焰盗,打開Webstore璧尸,新建react native項目:
圖片1.png
創(chuàng)建好后如下:
圖片2.png
點擊上方指示運行就ok。然后打開Android studio熬拒,將項目中的android目錄導入Android studio中進行編譯:
圖片3.png
然后打開Genymotion模擬器開啟一個Android模擬器逗宁,點擊下方按鈕運行:
圖片4.png
這里要注意,模擬器或者真機必須和電腦是一個網(wǎng)絡的才可以運行成功:
圖片5.png
看到如上圖梦湘,就說明已經(jīng)成功運行起第一個react native項目。下一篇講解react native的項目結(jié)構(gòu)件甥。