Question

Implement a wildcard sub-domain just like the one on Vercel, Netlify, WordPress, Tumblr, and many others

Posted September 3, 2021 109 views
DigitalOceanAPI

I’m not sure if this is the right place to ask this, but

I am talking about when you create a new blog with Tumblr, you can create your domain *.tumblr.com, or when creating a deployment on Vercel or Netlify, you can have *.vercel.app or *.netlify.app

I get the gist that it’s maybe using a wildcard sub-domain, and some API since the user can create it through the app, but how do you build or what tools do you use to build something like that?

Or if you can point me out to where I can learn how to build something like that, I would be very grateful.

These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.

×
Submit an Answer
1 answer

Hi there @meepomodeon,

This is a nice topic!

I actually recently built a similar thing for https://devdojo.com/devblog where users can get their own blogs based on their usernames, eg. username.devdojo.com.

What I did was:

  • First create a wildcard A record DNS entry for *.devdojo.com to point to my Droplet’s IP address.

  • Then I created a default Nginx server block that catches all of the subdomains, I did that by setting the server_name to: .devdojo.com;, note the dot before the domain name.

  • As I am using Cloudflare, I took advantage of the free SSL certificate that they offer to cover all of the subdomains so that the subdomains were also secure.

  • Then finally on an application-level I would check the domain and server the relevant content for each site.

Hope that this helps!
Regards,
Bobby

  • Hi @bobbyiliev, thanks for the reply!

    I know right! I feel like this is an exciting topic but it’s very hard for me to find resources to learn the detail about this

    Ah I see, using Cloudflare to handle SSL for the subdomains is a very good suggestion
    I’ll sure look more into it

    But, can you elaborate more about “…check the domain and server the relevant content for each site”?
    Also when “…user gets their own blog based on their usernames”, how did you do it?
    Did you just register them in a database table or did you need to create a directory on the server for each user when they created an account?

    I’m basically dumb about this stuff.
    I’m assuming that you’re doing it on the server-side of your app, right?
    Did your server checked for each incoming request and redirect them?
    What backend server did you use (node, PHP, Python)? and what’s API did you use to do the redirect?

    I’ll be very grateful if you could point me out to where I can learn about this or just some keywords I need to look for when searching about this topic.

    Regards,
    Ongki

    • Hi there,

      There are no redirects actually. As I’m using Laravel, it is quite handy as this functionality more or less comes out of the box. There is a way to do a route grouping with a subdomain.

      For more information you can take a look at the documentation here:

      https://laravel.com/docs/8.x/routing#route-group-subdomain-routing

      Thanks to this I did not have to reinvent the wheel and come up with my own application logic on how to do this.

      This with a combination of the wildcard DNS entry and the wildcard Nginx server block works very well.

      This is one of the main things I like Laravel so much, there are a lot of challenging things that are already solved and come out of the box with the framework or the surrounding packages.

      Hope that this helps!
      Best,
      Bobby