Intro

This month Glitch.com shut down, ending hosting for the projects there. They gave folks about a month to migrate their projects off the site. This also included paying customers, like me, who had the pro plan which cost $99 a year. A month is not a very long time at all, especially for paying customers, but that’s just like my opinion. The bottom line is they cut the power, so all of my projects there are gone, so after being salty about it I spent time this weekend doing the worst, most boring thing, maintenance on my personal hobby projects…

Flowers for Glitch

The way it ended is very lame, but I forgive them since it was really cool while it lasted. It basically solved the problem you encounter when you want to quickly make a website that requires a backend or a server. They leveraged container technology to have teeny tiny servers spin up whenever the url is requested allowing you to do complex backend sites stuff without having to have a dedicated server. You could also do static webpage hosting but the container stuff was the big deal. They also made a decent web based editor GUI for working with the code in real time and allowed you to fork and collaborate on projects. I think if you were to imagine Geocities for today it would look like Glitch.

For me it was useful for me in two ways. First was for my little personal projects that I spend too much time on. I don’t really want to worry about maintaining a lot of servers or paying for expensive services like Heroku. Glitch was perfect for that, I always tried to make my little bauble projects static webpages but if I couldn't, due to needed backend functionality then I would use Glitch, and I happily paid (if you paid for pro you were allowed to have X number of projects always running, giving a faster load time) to not have to worry about their infrastructure.

The second more important reason though was Glitch’s pedagogical uses. For a number of years I taught an intro to interface development class. It was mostly library science students at first but then became more UX/UI students. The problem with designing interfaces is that you have to make them eventually. I guess if you are lucky you can have someone else make them. But I wanted these students who were good at thinking about design concepts to get experience around the work behind actually making a web interface.

Glitch solved this problem because “real” interfaces have data, data means backend and I don’t want to have to maintain that infrastructure or add another layer of difficulty for these new to tech students trying to get things working on their own laptop. The other aspect glitch was great for teaching is because I created a number of starter projects on glitch that have everything needed for a real world project except the interface. So all the database backend and data was populated, the routes and logic to the different pages were ready to go, there was an API built into the backend for them to use when ready. They could just focus on building the interface. Glitch accelerated this to the point where I had them choosing a starter project and we began working on a real life interface within the first 3 hour class, it was great.

Glitch doesn’t work anymore, so I can’t link to the starter projects I made but I uploaded their code and data (sqlite dbs) to Github, you can get a sense of the type of projects the students had to choose from:

• NYT Best Seller Database: Had a couple thousand books in the database, hosted book cover images. A perfect project for library students to make their own book based user interface
• Museum Interface: Had 100s of cultural heritage sites across the world with dozen of facets, a good project for students interested in GIS (Geographic information system)
• Movies (IMDB-esqu) Interface:Had 1000s of movie metadata records and hosted movie posters, similar to the NYT book project but for film.
• Recipes Interface:A recipe database interface, facets, search, etc.

Allowing the student to pick which domain seemed most interesting to them and I would challenge them to think broadly on what a Book/Movie/whatever interface could be like. A lot of the students would make wireframes and then each week for about 4 weeks we would go through building the HTML, applying CSS, enriching with javascript functionality. At the end they would have a fully working site of their own design. At that point we would go on to more complex topics like single page applications or more elaborate API usage, etc.. Some students would move on to localhost development, running things on their own laptops but some students really liked Glitch, and would do the rest of the class using it which is great because it makes sharing and getting help from me very easy. If I were teaching still I would be in panic mode trying to figure out what to do in the Fall.

Existential Dread of Maintenance

I had about a dozen projects running on Glitch and so I have to decide what I should do with them. I both hate and appreciate these types of inflection points because it's a nice opportunity to think about things you have done and if they are important to you. But then you actually have to make a decision, keep them going or not. Any sort of tech work is mostly maintenance, although you could probably argue most of all work is maintenance. You ask yourself if you even care if this thing exists anymore? Certainly nobody else does, so it really is dependent on how I feel about them. I think most of these projects are on a spectrum between tool and creative. A lot of the more creative ones are of course an attempt to express a thought or idea. I think I enjoy that process, of creating a thing that tries to convey something and sharing it. Each subsequent attempt trying to get better at the process and execution. Unfortunately the forms they usually take is a fragile and ephemeral website. If the thing I most value is the creation and execution do I need to make sure it keeps running for the next decade or longer? Ultimately a few of these projects are embedded in blogs I wrote, so if I’m going to preserve them for the sake of the blog I might as well do all of them. And honestly the thought of deleting/archiving my “creative” projects from my homepage because they don’t work anymore is pretty depressing.

Time to Migrate

I think of the Glitch projects in three categories:

1. A static webpage, just client side javascript and assets, doesn't need a backend server
2. Had a backend server on glitch, but doesn’t really need it. Could and should exist as a static page.
3. Needs a backend server, it does some database or other functionality that requires it.

The first category is the easiest to do, we basically download the file and get it created on Github Pages for static hosting. Here are the steps to that process:

1. Download the .tar file of the project from the Glitch Dashboard
2. Extract, it should create a new folder called “app” or similar inside will be all the files, note that there will be files that start with a period (like .data) that will be invisible on most operating systems unless you are using the command line or have them turned on.
3. Create a new Github repo.
4. You can use the Web upload feature to places the files into the repo, you likely don’t want to include everything, just the parts that are needed.
5. Make sure there is a index.html file (if you have .hbs or .ejs files that is category two from the list above)
6. Go to the page settings (under settings) and turn on static hosting from the main branch.
7. If you have a domain you can set up a subdomain from your DNS settings (usually on your hosting provider) and enter that in the custom domain field. Otherwise you can use the github pages url.
8. Test it out, the most common problem would probably be that the paths are wrong for a file or asset that are not loading. So fix the HTML or adjust the file structure in the repo.
9. Go back to the glitch dashboard and use the Create Redirect to point to the new URL.

