JSFiddle - React, Tailwind, and code Playground

by Trevor W

HTML

<table>
  <tr>
    <th>Month</th>
    <th>Total Revenue</th>
    <th>Monthly Revenue</th>
    <th>MRR</th>
  </tr>
</table>

JavaScript

let monthlyFee = 5
let conversionRate = .10
let keywordVol = 74000
let clickRate = .80
let newMonInc = ((keywordVol * clickRate) * conversionRate) * monthlyFee

let month1Churn = 1 - 0.5
let month2Churn = 1 - 0.25
let month3Churn = 1 - 0.2
let month4to9Churn = 1 - 0.15
let month9to18Churn = 1 - 0.1
let month18to48Churn = 1 - 0.05

function formatUSD(number) {
    return new Intl.NumberFormat('en-US', {
        style: 'currency',
        currency: 'USD',
    }).format(number);
}


let totalRevenue = 0;
for (var i = 1; i <= 48; i++) {
	let x = i;
	let mrr = 0;
  let revenue = 0;
  let currentAmount = newMonInc;
  while(x >= 1){
    
    revenue = revenue + currentAmount
  	if(x === 1){
      currentAmount = currentAmount * month1Churn
    }else if(x === 2){
      currentAmount = currentAmount * month2Churn
    }else if(x === 3){
      currentAmount = currentAmount * month3Churn
    }else if(x >= 4 && x <= 9){
      currentAmount = currentAmount * month4to9Churn
    }else if(x >= 9 && x <= 18){
      currentAmount = currentAmount * month9to18Churn
    }else if(x >= 18 && x <= 48){
      currentAmount = currentAmount * month18to48Churn
    }
     
    mrr = mrr + currentAmount;
  	x--;
  }
  totalRevenue = totalRevenue + revenue;
 

	let row = "<tr>";
  row +="<td>"+i+"</td>";
  row +="<td>"+formatUSD(totalRevenue)+"</td>";
  row +="<td>"+formatUSD(revenue)+"</td>";
  row +="<td>"+formatUSD(mrr)+"</td>";
  row +="</tr>";
	$("table").append(row)
}