<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section --> [](#contributors-) <!-- ALL-CONTRIBUTORS-BADGE:END -->
npm install react-optimize

 
Integration with Google Optimize.
Docs:
- Optimize Deploy with GTAG: https://support.google.com/optimize/answer/7513085
- Optimize JS API: https://support.google.com/optimize/answer/9059383
```
yarn add react-optimize
You first need to add the gtag snippet with the optimize container id in it. If you are using create-react-app
you can add the following to public/index.html
``
and define them in your .env
``
REACT_APP_GA_ID=UA-xyz
REACT_APP_OPTIMIZE_ID=GTM-abc
#### A/B Test
If the experience is a A/B testing you can use the lib like the following:
`
import React from 'react';
import { Experiment, Variant } from "react-optimize";
class App extends React.Component {
render() {
return(
Original
Variant 1
Variant 2
)
}
}
`
#### Multivariate Test
If the experience is a multivariate testing to test variants with two or more different sections. You can use the lib like the following applying the props asMtvExperiment (confirm that is multivariate) and the indexSectionPosition on google optimize like the image below:
!google optimize multivariate test
`
import React from 'react';
import { Experiment, Variant } from "react-optimize";
class App extends React.Component {
render() {
return(
asMtvExperiment
indexSectionPosition="0"
>
Original
Variant 1
asMtvExperiment
indexSectionPosition="1"
>
Original
Variant 1
Variant 2
asMtvExperiment
indexSectionPosition="2"
>
Original
Variant 1
)
}
}
``
Thanks goes to these wonderful people (emoji key):
Hudo Assenco 💻 📖 | Dobes Vandermeer 💻 📖 | Timo Laak 👀 | Kelvin Maues 💻 📖 |
This project follows the all-contributors specification. Contributions of any kind welcome!