Vue.js

index.html

<div id="app">
    <h1>{{ header }}</h1>
    <p>Feel free to edit the HTML, JavaScript and CSS in this playground. The preview will update in real-time, so that
        you can visually explore your ideas.</p>
    <button @click="sayHi">Say Hi! <span class="fa fa-heart" /></button>
</div>

playground.json

{
  "scripts": [
    "vue"
  ],
  "styles": []
}

script.js

new Vue({
    el: "#app",
    data: {
        header: "Hi, I'm GistPad! 👋"
    },
    methods: {
        sayHi() {
            alert("Hi!");
        }
    }
});

style.css

body {
    background-color: rgb(69, 170, 204);
}