Skip to content

Conversation

@tengweiherr
Copy link

@tengweiherr tengweiherr commented May 2, 2023

Description

Feature flag with Firebase remote config, inspired by the example feature-flag-split

  1. Create three variant pages (index.tsx, B.tsx, C.tsx) in about folder.
  2. Run a script during the pre-build time to fetch the treatments from Firebase remote config.
  3. Save the treatments to a JSON file and store it in the directory.
  4. Proceed to build the app to generate static pages for each variant (/about, /about/B, /about/C).
  5. When a client requests the about page, instead of calling API routes and sending HTTP requests to fetch data from Firebase, the middleware can directly retrieve the data from the pre-generated JSON file and assign a variant to it.

Full article about this approach here.

Demo URL

https://feature-flag-firebase-remote-config.vercel.app

Type of Change

  • New Example
  • Example updates (Bug fixes, new features, etc.)
  • Other (changes to the codebase, but not to examples)

New Example Checklist

  • 🛫 npm run new-example was used to create the example
  • 📚 The template wasn't used but I carefully read the Adding a new example steps and implemented them in the example
  • 📱 Is it responsive? Are mobile and tablets considered?
@vercel
Copy link
Contributor

vercel bot commented May 2, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
app-dir-css-in-js ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
app-dir-i18n ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
app-dir-share-state ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
edge-api-routes-cache-control ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
edge-api-routes-hello-world ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
edge-api-routes-json-response ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
edge-api-routes-query-parameters ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
edge-functions-authed-proxy ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
edge-functions-cookies ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
edge-functions-news ❌ Failed (Inspect) Nov 14, 2024 1:34pm
edge-functions-streams ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
edge-geolocation-country-block ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
edge-middleware-modify-request-header ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
edge-user-agent-based-rendering ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
example-auth-with-ory ❌ Failed (Inspect) Nov 14, 2024 1:34pm
example-reduce-image-bandwidth-usage ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
examples ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
geolocation-script ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
i18n ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
next-edge-api-route-hello-world ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
next-flask ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
nodejs-api ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
redirect-with-fallback ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
redirects-bloom-filter ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
solutions-combining-data-fetching-strategies ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
solutions-image-fallback ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
solutions-image-offset ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
solutions-loading-web-fonts ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
solutions-microfrontends ❌ Failed (Inspect) Nov 14, 2024 1:34pm
solutions-microfrontends-docs ❌ Failed (Inspect) Nov 14, 2024 1:34pm
solutions-pagination-with-ssg ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
solutions-parallel-routes-navbar ❌ Failed (Inspect) Nov 14, 2024 1:34pm
solutions-reuse-responses ❌ Failed (Inspect) Nov 14, 2024 1:34pm
solutions-script-component-ad ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
solutions-script-component-strategies ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
solutions-testing ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
wasm-rust-hello-world ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
wasm-rust-xor ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 14, 2024 1:34pm
@vercel
Copy link
Contributor

vercel bot commented May 2, 2023

@tengweiherr is attempting to deploy a commit to the Vercel Examples Team on Vercel.

A member of the Team first needs to authorize it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

1 participant