/ab-test-boilerplate

Primary LanguageJavaScriptMIT LicenseMIT

MIT License LinkedIn

Languages

Javascript

Frameworks

Node js Express js

How To

  1. download the zip folder from this link and unzip it. Open the unzipped folder with vs code.

  2. open terminal (ctrl + ~) and type npm install.

  3. while npm is installing the dependencies, install chrome extension tampermonkey.

  4. Once tamperMonkey installation is complete, Click tampermonkey extension and start a new script. Within the script copy and paste the following and press ctrl + s:

// ==UserScript==
// @name         Echologyx AB Testing Setup
// @require      http://localhost:2345/
// @match        http*://*/*
// ==/UserScript==

  1. now get back to vs code add target url for your test by typing npm run set-target-url. This will prompt for the url, type the target url when you see the prompt 'Set the URL target for you test:' and hit enter.

  2. you can use the index.js & main.scss in the root folder to create your AB Test. OR you can create your own folder structure. Just make sure to add the correct path for your js and css (or scss) in index.html

P.S. you only need to perform step 4 only once. You do not have to change it for each project.

P.S. you only need to perform step 5 everytime a new test starts.

  1. start the setup by typing npm start & refresh the page (you only have to do it once).

Once Local development is done use the css from dist folder & find your js object along with the polling function from index.js inside dist folder.

Troubleshooting

  • In case your css or js is not updating try deleting the dist & parcel-cache folder and then restart the servers by typing (ctrl + c) followed by npm start. You also need to make sure that browser cache is diabled, you can do this by going to the network tab in browser console and checking the box 'Disable cache'.