History

Andres Alvarez 6424e1f1d9 Add A/B Tests and Feature Flags example (#13629 ) ## Summary This PR adds a basic example of how [Tesfy](https://tesfy.io/) could be integrated with Next.js. Tesfy is a project that I've working on during quarantine weekends, mainly to learn new stuff and provide free and unlimited A/B Tests and Feature Flags while keeping a good performance and the library [size](https://bundlephobia.com/result?p=react-tesfy@1.2.1) as small as possible. The configuration file could be set up using a [web application](https://app.tesfy.io/) (hosted in Vercel 🎉 ) or by your self. ## Implementation - Created `with-tesfy` folder - Added two pages `index.js` and `features.js` to show how experiments and features could be used - The only thing that must be persisted is the `userId`. Used a cookie to save it. - Uses `getServerSideProps` to fetch the configuration file and get/create the `userId`. ## Screenshots There are some screenshots from the web application. Where you can easily configure experiments and audiences per project. Teams and features will soon be added. ![Screenshot 2020-06-01 at 15 40 49](https://user-images.githubusercontent.com/6877967/83414811-60e7ce80-a41e-11ea-9e5c-887c66e80c65.png) ![Screenshot 2020-06-01 at 15 41 02](https://user-images.githubusercontent.com/6877967/83414823-66451900-a41e-11ea-885b-b58e78b042bb.png) ![Screenshot 2020-06-01 at 15 41 11](https://user-images.githubusercontent.com/6877967/83414828-6a713680-a41e-11ea-90a8-8d39a17f19a1.png) This is my first PR! sorry if I made something wrong 😞 . Any feedback is more than welcome. Also I want to thank you all for the awesome work with Next.js ❤️		2020-06-21 23:59:53 +00:00
..
components	Add A/B Tests and Feature Flags example (#13629 )	2020-06-21 23:59:53 +00:00
pages	Add A/B Tests and Feature Flags example (#13629 )	2020-06-21 23:59:53 +00:00
utils	Add A/B Tests and Feature Flags example (#13629 )	2020-06-21 23:59:53 +00:00
package.json	Add A/B Tests and Feature Flags example (#13629 )	2020-06-21 23:59:53 +00:00
README.md	Add A/B Tests and Feature Flags example (#13629 )	2020-06-21 23:59:53 +00:00

README.md

Tesfy Example

Tesfy allows you to create unlimited A/B Tests and Feature Flags for free using a web app or by your self.

This example shows how to integrate react-tesfy in Next.js.

To use Tesfy there are only two mandatory things needed. A userId and a configuration file known as datafile. In the _app.js you will notice that those are being get.

The userId must uniquely identify a user even if not logged in, for that reason a uuid is created and stored in a cookie so the next time a page is requested a new userId won't be created, instead the cookie one will be used.

The datafile is just a json that defines the configuration of the experiments and features avaliable. It must be fetched from Tesfy CDN or from your own servers at least everytime a request is performed, later on this configuration could also be fetched if wanted (e.g. during page transitions).

Deploy your own

Deploy the example using Vercel:

How to use

Using `create-next-app`

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example with-tesfy with-tesfy-app
# or
yarn create next-app --example with-tesfy with-tesfy-app

Download manually

Download the example:

curl https://codeload.github.com/vercel/next.js/tar.gz/canary | tar -xz --strip=2 next.js-canary/examples/with-tesfy
cd with-tesfy

Install it and run:

npm install
npm run dev
# or
yarn
yarn dev

Deploy it to the cloud with Vercel (Documentation).