React Native (1) 環境安裝與設定

建立專案

會推薦使用 Expo 框架來建立 react-native 專案:

1
npx create-expo-app@latest --template blank

上面 –template 是可選模板,可參考這裡

設定開發環境

  1. 到 Expo官網 設定開發環境,手邊的手機是 Android 就選 Android,是 iphone 就選 ios。

  1. 選擇開發工具 (推薦使用 Expo Go)

  1. 下載 Expo Go

手機掃描 QRcode 下載 Expo Go

  1. 在專案中終端機輸入下面指令來開啟開發伺服器
1
npx expo start
  1. 掃描 QR code

使用手機 Expo Go 程式,掃描終端機中產生的 QRcode,要確保手機跟電腦的網路在同一個 ip 位置下。

  1. 確認畫面

在 Expo Go 就可看到專案畫面。

檔案調整

在 Expo Go 會使用 Expo Router 來建立路由,所以先可以刪除根目錄的 index.js 和 App.js,並在根目錄建立 App 資料夾,並在資料夾內建立 index.jsx (首頁)