【實習】React Native

資料:https://ithelp.ithome.com.tw/users/20129575/ironman/3353(30天用React native製作app!! 系列)

7/5跟著實作:

DAY2:下載vscode、node.js

*vscode跟VS不同,原本以為一樣,但在VS找不到React Native Tools此延伸模組。


DAY3:

  1. 安裝Expo CLI 命令列工具:cmd輸入npm install -g expo-cli(要有node.js才能使用npm指令),手機也要在play商店下載Expo才能掃QRcode顯示。

  2. 建立空白專案:打開node.js command prompt輸入cd desktop>expo init (專案名稱,如:foodie),連按2下enter(空白專案),等他下載好,就能看到桌面建立一個foodie資料夾的專案。
  3. 開啟專案:檔案>開啟資料夾>選foodie>確認,點開APP.js(預設啟動檔,不可以任意改名)
  4. 按下control+`(1左邊那個按鈕)呼叫Vscode的終端機並輸入npm start,結果錯誤。

    回到node.js command prompt,輸入cd foodie>npm start,成功。
    cmd:


    web:


    run in web browser:
    手機掃QRcode失敗,CONNECTION轉成Tunnel就能成功連到,先等待手機下載好東西(javascript...)才會顯示出和瀏覽器一樣的畫面。

7/16:電腦重灌,重新建立環境

將需要的工具下載回來:node.js、vscode、MSSQL。
一樣先install expo cli,在D槽建立新專案:cmd>d:>expo init foodie
修改app.js的內容,執行npm start可以從iOS、安卓、網頁瀏覽結果。

要有跳頁、下方導覽列,需下載react-navigation/native和react-navigation/stack和react-navigation/bottom-tabs。
*注意路徑,要在專案中下載

這個網誌中的熱門文章

【醫院資訊系統】筆記整理

【MIS】管理資訊系統Ch1+2

【Mongo】cmd命令