Ever wished that the simple "hello world" application that you had used could be deployed somewhere like a pro website for others to see? Or maybe you are someone like me who purchased his favorite domain years ago but doesn't want to keep paying for the server just to serve static files, what options do you have?
Yeah, I know there is WordPress, there is Amazon S3, and what not to create a web application and get it hosted. But what if there was a more streamlined process for this?
What if each and every webpage you created could be hosted somewhere just by pushing it to Github?
Yup, @Github itself has a feature called Github Pages that bootstraps your app and deploys it in no time.
And all you need to have is a repository with index.html file and some minimal configurations. What's a better way to understand this than watching a Youtube Video.
Now once you have your web application hosted, the best part is you just have to push your code from your local repository to the remote repository, and Hola! Your changes are automatically deployed. And there are a plethora of things you can do so go EXPLORE now.
Just create a repository and get that web app hosted and share the links with your friends.
Now once you are done with it, there are some protips I would like to share with you.
Protip 1: Relative Paths
In HTML, we have to provide links to resources (like images, scripts, styles, etc etc). Here is a new thing I learned to link these resources in Github Pages. Do not use "/" (forward slash) at the beginning of your URLs when you have resources located relatively to your parent file. The "/" makes the server skip the contextual path and looks for resources at the domain level which results in a 404. Without a "/", the server looks for any path relative to your file.
For eg: https://divijish.github.io/omnifood has "omnifood" as the contextual path. Now to call any resource using / at the start of URL would omit "omnifood" from URL, but removing it would keep it. This way you can have resources in a relative directory.
Protip 2: Managing Custom Domain
You can skip this if you don't have a custom domain for now. If you have a custom domain and want it to point it to your Github Page then you could do it with a minimal configuration. Just create a file with its name as CNAME and commit it at the root level of your repository. Insert your domain name in this file and push.
Now you need to link this repository with your domain provider.
For this, create an A record (Apex record or Alias record) at your service provider's end. And add the following IPs in it:
185.199.108.153
185.199.109.153
185.199.110.153
185.199.111.153
Save it. And now go to your custom domain.
The code written at your GitHub repo will come up and you are good to go.
The best way to utilize this feature is to use it right away. Go get that application hosted.
For more in-depth knowledge of hosting custom domains, read this.
Start coding and have a great day ahead. :-D
Want more like this?
Subscribe and I’ll send the next post straight to your inbox.