<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Idris Abdul-Lateef</title>
    <description>The latest articles on DEV Community by Idris Abdul-Lateef (@eedris).</description>
    <link>https://dev.to/eedris</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F732196%2F0ba178d0-13eb-4777-a0df-5c726cacbe9c.jpg</url>
      <title>DEV Community: Idris Abdul-Lateef</title>
      <link>https://dev.to/eedris</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/eedris"/>
    <language>en</language>
    <item>
      <title>How to Create Custom Subdomains on Vercel, Heroku and Netlify</title>
      <dc:creator>Idris Abdul-Lateef</dc:creator>
      <pubDate>Tue, 14 Jun 2022 01:28:13 +0000</pubDate>
      <link>https://dev.to/eedris/how-to-create-custom-subdomains-on-vercel-heroku-and-netlify-4afl</link>
      <guid>https://dev.to/eedris/how-to-create-custom-subdomains-on-vercel-heroku-and-netlify-4afl</guid>
      <description>&lt;h2&gt;
  
  
  Introduction
&lt;/h2&gt;

&lt;p&gt;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.&lt;/p&gt;

&lt;p&gt;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.&lt;/p&gt;

&lt;p&gt;However, after coming across several sizable projects (and even a personal portfolio site!) with auto-generated subdomains of the &lt;strong&gt;"notorious-badlands-47642.hostingplatform.app"&lt;/strong&gt; 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.&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Vercel
&lt;/h2&gt;

&lt;p&gt;1) Log in and click on the project whose subdomain name you want to change&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--F7Qui7KD--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tnztd4qhku22gv5djhpy.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--F7Qui7KD--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tnztd4qhku22gv5djhpy.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;2) After it opens up, go to the settings page and click on &lt;strong&gt;"Domains"&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--VoupkJVN--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gkh7r4sjjh6t4mojy81a.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--VoupkJVN--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gkh7r4sjjh6t4mojy81a.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;3) Click on the "Edit" button on the particular domain you want to change&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--ysLDCfEs--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qkxianc903jeu2u7ins5.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ysLDCfEs--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qkxianc903jeu2u7ins5.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;4) Edit it and click on "Save" after you are done&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--AVKr_TDJ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/57od7s7b1g9dni5hki36.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--AVKr_TDJ--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/57od7s7b1g9dni5hki36.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;5) That's it! Your new Vercel subdomain is ready.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--BJidC4OP--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/reyj28jpu23y7p0e5i74.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--BJidC4OP--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/reyj28jpu23y7p0e5i74.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Heroku
&lt;/h2&gt;

&lt;p&gt;1) Log in and click on the project whose subdomain name you wish to change&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--dEFDbqtW--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9w631feag2smhnvnwcs4.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--dEFDbqtW--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9w631feag2smhnvnwcs4.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;2) After it opens up, click on &lt;strong&gt;"Settings"&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--tIwDT12e--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/brhmymqjrfc24rej4k6t.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--tIwDT12e--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/brhmymqjrfc24rej4k6t.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;3) Change the text in the &lt;strong&gt;"App name"&lt;/strong&gt; input field to your preferred subdomain name and click on &lt;strong&gt;"Save"&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--fVrBTShi--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m3xxared1l7uqbmmfgro.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--fVrBTShi--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/m3xxared1l7uqbmmfgro.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;4) Done and dusted! Your new Heroku subdomain name is set.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--4BtSoyXS--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tj7u778s6on493qfiqvn.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--4BtSoyXS--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tj7u778s6on493qfiqvn.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Netlify
&lt;/h2&gt;

&lt;p&gt;1) Log in and click on the project whose subdomain name you want to change&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--FDrh3LwU--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qfxg1ua0bmshgvughl2o.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--FDrh3LwU--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qfxg1ua0bmshgvughl2o.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;2) After it opens up, click on &lt;strong&gt;"Domain settings"&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--F4-byCmb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/opfn5p9wuq05nfv949jb.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--F4-byCmb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/opfn5p9wuq05nfv949jb.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;3) Under &lt;strong&gt;"Custom domains"&lt;/strong&gt;, click on &lt;strong&gt;"Options"&lt;/strong&gt;, then on &lt;strong&gt;"Edit site name"&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--plFWKuce--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0drunavtb439rqyml6w0.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--plFWKuce--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0drunavtb439rqyml6w0.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;4) Input your preferred subdomain name and click on &lt;strong&gt;"Save"&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--mQ1-HuvD--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jm83fczrvwn2f4vl7bci.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--mQ1-HuvD--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jm83fczrvwn2f4vl7bci.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;p&gt;5) Just like that—you've got a new Netlify subdomain name!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--MwWYwZb6--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uts3eojqcsh5plej9s7p.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--MwWYwZb6--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/uts3eojqcsh5plej9s7p.png" alt="Image description" width="880" height="469"&gt;&lt;/a&gt;&lt;br&gt;
&lt;br&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;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.&lt;/p&gt;

&lt;p&gt;Hopefully, with all the info in this article, your &lt;strong&gt;"notorious-badlands-47642"&lt;/strong&gt; days are over! 😉&lt;/p&gt;

</description>
      <category>netlify</category>
      <category>vercel</category>
      <category>heroku</category>
      <category>hosting</category>
    </item>
  </channel>
</rss>
