Feature flag (cờ tính năng) là kỹ thuật cho phép bật/tắt chức năng mà không cần triển khai lại mã. Trong một monorepo chứa cả Next.js (web) và React Native (mobile), việc tập trung quản lý flag giúp đội ngũ phát hành an toàn, thử nghiệm A/B và rollback nhanh chóng. **1. Chọn giải pháp phù hợp** - Nếu dự án nhỏ, có thể tự xây dựng flag store đơn giản trên Redis + API nội bộ. - Với quy mô lớn, các dịch vụ như LaunchDarkly, Unleash hoặc Flagsmith cung cấp dashboard, phân đoạn người dùng và audit log sẵn có. **2. Kiến trúc chung cho Web và Mobile** - Tạo package `packages/feature-flags` chứa type định nghĩa (`FeatureKey`, `FlagContext`) và hook `useFlag(key)`. - Cả hai ứng dụng đều import package này, đảm bảo API nhất quán. - Backend cung cấp endpoint `/flags?env=production&userId=123` trả về JSON `{ "newCheckout": true, "darkMode": false }`. **3. Triển khai client‑side caching** - Sử dụng `stale-while-revalidate` (SWR) hoặc React Query để fetch flag khi ứng dụng khởi động và cập nhật định kỳ (ví dụ 5 phút). - Lưu cache vào `AsyncStorage` (React Native) hoặc `localStorage` (Web) để flag vẫn hoạt động khi offline. **4. Ví dụ sử dụng trong component** ```tsx import { useFlag } from '@myorg/feature-flags'; export function CheckoutButton() { const newCheckout = useFlag('newCheckout'); return newCheckout ? <NewCheckoutFlow /> : <LegacyCheckout />; } ``` **5. Quy trình phát hành an toàn** - Mặc định flag = false khi merge vào `main`. - QA bật flag trên môi trường staging thông qua dashboard. - Sau khi xác thực, bật dần cho % người dùng (canary) rồi 100%. - Nếu phát sinh lỗi, tắt flag ngay lập tức mà không cần rollback code. **6. Mẹo thực tế** - Gom nhóm flag theo domain (checkout, ui, analytics) để dễ dàng tìm kiếm. - Thêm metadata `description`, `owner`, `expiryDate` vào schema flag. - Tích hợp webhook từ dịch vụ flag vào Slack để team biết ngay khi có thay đổi. Với cách tiếp cận này, cả Web và Mobile chia sẻ cùng một nguồn sự thật về tính năng, giảm thiểu rủi ro phát hành và tăng tốc độ thử nghiệm ý tưởng mới.