DEV Community

Cover image for Deploying your Work in Web Development
Ayush Agarwal
Ayush Agarwal

Posted on • Edited on • Originally published at ayushdev.com

Deploying your Work in Web Development

What is the first thought that comes to your mind when you create an excellent website with beautiful looking colors, great animations, and precise details?
Yes, you want to host/deploy it somewhere so that you can show it to your friends and mentors.

images (1).jpg

Well, then Deploying/Hosting is what I am writing in detail in this blog. I am sharing my knowledge about a few of the most helpful websites and portals that let you host your websites even if it is static i.e., with zero 'Backend.' And yes, don't' worry, all these platforms give several features for free with, of course, some limitations.

First of all, you should be proud of yourself that you have reached a stage in your development experience that you are ready to deploy your site. As a fellow developer, I know how fulfilling it is to see your website ready to be hosted. When I created my first complete site, though it was the front end only, I started jumping around, and was running around showing everyone my site feeling like I'm on top of the world. And for those who are still early in their development course, don't feel left out. Keep learning and practicing to get your website ready to be hosted too.
So without any delay, lets straight jump into the hosting techniques and platforms.

Making a Repository Folder:
Before hosting your site, it is essential to save your work with standard names and in proper folders. For example, rename the main HTML file as index.html, and all the other JavaScript and CSS files can be kept in a folder named Assets. All of this is what makes a standard repository template.

GITHUB:

Anyone who is doing or working in the field of computer science and technology must have heard this word 'GitHub.' But what many people don't hear or are not aware of is its full potential. For instance, let's take me when I first started programming and development. I only knew GitHub as a site for uploading your project. I thought it to be the 'Instagram' for coders. Jump to the present time, 1 year later, into the development field. I know many of its remarkable and exciting features. One such amazing feature is to deploy or host your web pages.

The steps to host the site is pretty simple, firstly create a project folder as I mentioned above. Create a GitHub repository with name as 'username.github.io'. One thing crucial to note is that the username should be exactly similar to your GitHub username. Add all your project file in the repo and commit changes to it. That's it is done! Enjoy your work and show it off to others. One of the many beneficiaries of hosting on GitHub is that even if you want to make changes to the website, make changes in your file and commit changes to your repo. Your website reflects the changes immediately.

If you are not familiar with Git commands, download GitHub Desktop, clone your repo in your local hard drive, and put all your files in the cloned repo. Notice the changes in the GitHub desktop and then commit the changes and publish the branch.
Well, this was just a fundamental method I told here. For more insight into hosting pages on GitHub search GitHub Pages on the web, and learn more about them.

Next up on my list is one of my personal favorite and the one which I use very often.

It is NETLIFY, highly underrated and unheard of, no one discusses it in their course, or rarely anyone knows about it.

NETLIFY:

No Backend in your code or project no problem, Netlify is your savior. It lets you deploy your websites with only HTML, CSS, and JavaScript. Deployment on Netlify is as simple as it can be.
Just log in to Netlify with your GitHub account, permit it to access the repositories in your GITHUB account, and select the repo you want to deploy. You can also choose to deploy for a master branch or a custom made branch. And that's it click on deploy site and wait for a few moments and Ta! Da! Your website is ready to be accessed from the generated domain in your phones and other platforms. But, wait a moment you won't like that randomly generated domain name, no problem go to site setting s tab and change the domain name to whatever you feel.
Suppose you want to edit your content, do you need to take down the site again link to the repo and do everything all over again. Well, the answer is NO! Just make changes to the GitHub repo commit the changes. The changes reflect on your website without breaking any sweat.
But one thing to note here is you won't be getting your site analytics for free as with GitHub, so keep that in mind. You can always pay to get the analytics feature if your website is gaining huge numbers or has become very popular.
Also, I forgot to mention you do all the above things free of cost with no limit to several pages you can host.

Now next up on the list is one of the most popular and most heard of HEROKU.
If you have enrolled in any course to learn web development, almost 99 percent of the instructors guide you through hosting your work on Heroku. So I guess I don't need to give much info on that. I'll give a basic overview of how to do it. So, let's jump into it.

HEROKU:

First of all most important thing to keep in mind is that to deploy in Heroku your website must have backend in it. No need to worry. If you don't have a backend, you can still deploy using the above mentions platforms. Deploying on Heroku is a little complex as compared to others.
Heroku gives you an option to deploy dynamic applications in Rail, PHP, NODE.JS, and python web applications. To deploy your site, you need to have git installed, have a Heroku account be competent in using git commands.
Like Netlify, Heroku also doesn't give all of its features for free. Most important of them being analytics of your website.

These all are the most frequent and easy to use hosting platforms. There are few more options for hosting your content, such as:

  • DyanmoDB for Database
  • AWS Lambda for Backend
  • Cloudfare for DNS
  • Porkbun for $6 .com domains
  • Namecheap for $7-9 domains
  • Now/Surge for Frontend

All of these give their close to full services for less than $10 and can handle a million requests/month, and if you need more means your website is doing great, you can start earning money. So, you wouldn't mind paying more.

In the end, I would like to suggest that you keep practicing your work and use the above platform to showcase them. Web Development is a beautiful field with a lots of opportunity and a lot to learn and explore. So keep exploring and learning.

Keep learning and keep building!!

"From a DEVELOPER to a DEVELOPER."

Top comments (0)