ifeLawal / forecasting-sliders-react

https://ifelawal.github.io/forecasting-sliders-react/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

This project was bootstrapped with Create React App.

Feel free to interact with the project so far

Deployed using react gh-pages. This awesome article by Benni Russell shows the 3 simple steps:

Purpose of interface / program

Allow a user to do calculations through a slider and input interface. Currently specifically targeted at metrics within facebook advertising.

The metrics and there connections are: Revenue = Orders * AOV CVR = orders / sessions CPM = cost / (impressions / 1000) CPC = cost / click CPS = cost / session

The system does a final calculation for Return on Ad Spend (ROAS) ROAS = revenue / cost

Main code files:

  • App.js (all react component code lives here for now. Hope to split into components once functionality is complete)
  • index.js (places all the App.js components onto the javascript dom with ReactDOM.render)
  • base.css (an unminified version of the water.css styles to quickly style my inputs and fieldset)
  • switch.css (css styling for the switch ui)

Still configuring all the parts

ForecastDashBoard - - Manages state of all the numbers - Calculates return on ad spend to send to result block

BlockInputs

TextAndSliderInput

TextInput

ToggleSwitch

ResultBlock

About

https://ifelawal.github.io/forecasting-sliders-react/


Languages

Language:JavaScript 77.2%Language:HTML 11.9%Language:CSS 10.9%