哈囉，大家好，歡迎開始我們 30 天的 React Native 與 Expo 之旅！

今天我們將會從最基本的開始，了解 React Native 與 Expo 是什麼，並且設定必要的開發環境以及模擬器。

究竟什麼是 React Native？

React Native 是由 Meta(Facebook) 開發並維護的一個開源框架，它讓我們可以使用 JavaScript 和 React 來開發 iOS 和 Android 的原生應用程式。那麼，你可能會問：原生應用程式？那不就需要學習 Swift 或是 Kotlin，我只會 JavaScript 欸！

別擔心，React Native 就是為了解決這個問題而誕生的！

當我們在用 React Native 開發應用程式時，React Native 會將我們的 JavaScript 程式碼轉換成相對應的原生 UI，然後在 iOS 和 Android 上運行。也就是說，使用 React Native，我們可以只寫一次程式碼，就能同時生成 iOS 和 Android 的應用程式，這就是所謂的「跨平台開發」。

但是，你也許又有其他疑問：我為什麼不直接寫一個網頁的應用程式就好了，那不就可以在所有裝置上運行了嗎？

確實，網頁應用程式在跨平台方面也可以有很好的支援，但它們往往無法提供原生應用程式的體驗。例如，原生應用程式可以更順暢地使用手勢、動畫，並能更直接地使用手機的硬體功能，如相機、GPS 定位等應用。而使用 React Native，則兼具了兩者的優點：跨平台，並且能提供接近原生的用戶體驗。

那麼，Expo又是什麼呢？

簡單來說，Expo 是一個讓你更輕鬆地開發 React Native 應用程式的工具。你可以把它想像成 React Native 的超級助手，它提供了許多現成的 API 和工具，讓我們可以更容易地開發 React Native 應用程式。

舉例來說，如果你想在 React Native 應用程式中使用手機的相機功能，如果沒有 Expo，你可能需要手動為 iOS 和 Android 各寫一份原生的相機接口，然後再編寫 JavaScript 的代碼來調用這兩個接口。

但如果你使用 Expo，你只需要安裝相關的 Expo 套件，然後直接在你的 JavaScript 代碼中使用它，就可以在 iOS 和 Android 上都能使用相機功能了。

除此之外，Expo 還提供了一個名為 Expo Go 的開發者工具，它可以讓你直接在你的手機上預覽你的 React Native 應用程式，而不需要手動編譯和安裝。這對於快速開發和調試非常有幫助。

設定開發環境

關於開發環境，我們只需要安裝 Node.js 就可以了。

Node.js 是一個 JavaScript 的運行環境，我們需要它來運行我們的 React Native 程式碼。你可以到 Node.js 的官網下載並安裝最新的 LTS 版本。

模擬器

在開發 React Native 應用程式時，我們通常會使用模擬器或真實裝置來測試我們的程式碼。對於 iOS，我們可以使用 Xcode 的 iOS 模擬器；而對於 Android，則可以使用 Android Studio 的 Android 模擬器。這部分就看你是使用什麼電腦，還有想開發什麼平台。

iOS

1. 安裝 Xcode

打開 App Store 下載 Xcode。

2. 安裝 Xcode Command Line Tools

$ xcode-select --install

Android

1. 安裝 Android Studio

打開 Android Studio 下載。

2. Install Android SDK

3. 加入指向 Android SDK 的環境變數

$ [ -d "$HOME/Library/Android/sdk" ] && ANDROID_HOME=$HOME/Library/Android/sdk || ANDROID_HOME=$HOME/Android/Sdk
echo "export ANDROID_HOME=$ANDROID_HOME" >> ~/`[[ $SHELL == *"zsh" ]] && echo '.zshenv' || echo '.bash_profile'`

4. 加入 platform-tools

$ echo "export PATH=$ANDROID_HOME/platform-tools:\$PATH" >> ~/`[[ $SHELL == *"zsh" ]] && echo '.zshenv' || echo '.bash_profile'`

5. 更新環境變數路徑

$ source ~/`[[ $SHELL == *"zsh" ]] && echo '.zshenv' || echo '.bash_profile'`

6. 輸入 adb 確認是否安裝成功

$ adb

7. 設定模擬手機裝置

不過，如果你覺得安裝和設定模擬器太麻煩，或者覺得電腦性能不夠好，你也可以直接使用你的手機來測試你的 React Native 應用程式。你只需要從 App Store 或 Google Play 下載 Expo Go 應用程式，然後掃描 Expo 開發者工具上的 QR code，就可以在你的手機上看到你的應用程式了。

也就是說，如果你是 Windows 開發者，想要開發 iOS 應用程式也是辦得到的，只要你有一個 iPhone 就可以利用 Expo Go 來預覽，這解決了以往 React Native 開發上的平台問題。

結語

總結一下，React Native 和 Expo 是開發跨平台原生應用程式的強大工具。透過今天的文章，我們已經準備好開始我們的 React Native 開發之旅了。在接下來的幾天，我們將一步一步地學習如何使用 React Native 和 Expo 來開發完整的應用程式。