The Wayback Machine - https://web.archive.org/web/20230714130722/https://github.com/cassidoo/pokemon-feature-flags
Skip to content

cassidoo/pokemon-feature-flags

main
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
src
 
 
 
 
 
 
 
 
 
 

Pokémon Feature Flags demo

Netlify Status

Here's a demo for integrating feature flags into a React project! Built with React, Vite, the PokeAPI, and LaunchDarkly!

When the feature flag is off, only Normal type Pokémon can be searched for in the app. When the flag is turned on, then any Pokémon can be queried!

Deploy your own

LaunchDarkly setup

Once you've signed up for LaunchDarkly, create a feature flag. I call mine testaroni, and you should too if you want this to work out of the box. Otherwise, you can change it in the isAllowed function in Pokemon.jsx. Under Flag variations, make it a String type and add an "all" type, and any other Pokémon types you'd like to include:

image

After that, you're all set! You can toggle it on and off in the LaunchDarkly UI, set the default rules, segment which users get which types, and more.

Netlify setup

Click this button to deploy your own version of this project to Netlify!

Deploy to Netlify

You'll need to add your environment variables after cloning. Structure your .env.local file like so (you can find your client ID under Account Settings => Projects):

VITE_LD_CLIENT_KEY=your_key

...and then plop it into Netlify, and you're done!

About

A demo of LaunchDarkly, React, and Vite, using the Pokémon API!

Resources

Stars

Watchers

Forks