JSFiddle - React, Tailwind, and code Playground

by Damian Dulisz

HTML

<h1>🎄Hello!🎄</h1>

<a id="message" target="_blank">

</a>

CSS

body {
  font-family: 'Lato', sans-serif;
}

JavaScript

const encodedMessage = [
  {
    "letter": "-",
    "order": 105655217040238
  },
  {
    "letter": "p",
    "order": 41000531985764
  },
  {
    "letter": "f",
    "order": 88308838123184
  },
  {
    "letter": "z",
    "order": 74116346281958
  },
  {
    "letter": "r",
    "order": 89885781661098
  },
  {
    "letter": "s",
    "order": 6307774151656
  },
  {
    "letter": "u",
    "order": 23654153068710
  },
  {
    "letter": "/",
    "order": 44154419061592
  },
  {
    "letter": "w",
    "order": 58346910902818
  },
  {
    "letter": "1",
    "order": 107232160578152
  },
  {
    "letter": "r",
    "order": 31538870758280
  },
  {
    "letter": "t",
    "order": 66231628592388
  },
  {
    "letter": "p",
    "order": 4730830613742
  },
  {
    "letter": "y",
    "order": 70962459206130
  },
  {
    "letter": "-",
    "order": 72539402744044
  },
  {
    "letter": "d",
    "order": 17346378917054
  },
  {
    "letter": "n",
    "order": 93039668736926
  },
  {
    "letter": "r",
    "order": 47308306137420
  },
  {
    "letter": "t",
    "order": 3153887075828
  },
  {
    "letter": "u",
    "order": 78847176895700
  },
  {
    "letter": "k",
    "order": 77270233357786
  },
  {
    "letter": "d",
    "order": 50462193213248
  },
  {
    "letter": "p",
    "order": 45731362599506
  },
  {
    "letter": "i",
    "order": 26808040144538
  },
  {
    "letter": "i",
    "order": 18923322454968
  },
  {
    "letter": ":",
    "order": 7884717689570
  },
  {
    "letter": "i",
    "order": 100924386426496
  },
  {
    "letter": "j",
    "order": 104078273502324
  },
  {
    "letter": "c",
    "order": 80424120433614
  },
  {
    "letter": "z",
    "order": 64654685054474
  },
  {
    "letter": "a",
    "order": 59923854440732
  },
  {
    "letter": "u",
    "order": 15769435379140
  },
  {
    "letter": "o",
    "order": 48885249675334
  },
  {
    "letter": "/",
    "order": 9461661227484
  },
  {
    "letter": "s",
    "order": 97770499350668
  },
  {
   ...