DEV Community

Cover image for How to Create Custom Subdomains on Vercel, Heroku and Netlify
Idris Abdul-Lateef
Idris Abdul-Lateef

Posted on • Originally published at eedris.hashnode.dev

How to Create Custom Subdomains on Vercel, Heroku and Netlify

Introduction

After you finish building a project, you'd usually want to take it out of your localhost and put it somewhere else where you or others can access it from as well. The next point of call would be to deploy the project to any of the several cloud hosting platforms available.

Some of these hosting platforms even give you free hosting and if you are like virtually every other developer, chances are that's what you'd be opting for. Of course, what you get is a subdomain and limited resources—but that is often more than enough for most stuff you'd be building. You're usually able to set the subdomain name from which your project will be accessed at the point of deployment. But, as it happens sometimes, your preferred subdomain may already be taken (or maybe you're just in a hurry) and you may opt for an auto-generated subdomain name which you can change later on if you wish.

However, after coming across several sizable projects (and even a personal portfolio site!) with auto-generated subdomains of the "notorious-badlands-47642.hostingplatform.app" kind, it became clear to me many either don't know they can customize their projects' subdomain names or just don't know how to. And that was why I set out to write this article. Picking three among the top cloud hosting platforms used by developers, I'd be showing you how to do just that.

Vercel

1) Log in and click on the project whose subdomain name you want to change

Image description

2) After it opens up, go to the settings page and click on "Domains"

Image description

3) Click on the "Edit" button on the particular domain you want to change

Image description

4) Edit it and click on "Save" after you are done

Image description

5) That's it! Your new Vercel subdomain is ready.

Image description

Heroku

1) Log in and click on the project whose subdomain name you wish to change

Image description

2) After it opens up, click on "Settings"

Image description

3) Change the text in the "App name" input field to your preferred subdomain name and click on "Save"

Image description

4) Done and dusted! Your new Heroku subdomain name is set.

Image description

Netlify

1) Log in and click on the project whose subdomain name you want to change

Image description

2) After it opens up, click on "Domain settings"

Image description

3) Under "Custom domains", click on "Options", then on "Edit site name"

Image description

4) Input your preferred subdomain name and click on "Save"

Image description

5) Just like that—you've got a new Netlify subdomain name!

Image description

Conclusion

Whatever it is you're building, presentation is always important. Be it your personal side project or your portfolio site, the domain name is the first point of contact for all who will behold whatever you've built. Random strings spat out by an algorithm do not make for a presentable domain name.

Hopefully, with all the info in this article, your "notorious-badlands-47642" days are over! 😉

Top comments (0)