Hướng Dẫn Cài Đặt React Native CLI 0.81

React Native là một trong những framework phổ biến nhất để phát triển ứng dụng di động. Trong bài viết này, chúng ta sẽ tìm hiểu cách cài đặt React Native CLI phiên bản 0.81 một cách chi tiết và hiệu quả nhất.

Mục Lục

• 1. Cài đặt Node.js và Watchman
• 2. Cài đặt React Native CLI toàn cầu
• 3. Tạo dự án React Native mới
• 4. Di chuyển vào thư mục dự án
• 5. Cài đặt các phụ thuộc (nếu cần)
• 6. Chạy trên Android
• 7. Chạy trên iOS (Chỉ dành cho Mac)
• 8. Liên kết các mô-đun gốc (nếu cần)
• 9. Gỡ lỗi và phát triển
• 10. Xây dựng APK / IPA (Tùy chọn cho phát hành)
• Thực tiễn tốt nhất
• Cạm bẫy phổ biến
• Mẹo hiệu suất
• Khắc phục sự cố
• Câu hỏi thường gặp

1. Cài Đặt Node.js và Watchman

Để bắt đầu, bạn cần cài đặt Node.js và Watchman. Đảm bảo bạn có phiên bản mới nhất của Node.js. Thực hiện lệnh sau trên terminal:

brew install node
brew install watchman

2. Cài Đặt React Native CLI Toàn Cầu

Sau khi đã cài đặt Node.js, bạn có thể cài đặt React Native CLI bằng lệnh sau:

npm install -g react-native-cli

Hoặc sử dụng npx mà không cần cài đặt toàn cầu (điều này được khuyến nghị để tránh xung đột phiên bản):

npx react-native init MyNewProject

Lệnh này sẽ tạo ra dự án mới.

3. Tạo Dự Án React Native Mới

Để tạo một dự án mới, bạn có thể sử dụng lệnh sau:

npx react-native init MyNewProject

Nếu bạn cần chỉ định một mẫu, bạn có thể làm như sau:

npx react-native init MyNewProject --template react-native-template-typescript

4. Di Chuyển Vào Thư Mục Dự Án

Để vào thư mục của dự án vừa tạo, sử dụng lệnh:

cd MyNewProject

5. Cài Đặt Các Phụ Thuộc (Nếu Cần)

Nếu có bất kỳ phụ thuộc nào cần cài đặt, bạn có thể sử dụng:

npm install

Hoặc dùng yarn:

yarn

6. Chạy Trên Android

Đảm bảo bạn đã cài đặt Android Studio với SDK được thiết lập và trình giả lập đang chạy. Để chạy ứng dụng trên Android, sử dụng lệnh:

npx react-native run-android

7. Chạy Trên iOS (Chỉ Dành Cho Mac)

Đảm bảo bạn đã cài đặt Xcode. Để chạy ứng dụng trên iOS, sử dụng:

npx react-native run-ios

Lệnh này sẽ khởi động trình giả lập.

8. Liên Kết Các Mô-Đun Gốc (Nếu Cần)

Đối với các thư viện yêu cầu thay đổi mã gốc:

npx react-native link

Tuy nhiên, nhiều thư viện hiện nay sử dụng tính năng tự động liên kết và không cần bước này.

9. Gỡ Lỗi và Phát Triển

• Sử dụng react-native start để khởi động Metro bundler nếu nó không tự động chạy:

npx react-native start

• Bạn có thể tải lại, gỡ lỗi hoặc sử dụng React DevTools.

10. Xây Dựng APK / IPA (Tùy Chọn Cho Phát Hành)

Để xây dựng APK cho Android:

cd android
./gradlew assembleRelease

Đối với iOS:
Mở ios/MyNewProject.xcworkspace trong Xcode → Archive → Export.

Thực Tiễn Tốt Nhất

• Sử dụng npx để có phiên bản React Native mới nhất mà không cần cài đặt toàn cầu.
• Để có khả năng gốc đầy đủ, CLI được ưu tiên hơn Expo.
• Giữ SDK được cập nhật thường xuyên.
• Trên Windows, việc xây dựng iOS không được hỗ trợ trừ khi sử dụng dịch vụ đám mây.

Cạm Bẫy Phổ Biến

• Có thể gặp vấn đề về phiên bản xung đột khi cài đặt thư viện.
• Không đảm bảo các thư viện tương thích với phiên bản React Native mới nhất.

Mẹo Hiệu Suất

• Tắt chế độ phát triển khi không cần thiết để cải thiện hiệu suất.
• Sử dụng các công cụ phân tích để theo dõi hiệu suất ứng dụng.

Khắc Phục Sự Cố

• Nếu ứng dụng không chạy, kiểm tra lại cài đặt môi trường như Node.js, Watchman và Android Studio.
• Nếu có lỗi khi chạy trên iOS, hãy kiểm tra cấu hình của Xcode.

Câu Hỏi Thường Gặp

1. Tôi có cần cài đặt Node.js không?
   Có, Node.js là yêu cầu bắt buộc để sử dụng React Native.

2. Làm thế nào để kiểm tra phiên bản React Native?
   Bạn có thể chạy lệnh npx react-native -v để kiểm tra.

3. Tôi có thể chạy React Native trên Windows không?
   Có thể, nhưng việc phát triển ứng dụng iOS cần máy Mac.

4. Có cần cài đặt Watchman không?
   Mặc dù không bắt buộc, nhưng Watchman giúp cải thiện hiệu suất phát triển.

Bằng cách làm theo các bước trên, bạn có thể cài đặt và bắt đầu phát triển ứng dụng di động với React Native CLI 0.81 một cách nhanh chóng và hiệu quả. Hãy thử ngay hôm nay và khám phá sức mạnh của React Native trong việc phát triển ứng dụng di động!