Hướng Dẫn Chạy Ứng Dụng Expo Trên Thiết Bị Thực

Khi phát triển ứng dụng với Expo, bạn có thể đã dành rất nhiều thời gian để chạy ứng dụng của mình trên trình giả lập hoặc mô phỏng. Mặc dù điều đó rất hữu ích trong quá trình phát triển, nhưng không gì bằng việc trải nghiệm ứng dụng trên một thiết bị thực. Đây là cách duy nhất để kiểm tra hiệu suất, các tính năng gốc và trải nghiệm người dùng một cách chính xác.

Có hai phương pháp chính để chạy ứng dụng Expo của bạn trên một thiết bị vật lý: sử dụng ứng dụng Expo Go hoặc xây dựng khách hàng phát triển tùy chỉnh. Sự lựa chọn phù hợp phụ thuộc vào các phụ thuộc của dự án của bạn.

Phương Pháp 1: Đường Nhanh Với Expo Go

Nếu dự án của bạn chỉ dựa vào các API tiêu chuẩn mà SDK Expo cung cấp - tức là không có các mô-đun hoặc thư viện gốc tùy chỉnh ngoài những gì Expo Go hỗ trợ - thì đây là phương pháp bạn nên chọn. Nó nhanh chóng và yêu cầu thiết lập tối thiểu.

Điều Kiện Để Chạy

• Thiết bị của bạn: Một chiếc điện thoại iPhone hoặc Android.
• Expo Go: Đảm bảo ứng dụng miễn phí Expo Go đã được cài đặt trên thiết bị của bạn từ App Store hoặc Google Play Store.
• Mạng chia sẻ: Đây là bước quan trọng nhất. Máy tính và thiết bị di động của bạn phải được kết nối với cùng một mạng Wi-Fi. Các vấn đề với mạng công ty hoặc trường đại học có cách ly khách hàng thường là nguyên nhân chính gây ra thất bại kết nối.

Hướng Dẫn Từng Bước

1. Khởi động máy chủ phát triển: Trong thư mục gốc của dự án, mở terminal và chạy lệnh npx expo start.
2. Quét mã QR: Terminal sẽ hiển thị một mã QR. Sử dụng thiết bị của bạn để quét mã này.
   • Trên iOS: Mở ứng dụng Camera tích hợp và chỉ vào mã QR. Một thông báo sẽ xuất hiện. Nhấn vào đó để mở ứng dụng của bạn trong Expo Go.
   • Trên Android: Mở ứng dụng Expo Go và nhấn nút "Quét mã QR" để sử dụng máy quét trong ứng dụng.
3. Chạy ứng dụng: Expo Go sẽ kết nối với máy tính của bạn, tải xuống gói JavaScript và chạy ứng dụng của bạn. Bây giờ, bất cứ khi nào bạn lưu thay đổi trong mã, chúng sẽ tự động cập nhật trên thiết bị của bạn.

Truy Cập Menu Phát Triển

Khi ứng dụng đang chạy, bạn có thể truy cập menu phát triển để sử dụng các công cụ gỡ lỗi bằng cách lắc mạnh thiết bị của bạn. Menu này cho phép bạn mở một trình gỡ lỗi từ xa, tải lại ứng dụng hoặc xem một trình giám sát hiệu suất.

Phương Pháp 2: Đường Chuyên Nghiệp Với Khách Hàng Phát Triển

Khi bạn thêm các mô-đun gốc tùy chỉnh - chẳng hạn như một trình phát video cụ thể, thư viện thanh toán, hoặc Firebase - ứng dụng Expo Go sẽ không còn hoạt động nữa. Cốt lõi của nó không thể thay đổi và không chứa mã gốc mà thư viện mới của bạn cần. Giải pháp là tạo một bản phát triển tùy chỉnh, là một phiên bản cá nhân hóa của Expo Go với mã gốc độc đáo của dự án của bạn được biên dịch.

Điều Kiện Để Chạy

• Tài khoản Expo: Bạn sẽ cần một tài khoản Expo miễn phí.
• EAS CLI: Cài đặt giao diện dòng lệnh Dịch vụ Ứng dụng Expo (EAS) bằng cách chạy lệnh npm install -g eas-cli và sau đó đăng nhập bằng eas login.

Hướng Dẫn Từng Bước

