JSFiddle - React, Tailwind, and code Playground

HTML

<label for="burger-name">Enter your name or a phrase to generate your burger (minimum 4 characters)</label>
<input id="burger-name" value="">

<h2>
    Your burger ingredients
</h2>
<ul>

</ul>
<h2>
    Markdown to share your creation!
</h2>
<button>
   Copy Markdown to Clipboard!
</button>
<label for="md">Markdown to copy to your comment for your burger (don't forget to leave a rating out of 10 (10 = delicious, 1 = awful!) and if you want give it a hilarious description!)</label>
<textarea id="md" style="width: 100%;" rows=15></textarea>

CSS

label{
  display: block;
  margin-bottom: 0.3rem;
}

ul{
  min-height: 7rem;
}

input, 
textarea{
  padding: 0.2rem;
}

button{
  border: 0;
  padding: 0.5rem 0.25rem;
  background: #222;
  color: #fff;
  margin-bottom: 0.5rem;
}
button:focus{
  outline: 3px solid #444;
  outline-offset: 3px;
}

JavaScript

var config = {};

config.buns = {};
config.buns.options = ["brioche", "sesame seed", "brown bread", "crusty", "English muffin", "ciabatta", "plain bagel"];
config.buns.count = config.buns.options.length;
config.buns.quantityDistribution = [1];
config.buns.chanceZero = 0;

config.patties = {};
config.patties.options = ["beef burger patty", "Quorn burger patty", "bean burger patty", "chicken breast burger patty", "portobello mushroom burger patty", "fried chicken burger patty", "turkey burger patty", "elk burger patty", "wagyu beef burger patty"];
config.patties.count = config.patties.options.length;
config.patties.quantityDistribution = [12,8,3,1];
config.patties.chanceZero = 0;

config.sauces = {};
config.sauces.options = ["mayo", "ketchup", "bbq", "sweet chilli", "salsa", "guacamole", "sour cream and chives", "maple syrup", "green pesto", "red pesto", "french mustard", "american mustard", "horseradish", "ranch dressing", "teriyaki sauce", "hot sauce", "Sriracha Butter", "wasabi", "chow chow", "Gochujang", "hoisin", "chimichurri"];
config.sauces.count = config.sauces.options.length;
config.sauces.quantityDistribution = [10,7,4,1];
config.sauces.chanceZero = 0.1;

config.toppings = {};
config.toppings.options = ["bacon", "tortilla chips", "turkey bacon", "chorizo", "serrano ham", "fried egg", "hash brown", "french fries", "sweet potato fries", "ready salted crisps (potato chips)", "pulled pork", "salami", "chilli con carne", "onion rings"];
config.toppings.count = config.toppings.options.length;
config.toppings.quantityDistribution = [10,8,6,3,1];
config.toppings.chanceZero = 0.1;
 
config.cheeses = {};
config.cheeses.options = ["american cheese", "gouda", "mexicana cheese", "brie", "blue cheese (stilton)", "grilled halloumi", "parmesan", "swiss cheese", "goats cheese", "ricotta", "monterey jack", "mozerella", "cream cheese"];
config.cheeses.count = config.cheeses.options.length;
config.cheeses.quantityDistribution = [9,7,5,1];
config.toppings.chanceZero = 0.15;
...