Các bước cài đặt React Native trên Windows

Các bước cài đặt React Native trên mỗi trường Windows cho Android

Hôm nay mình xin hướng dẫn các bạn cách cài đặt React Native và môi trường phát triển trên máy chạy Window. Mình sử dụng máy window để code App React Native, nên sẽ tập chung cài đặt cho window và android. Do chưa có điều kiện để cài trên mac và chạy thư môi trường giả lập của ios nên mình sẽ không nhắc tới trong bài này. Phần hướng dẫn này tương tự như trên document của React Native các bạn có thể tham khảo nó.

Thời điểm mình viết bài này là React native 0.39 và Nodejs 7.2.1, JDK 8u112

1. Download và cài đặt các công cụ cần thiết

• Python:  https://www.python.org/downloads/
• Nodejs:  https://nodejs.org/en/
• JDK: http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
• Android  studio: https://developer.android.com/studio/index.html
• Devices: IntelAndroidDrvSetup1.10.0
• Git: https://git-scm.com/downloads
• Editor: Atom || Sublime Text || Visual studio code || Webstorm …

Nên dùng phiên bản mới nhất khi cài đặt các thành phần

 

2. Thêm biến môi trường JDK & Android SDK

• Java SDK: Windows → Search → System → Advanced System Settings → Environment variables → New

JAVA_HOME: C:\Program Files\Java\jdk1.8.0_111

• Android SDK: tạo biến tương tự như JAVA_HOME.

ANDROID_HOME: C:\Users\enqtran\AppData\Local\Android\Sdk  

Lưu ý: là tên enqtran sẽ là tên user máy tính của các bạn nhé. Nên cài đặt môi trường Path luôn cho jdk và android sdk, build-tool.

 

3. Cấu hình Android Virtual Device

• Mở Android Studio
• Download các thành phần cần thiết cho Android 6.0 (Marshmallow).
• Thành phần cần có: Google APIs, Intel x86 Atom System Image, Intel x86 Atom_64 System Image,Google APIs Intel x86 Atom_64 System Image, Android SDK Build-Tools 23.0.1, HAXM
• Tạo một Android Studio project ( sau nay tạo project React native rồi thì sẽ mở thư lục android trong source react native ) .
• Tạo Android Virtual Device: Manage AVD → Create
• Chạy Android Virtual Device

 

4. Cài đặt React Native

Các bạn chạy các lệnh như sau trên CMD Window

Nếu cần can thiệp vào mã nguồn gốc:

• npm install -g react-native-cli
• react-native init NameProject
• cd  NameProject
• react-native start
• react-native run-android
• react-native run-ios

 

Sau khi cài đặt những bước trên thì trên máy ảo Android sẽ xuất hiện màn hình như sau là thành công

 

5. Khắc phục một số lỗi xảy ra cài đặt môi trường và khởi tạo project react native

• Update …..

 

Tổng kết:

– Phần cài đặt cũng không quá khó khăn tuy nhiên có một lưu ý là các bạn nhớ cài đặt đủ những thành phần được yêu cầu và cài đặt môi trường cho no chuẩn xác. Khi cài xong Android Studio nên download đầy đủ các thành phần hỗ trợ Android 6.0 trong SDK Manager. Chạy máy ảo Android lên rồi mới chạy các lệnh CMD tảo project.

 

Print

---