Glitch combines a real time collaborative editing platform with a hosting service that has hooks into Github. Put another way: Glitch is Heroku with a built in editory.
In short, it's a place to create and host apps
Using Glitch as an origin with Fastly is relatively easy. By default glitch creates a random subdomain for every app you create (EG: https://solipsistic-horse.glitch.me
) however you can change that to whatever you want (EG: https://tf-motd-demo.glitch.me
).
Once you have your app up and running and have made note of your URL you're ready to configure fastly.
On the Fastly side you use your Glitch URL as the backend under Origin
=> Hosts
. You can use whatever domain you like, however I suggest setting up a personal domain, and then pointing it's wildcard at Fastly. I use *.drl.fyi
so that every new app I spin up is just foo.drl.fyi
or blah.drl.fyi
.
In addition to setting up the backend and domain there are three two VCL snippets you need to set up (a snippet with a subroutine which goes in init
then two snippets to call it, one for miss, one for pass)
-
Priority: 100
-
Type: init
SNIPPET
sub miss_or_pass {
if (req.backend.is_origin) {
set bereq.http.host = "tf-motd-demo.glitch.me";
}
}
-
Priority: 100
-
Type: miss
SNIPPET
call miss_or_pass;
-
Priority: 100
-
Type: pass
SNIPPET
call miss_or_pass;
One of the good things about Glitch is that you can import and export apps to and from Github. To do this simply go to Glitch, click the New Project
button in the upper right hand corner, and select Import from github
Here is a demo you can use to try things out.
If you are using an app from the Fastly Demo Libary you should see a file called env-template
which will list all of the environment variables that app uses. You'll have to create a .env
file from within Glitch and populate those variables. Remember, the template is just there to tell you what you need to fill in DO NOT PUT PRIVATE DATA IN THE TEMPLATE
If you've followed the steps above you should have a working app hosted on Glitch, served via fastly. IMPORTANT NOTE: Glitch puts apps to "sleep" after 10 minutes of inactivity however you are allowed and encouraged to set up a "keep-alive" ping so long as you stay under 10K requests per hour. If you look at the MoTD demo app you'll notice that there is a /healthcheck/check
endpoint within the app. This is so you can point Fastly's healthchecks at this URL to keep the app from sleeping.