Oh Glitch.. Now What?
Published:
Since Glitch (Now owned by Fastly) made the announcement in May about the closing down of project hosting and user profiles on 8 July, along with the stopping of Glitch Pro subscriber, we have received a number of requests for help and guidance with the "what next" question.
If you would like to read Glitch's announcement you can find it here on their changes-are-coming-to-glitch blog post
We have now received replies from the follow up info we provided to a number of the people that asked us questions in the first place, with many surprised as to features or options they did not know existed. So we decided to share our views here in the hope that its helpful to someone else as well.
So the first key task is to move your data out of Glitch, our recommendation is to move it to GitHub.
Why?
Well firstly you have been using Git within Glitch.
GitHub is free to use (or paid if you want) and offers a full feature set making it a great home for any project.
Plus if you give each project a home at GitHub, for each project you can choose to make it public or private. Once you have your project within a repository on GitHub you have a number of choices.
Though there are also other Git hosting platforms available like GitLab, Bitbucket, Azure Repos and the newly released Gitlip which has some interesting options.
Plus you can also have a self hosted storage option Gitea, or if you are a much larger company some of the above options have enterprise versions which you host on your network once you have a licensing deal.
Live Editor
One of the common requests we got was asking about "editing and working with projects going forward".
Well GitHub offers a number of options, you can use GitHub.dev web-based editor from your browser to edit and make changes this option however does not have a terminal / console to enter command line requests, though is a super option as you don't need to install anything to get working.
Again if you want to start a new project you can also use GitHub.dev, firstly you would login to GitHub, create a new repository, fill in the wizard options its important to create a readme.md, once your repository is created press . or shift + > (we have a clearer definition of these steps on our HTML Quick start page)
We have covered committing changes within GitHub.dev in our Staging & Commits docs page. We have also covered making a branch for a working copy of your website from within GitHub.dev in our docs Lets Make an Edit page.
If you are working with HTML & CSS and want a preview then adding the CodeSwing extension is very useful, its covered in our docs at Install CodeSwing
GitHub Codespaces
Another option available is to start a GitHub Codespace on the repository, this offers you a virtual machine development environment which is great as any Nodejs modules you install are only in this environment and not your local machine.
GitHub Codespaces is a paid service which has a great free tier with 60 Hours free each month upwards, depending on your GitHub subscription plans. We have covered GitHub Codespaces in our docs.
This usage tier can go a long way each month if you end the Codespace once you are finished, plus close the storage, again this is covered in the Codespace Storage section of our GitHub Codespaces page.
If you want to preview your HTML & CSS then you can install the Live Preview extension from Microsoft, which hosts a local server in your workspace for you to preview your webpages on. We have covered this in the Creating a Codespace section, steps 5 & 6.
Whilst our tutorials don't as yet cover starting a new project using GitHub Codespaces, you would create a new repository making sure you create a readme.md then, you could follow the steps on our docs GitHub Codespaces page to get your GitHub Codespace up and running.
Other editors are available
Some other Code editors and in browser platforms options available are Codesandbox, StackBlitz, firebase.studio, Codepen, Jsfiddle, Replit and livecodes to name just a few, many have a free tier which means you can go explore and find out if you like one better than the others, or which one suits your working style better.
I was using Glitch to Host my project
So if you move your projects to GitHub you can then link a Hosting provider to that repository, a number of services are available such as GitHub Pages, Cloudflare Pages / Workers, Azure Static Web Apps, DigitalOcean App Platform, Netlify, Firebase, Google Cloud Run to name a few. Each of these offer a number of features and options but all allow you to deploy from a repository.
A key benefit of using one of these options is if you update your repository a new deployment will take place to update your hosted version. Plus some of these services will allow you to preview changes made in a branch or pull request within the browser.
We currently only have details for GitHub Pages in the docs at Set up GitHub Pages.
We have written about domains which you will find in the docs under Domain Names. However we have not written about adding a custom domain name to GitHub pages as we heard from our feedback that their docs cover it really clearly. You will find the details at about custom domains and GitHub Pages this will also be linked from our docs page GitHub Pages.
Please Note that GitHub Pages set limitations on what you can host with them e.g e-commerce & commercial use, for full details please read their docs Prohibited Uses on GitHub.
Mostly the above hosting options all work in the same sort of way as GitHub Pages, so its the same type of steps for each of them, but all seem to offer clear steps in their sign up.
We should also point out to always set a spending limit if you use any other option than GitHub Pages, or else you might get a nasty suprise on your credit card or in your email account.
Account options available might be Free with fixed limits, Monthly fixed fee or pay as you go monthly billing.
If you run into an issue setting up your website feel free to ask us on the contact form, and we will see what we can do to help.
Once you have set up the hosting you will need to make the changes to your domain name records to point to the new home. If you where using a Glitch provided URL you will be able to configure a redirect to your new home.
Other hosting options that might be a good fit for you are Replit, Valtown and Fly.io
Embedded Glitch
So lastly if you were using Glitch to embed a sample/example into your website, depending on the number of files your example has we have a number of options available to us.
GitHub Gist's can be embedded within a webpage, you will find a script tag in the top left corner of your gist that you can add to your webpage, or you can write your own import code to call the Gist. Codesandbox, StackBlitz, Codepen, Jsfiddle Replit also offer embedding options.
Or you could move to using HTML pre & code sections, though if you wanted your code blocks to have Syntax highlighting then you would need to add a JavaScript library like PrismJS
If you want to take this further you could use Sandpack from Codesandbox which includes a Nodebox—a fast Node.js runtime that allows you to run server-side code in any browser that can be embedded within your web page.
Self hosting
If you would like a more self hosted option then there indiepen, livecodes and googles playground-elements that can be self hosting.
What should the ideal option be?
This is an area on the web that we're not sure is fully solved yet, as you always want the examples to be version controlled and have different styling requirements per site, or per section of that website.
Gist's, custom embedding code, and styling with good caching options can go a long way to solving this, but you are still updating the Gist and webpage in different places. Again not a feature every website owner has but still very widely used.
What's your views on displaying code examples on a webpage that's available today? Let us know what you think is still missing using our contact form.
We know we won't have covered every aspect of replacing Glitch in your workflow, but hope we have given you some food for thought in the options that are out there. As always if you have a question reach out to us using the contact form we are open to updating this page with useful information.
Useful Glitch links
Glitch provided Migration Guides
Redirect your .glitch.me subdomains!