1. Thêm thư viện khách hàng phát triển: Thư viện này cho phép ứng dụng của bạn giao tiếp với máy chủ phát triển. Chạy npx expo install expo-dev-client.
2. Cấu hình hồ sơ xây dựng: Đảm bảo tệp eas.json của bạn được cấu hình với hồ sơ xây dựng development có "developmentClient": true. Nếu bạn không có tệp này, bạn có thể tạo nó bằng cách chạy eas build:configure.
3. Tạo bản phát triển: Đây là quá trình xây dựng tệp gốc .apk (Android) hoặc .ipa (iOS). Nó được thực hiện trên các máy chủ đám mây của Expo và có thể mất từ 10-20 phút.
   • Đối với Android: eas build --profile development --platform android
   • Đối với iOS: eas build --profile development --platform ios (Lưu ý: Điều này yêu cầu một tài khoản Apple Developer trả phí.)
4. Cài đặt bản phát triển: Khi bản phát triển hoàn tất, EAS sẽ cung cấp một liên kết và mã QR. Quét mã QR để tải xuống và cài đặt ứng dụng trên thiết bị của bạn. Trên iOS, bạn sẽ có thể sử dụng TestFlight cho việc này.
5. Chạy ứng dụng của bạn:
   • Khởi động máy chủ của bạn bằng npx expo start --dev-client.
   • Mở ứng dụng tùy chỉnh mới mà bạn vừa cài đặt trên điện thoại. Nó sẽ tự động kết nối với máy chủ phát triển của bạn.
   • Giống như với Expo Go, bạn có thể lắc thiết bị để truy cập menu phát triển và các công cụ gỡ lỗi.

Khi Nào Cần Xây Dựng Lại Ứng Dụng

Với một bản phát triển, bạn không cần phải xây dựng lại mỗi khi bạn thực hiện một thay đổi. Mã JavaScript của bạn được tải động từ máy chủ phát triển, cung cấp một trải nghiệm nhanh chóng và lặp đi lặp lại.

Bạn chỉ cần tạo một bản xây dựng mới khi bạn thay đổi mã gốc. Điều này bao gồm:

• Thêm hoặc xóa một gói mô-đun gốc npm.
• Nâng cấp hoặc hạ cấp một mô-đun gốc hiện có.
• Thay đổi các tệp cấu hình gốc như app.json, Info.plist, hoặc AndroidManifest.xml (ví dụ: cập nhật biểu tượng ứng dụng hoặc tên gói).
• Nâng cấp dự án của bạn lên phiên bản SDK Expo mới.

Đối với mọi thứ khác - như chỉnh sửa các tệp JavaScript/TypeScript hoặc thay đổi kiểu CSS - máy chủ Metro sẽ ngay lập tức đẩy các bản cập nhật đến ứng dụng đang chạy của bạn.

Phương pháp hai này giúp Expo trở nên cực kỳ linh hoạt, cho phép bạn chọn quy trình làm việc phù hợp cho dự án của bạn ở mọi giai đoạn phát triển.

Thực Hành Tốt Nhất

• Luôn kiểm tra kết nối mạng trước khi bắt đầu phát triển.
• Đảm bảo ứng dụng Expo Go luôn được cập nhật phiên bản mới nhất.
• Sử dụng các công cụ gỡ lỗi để theo dõi hiệu suất và phát hiện lỗi kịp thời.

Cạm Bẫy Thường Gặp

• Quên không kết nối thiết bị với mạng Wi-Fi giống máy tính.
• Không cài đặt ứng dụng Expo Go trên thiết bị di động.
• Cấu hình sai tệp eas.json, làm ứng dụng không thể chạy.

Mẹo Hiệu Suất

• Sử dụng các thư viện nhẹ và tối ưu hóa mã JavaScript của bạn để cải thiện hiệu suất ứng dụng.
• Thường xuyên kiểm tra hiệu suất trên thiết bị thực để phát hiện sớm các vấn đề.

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

1. Tôi có thể chạy ứng dụng Expo trên thiết bị thực mà không có Expo Go không?

Có, bạn có thể xây dựng một khách hàng phát triển tùy chỉnh nếu cần sử dụng các mô-đun gốc tùy chỉnh.

2. Có cần thiết phải tạo bản phát triển mới mỗi khi thay đổi mã không?

Không, bạn chỉ cần tạo bản phát triển mới khi thay đổi mã gốc, mã JavaScript sẽ tự động được cập nhật.

3. Làm thế nào để kiểm tra hiệu suất ứng dụng của tôi?

Bạn có thể truy cập menu phát triển để sử dụng các công cụ gỡ lỗi và theo dõi hiệu suất trên thiết bị của bạn.