[Tutorial] Get your Glitch project on a domain!

Hey there! Many Glitch users probably wan’t their Glitch project on a custom domain. That’s why I’ve made this tutorial for you to use!

Note: this tutorial is long, but it does have pictures! :smiley:

Step 1: Setup your glitch project

You obviously need a Glitch project to work with, so first go ahead and create one.

But wait… You aren’t going to get away with just making an sort of Glitch project.

You need to make a Hello Express project.

We’re nearly done with step 1 but next is security.

Now we have our express server running, we should force HTTPs.

To do so place the following code in your express server’s code:

function checkHttps(req, res, next){
  // protocol check, if http, redirect to https
  
  if(req.get('X-Forwarded-Proto').indexOf("https")!=-1){
    return next()
  } else {
    res.redirect('https://' + req.hostname + req.url);
  }
}

app.all('*', checkHttps);

But, it must go first. Put it after var app = express(); Thus, making sure it is the first thing checked.

Step 2: Get your Glitch app flying

Ahh, here we finally are: step 2.

First, create an account at fly.io. It should be dead simple.

Now, log into your account if you haven’t already.

Navigate to the button where it says Sites and click it. If the button isn’t there go to https://fly.io/sites

It will redirect you to a page like this:

Now you can click the big button that says Add new site!

Then you will reach this page:

Select the Hosting Service radio button then click the button beneath that says Glitch

An extra little box will appear bellow:

In it type your Glitch project domain. Be careful!

Instead of https://myproject.glitch.me or http://myproject.glitch.me put myproject.glitch.me. Since fly doesn’t accept the http or https part.

Now you can click Preview your site.

Then you can click Set your hostname!
You will be greeted with another prompt.

Now type in the hostname your going to use. For example I’d put in mywebsite.tk

Now click Next, configure DNS.

It will bring you to a different screen.

Ignore what it says and just click the button that says Got it!

You will then be welcomed to a magical dashboard that looks like this:

That’s the end of step 2!

Step 3: Get your app on your domain!

Now it’s time to get out some wizardry magic.

POOF.

Ok, so open up a terminal (Linux & MacOS) or Command Prompt (Windows).

Then on your magical dashboard open the preview link. (Preferably in a new tab).

If it says something like Not Found then you’ll just need to wait. But you can still carry on this guide.

Now in your terminal type the following:

Note: Remove the https / http from the URL before pasting it bellow.

  • Windows users:
ping PUTYOURURLHERE
  • Linux/MacOS users:
dig PUTYOURURLHERE

Now you will notice an IP will display on the screen.

Example (Command Prompt):

Example (Terminal):

Now write down the IP on a piece of paper or just type it out into Notepad or something. You’ll need your IP later.

  • Now go to your DNS provider’s DNS managment area -

Now, this is where the IP comes in usefull.

You’ll get a box similar to this:

Now, leave the Name part alone.

Now set the TTL part to 14440.

In the Target box enter the IP address you wrote down.

Now save that then your nearly done.

Now, go back to your magic control panel. Then click Middleware

image

You will then be taken to a page that will look like this:

You can enable whatever you want but you must click the Add button for HTTPS Upgrader.

That’s it! You should be set to go!

Note: It can take while for your DNS provider’s name servers to update!

Thanks for reading!

Have a nice day!

This took me quite a while to produce, so I’d love your feedback!

Note: Thank you for all the :heart:!

44 Likes

I don’t understand step 1 how do I make a project “Hello Express”? I followed all other steps but idk what to do now

1 Like

it’s no longer required, custom domains have now be included in glitch

5 Likes

Ohhhh How do I do that exactly/

1 Like

Hello @smorezsun, before you can use the built-in Glitch custom domains first you need to help a couple of folks out in the the glitch.com help area

image

Built-in custom domains are a feature that’s turned on for people who are helping out others in the community.

Until you’ve racked up a couple of “Thanks!” notes you can still use this Tutorial to set up a custom domain using fly.io. To answer your question,. the “Hello Express” app mentioned here is just an example - you can use any Glitch project for the subsequent steps.

3 Likes

oh ok. I help people on threads? How many do I have to help

1 Like

The custom domains are a recognition for being thanked for your help anywhere in the Glitch community; you can read a little more about the feature at https://glitch.com/help/how-can-i-get-help-with-code-in-my-project/.

One common way to help people and be thanked is to see someone asking for help on the glitch.com homepage (that’s where the picture I included is from) but people can thank you for anything, including helpful comments in the forum. You’ll have to be thanked twice for the custom domains feature to become available. Once active on your profile you’ll see it under each project’s Advanced Options menu:

image

image

4 Likes
`    I am having a pro. blem
    I did everything as was said.
    But it throws ERR_NAME_NOT_RESOLVED
     Please help
    Images

    If anyone is wondering
    I am using freenom
    As same as the tut.~~

ignore what I said above.

1 Like

It takes a while for domain names to process through. They’re usually ready in 48 hours or less.

2 Likes

I just don’t think they’re ready yet…
I keep having problems like invisible assigned domains (x is used by another project already etc.).
This apparently also is a common problem in the support forum here…
I’n now using my own method (see my glitch project znw-router) and propagations and changes now reflect in seconds.
So, if you want a proper solution until glitch fixes it for everybody, you can use my method(proxying the full request/response) (requires a dedicated glitch project / node instance for the routing).

2 Likes

I’ll agree that there’s still a fair amount of work to be done on Custom Domains; we wanted to get it out to you folks as soon as we could and released a small MVP (minimum viable product) of the feature so people could start using it. We’re also aware of a new bug meaning that new custom domains don’t display the necessary shw.io domain when you add one. Support is happy to assist with either of these issues whenever they arise, and we’re sorry for the inconvenience.

That said there are over 500 custom domains associated with Glitch projects so far, so it’s clearly going well for some folks at least, and often without any direct support from us.

All of that said, however, the Custom Domain solution we’re still working on isn’t going to work for everyone in every case, and we’re always happy to see community members come up with and share the solutions that work for them, So thanks for posting this!

Lastly, @blubbll I’m happy to continue working directly with you to get your custom domains working in Glitch if you’d like. That goes for anyone else who’s having problems with the Custom Domains feature (which isn’t simple in the best of times because nothing related to DNS ever is as simple as we’d hope it would be) as well!

1 Like

Can you multiple ports when you have a custom domain?

1 Like

Hi @MKDev, no, the port routing is unrelated to domains. Right now we don’t have any plans to change the port scheme, even in some of the paid tiers that we are considering - changing how we handle ports would take pretty substantial work across our entire infrastructure.

2 Likes

i cant see the sites tab ): please help

1 Like

You shouldn’t have to use that method any more - you can add a custom doamin from within Glitch directly from the Tools menu in the bottom left of the editor. More detail here: https://glitch.com/help/custom-domain/

1 Like

I cant get anybody to help

1 Like

How far in the outlined process above did you get before getting stuck? If you let me know the specific issue you’re having then I can help. Unfortunately, we can’t set it up for you.

1 Like

There is no “Sites” tab anywhere

This does not exist

1 Like

1 Like

Sure, but as I mentioned above, you don’t need to use that method to add a custom domain any more - you can add a custom doamin from within Glitch directly from the Tools menu in the bottom left of the editor. More detail here: https://glitch.com/help/custom-domain/

1 Like