สร้าง Virtual Devices ใน Andriod Studio
ในการพัฒนา mobile ด้วย react native จะต้องมีการเตรียม virtual devices สำหรับ android มีขั้นตอนดังต่อไปนี้ สร้าง virtual device เลือก พัฒนา บน Android 6 เพิ่ม path ในระบบ เลือกให้ถูกต้องกับระบบที่ใช้งานอยู่
1 2 3 |
//mac os เพิ่มเติมใน ~/.bash_profile export ANDROID_HOME=/Users/mee/Library/Android/sdk export PATH=$ANDROID_HOME/platform-tools:$ANDROID_HOME/tools/bin:$PATH |
เริ่มต้น พัฒนา mobile project ด้วย react native ให้ติดตั้ง node ในเครื่องให้เรียบร้อย ใช้ npm เพื่อติดตั้ง
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
$ npm install -g create-react-native-app $ mkdir ~/ReactProject $ cd ~/ReactProject $ create-react-native-app Firstproject Success! Created Firstproject at /Users/mee/ReactProject/Firstproject Inside that directory, you can run several commands: yarn start Starts the development server so you can open your app in the Expo app on your phone. yarn run ios (Mac only, requires Xcode) Starts the development server and loads your app in an iOS simulator. yarn run android (Requires Android build tools) Starts the development server and loads your app on a connected Android device or emulator. yarn test Starts the test runner. yarn run eject Removes this tool and copies build dependencies, configuration files and scripts into the app directory. If you do this, you can’t go back! We suggest that you begin by typing: cd Firstproject yarn start Happy hacking! // ทดสอบ $ cd Firstproject $ yarn start Your app is now running at URL: exp://192.168.1.35:19000 |
ต่อมาให้ติดตั้ง app ชื่อ expo และ กด Scan QR Code ไปยัง bar code เพื่อทำการเชื่อมต่อระหว่าง app.js และเครื่อง มือถือเรา
1 2 3 4 5 |
› Press a to open Android device or emulator, or i to open iOS emulator. › Press s to send the app URL to your phone number or email address › Press q to display QR code. › Press r to restart packager, or R to restart packager and clear cache. › Press d to toggle development mode. (current mode: development) |
หากเราต้องการ…