I made a silent video showing these steps if you want a visual guide. Step 7 and 8 will likely look different to you but same idea:

For the second category you may have a Glitch project that started using a backend server but it really doesn't need one. If it is just server static template pages. But it is not so easy to convert server template pages into vanilla static html. You would need to manually do it or run it locally and save off the HTML file. I had a couple like this where the backend was really only doing templates but I didn’t feel like doing the work to convert them, since I have a number of category three sites I just did the same thing with them.

Category three, these need a server. So you have to buy a server… The Glitch migration guide directs you to Digital Ocean as an example where you are buying a little 4$ server for each project. This does not scale if you have a bunch of projects like me. No way I’m paying $20-40 a month for these little tiny sites. There are other serverless options but you are building in their custom setup and honestly I don’t want to do this again if the next cool serverless hosting provider decides to shut down. I want to go old school and have my own server. So we are going to clown car these guys and try to stuff them all onto a $6 a month server.

One thing about owning a server is now you have to maintain it, which is very annoying. So if you want to make the maintenance as easy as possible, being able to restore it to a new server quickly and painlessly is really key to making it tolerable. One way of doing this is using Docker, you can configure everything into a setup file and then quickly deploy it if you need to move providers or it gets really out of date and needs to be rebuilt or whatever. My final goal is to have each site running on a subdomain of my thisismattmiler.com website. Here are the steps I went through to get it working.

1. Download the project from glitch and upload it to Github in its own repo. You can see an example here. One thing I did for all of them as I added them to Github was set up this npm script startup shortcut. It simply uses forever to run the server, sometimes its a express server sometimes its a fastify server, doesn’t matter as long as the file name is server.js
2. Now that we have the source code for all the projects hosted in Github we are going to build a single Docker image capable of running all of them, it is super simple and based on Alpine linux to be as small as possible. Here is the Dockerfile
3. Now that we have the Docker image to run each of the Apps we are going to make a compose file that has them all listed out and configured.
4. You’ll notice they map the github repo dir name to the /app directory in the image which is where it will run inside Docker, we also have an api.env that is shared by all the apps, if you have API keys or other secrets that need to be in the environmental variables you can put them into the api.env file. We also give each app its own port number.
5. If you do have an app that uses a SQLite database and you want the database to persist with new data added you want to setup the volumes and app structure like this one where you have a separate data directory where the .db file is saved outside the app directory.
6. I’m using the 1GB RAM $6 droplet server from Digital Ocean running Ubuntu, you can use any provider.
7. Install Docker.
8. I choose to run Nginx outside of a container just to make it easier to configure. Installing Nginx
9. I git cloned the docker compose file to the server. Then I git cloned each of the projects to the same directory. And ran “docker compose up” this really tested the limits of only having 1 GB of memory, building the image went fine but doing 7 concurrent “npm install” really bogged things down and one timed out. But after 15min the containers came online and were running. I would recommend you add swap space to a server with such a small amount of RAM, it degrades performance but that’s not really the goal here.
10. Now that they are running on the server I installed Let’s Encrypt and created a Nginx site config for each app in “/etc/nginx/sites-available/” and symbolic linking them to “/etc/nginx/sites-enabled/” The configs need to have the server name and the proxy_pass to the localhost with the correct port, here is what that simple config looks like:

    server {
      listen 80;
      listen [::]:80;
      server_name woodblock-shop.thisismattmiller.com;
      location / {
        proxy_pass http://0.0.0.0:8501;
      }       
    }

11. This is only set up for port 80 but we are going to use certbot to create a SSL certificate for each sub-domain. So you can follow the steps in the guide above to set up the certbot for each. You then need to add your subdomain to your DNS server mapped with an “A” record to the server’s public IP.

Of course the final step is going to replace all the URLs everywhere, even though the redirects work (until the end of 2026) I rather have the new ones in blogs and links. I did find that Github pages allow embedding, so if you embedded a Glitch project somewhere like a blog it will work with Github pages but you have to update the URL, the redirect does not work for embedded projects.

I’ll end with a checklist of projects I migrated over and a little about them.

Eclipsed Time A digital recreation of the deinstalled Penn Station sculpture/clock by Maya Lin (static site)

Woodblock Shop Lets you mashup 14K woodblock prints from Plantin-Moretus Museum and post them to a Bluesky account. (server site)

Between The Places Based off a Sol LeWitt idea, lets you build maps with an area cut out where you used to live. (server)

Anaphora Exploring speech found in the Library of Congress web archives. (static)

LCSH/Wiki Variant Browse LCSH headings to where they redirect in Wikipedia (server)

Gates of Hell I’m obsessed with Rodin the sculptor and found out there are two bicoastal Gates of Hell sculptures (posthumous casting, don’t get it twisted…aaaacutally all Gates of Hell are posthumous…) (static)

Edge Notch Card Crowdsource Tool A little tool made to transcribe some signatures for a project. (server db)

Zork Text I extracted the Text from the adventure game Zork and made a little mashup (server)

Lomax QA Tool A tool I made to compare Whisper.cpp output for a Alan Lomax project (server)

Byzantine A toy that makes a new PDF from the Web Archive of LC (server)

LC MIDI Some MIDI files I found in the LC Web Archives (static)