Skip to main content

Environment

  • 2015年3月Facebook開放了React Native原始碼,一個能夠利用 JavaScript 建立原生iOS及Android App的框架
  • PhoneGap, Cordova, Ionic之類的框架是將網頁內容包裝成 WebView,形成UI元素,看起來不像原生App
  • React Native則是使用iOS或Android支援的JavaScript元件,因此打造出來的App就跟原生的沒有兩樣

可以安裝React Native

  • 過程其中有些比較繁瑣,且還需要安裝Android Studio才能夠開發
npm install -g react-native-cli

或直接安裝Expo CLI

  • 此工具將繁瑣的事情給解決掉,只需要安裝 expo-cli以及在手機安裝expo client就能夠快速上手
npm install -g expo-cli
expo login

e.g.建立空白樣板

  • 打開Terminal
cd ~/Documents/React
npx expo-cli init mytest
選擇blank Template
cd mytest
npm install
npm start

//2023年之後請用
npm update
npm install -g eas-cli
eas login
npx create-expo-app -t #-t 可以讓我們選擇template,預設會用tab template
choose a template: 選擇 blank
name of project: myapp
cd myapp
npx expo start
  • Terminal會出現一組QRCode
  • 打開手機,下載Expo
  • 用手機的相機拍照Terminal上顯示的這組QRCode,並用Expo打開
  • 手機就可以連上我們的程式了
  • 用Visual Studio Code打開資料夾mytest開始編輯程式

如果要用code .直接在資料夾中打開VSCode

export PATH="$PATH:/Applications/Visual Studio Code.app/Contents/Resources/app/bin