react-native-architecture

Tổng quan

react-native-architecture là gì?

react-native-architecture cung cấp một khuôn mẫu thực tiễn để xây dựng các ứng dụng di động React Native có khả năng mở rộng và sẵn sàng cho sản xuất. Nó tập trung vào việc sử dụng Expo, điều hướng nâng cao, tích hợp module native, mô hình ưu tiên offline và cấu trúc dự án vững chắc. Kỹ năng này dành cho các nhà phát triển frontend và nhóm mobile muốn tăng tốc quá trình phát triển ứng dụng đồng thời tuân theo các thực hành tốt nhất.

Ai nên sử dụng kỹ năng này?

• Các nhà phát triển bắt đầu dự án React Native hoặc Expo mới
• Nhóm triển khai các luồng điều hướng hoặc xác thực phức tạp
• Dự án cần tích hợp module native hoặc API nền tảng
• Ứng dụng yêu cầu hỗ trợ offline và quản lý trạng thái đáng tin cậy
• Bất kỳ ai muốn tối ưu hiệu suất React Native hoặc thiết lập CI/CD cho mobile

Những vấn đề mà nó giải quyết

• Giảm thời gian thiết lập với cấu trúc dự án đã được chứng minh
• Làm rõ khi nào nên dùng Expo hoặc Bare React Native
• Hướng dẫn tích hợp module native và API nền tảng
• Hỗ trợ phát triển ưu tiên offline và đa nền tảng
• Giúp duy trì codebase có khả năng mở rộng và dễ bảo trì

Cách sử dụng

Các bước cài đặt

1. Thêm kỹ năng vào agent của bạn bằng lệnh:

   npx skills add https://github.com/wshobson/agents --skill react-native-architecture
   

2. Mở file SKILL.md để xem tổng quan và hướng dẫn quy trình làm việc.
3. Xem các file hỗ trợ như README.md, AGENTS.md, và metadata.json để hiểu sâu hơn.
4. Khám phá các thư mục rules/, resources/, references/, và scripts/ để biết chi tiết triển khai và tiện ích hỗ trợ.

Tổng quan cấu trúc dự án

Cấu trúc được đề xuất bao gồm:

• src/app/: Màn hình Expo Router, tổ chức theo loại điều hướng (ví dụ: auth, tabs)
• src/components/: Các component giao diện và tính năng
• src/hooks/: Các hook React tùy chỉnh
• src/services/: Tích hợp API và dịch vụ native
• src/stores/: Logic quản lý trạng thái
• src/utils/: Các hàm tiện ích
• src/types/: Định nghĩa kiểu TypeScript

Expo và Bare React Native

• Expo: Thiết lập dễ dàng hơn, quản lý module native tự động, cập nhật nhanh qua OTA
• Bare React Native: Kiểm soát nhiều hơn, liên kết module native thủ công, phức tạp hơn
  Chọn Expo cho hầu hết dự án trừ khi bạn cần code native tùy chỉnh không được Expo hỗ trợ.

Điều chỉnh kỹ năng

Thay vì sao chép trực tiếp các file, hãy điều chỉnh kiến trúc và các mẫu thiết kế để phù hợp với kho mã, công cụ và quy ước nhóm của bạn.

Câu hỏi thường gặp

Lợi ích chính của react-native-architecture là gì?

Nó cung cấp điểm khởi đầu rõ ràng, có khả năng mở rộng cho dự án React Native, giúp giảm thời gian thiết lập và nợ kỹ thuật.

Tôi có thể dùng kỹ năng này với dự án React Native hiện có không?

Có, bạn có thể áp dụng dần dần cấu trúc và mẫu thiết kế được đề xuất để cải thiện khả năng bảo trì.

Kỹ năng này chỉ dành cho Expo phải không?

Không. Mặc dù Expo được khuyến nghị cho hầu hết trường hợp, kiến trúc cũng hỗ trợ Bare React Native khi bạn cần tích hợp native tùy chỉnh.

Tôi nên bắt đầu từ đâu sau khi cài đặt?

Bắt đầu với file SKILL.md để có cái nhìn tổng quan, sau đó khám phá cây thư mục để xem hướng dẫn chi tiết và ví dụ.

Làm sao để xem tất cả file và script có sẵn?

Sử dụng tab Files để duyệt toàn bộ cây thư mục, bao gồm các tham chiếu lồng nhau và script hỗ trợ.