How I Created My Portfolio & Blogging Website

Introduction

Hello everyone, I welcome you all to my first ever blog post. I am super excited to write this blog in which I will be focussing on how I purchased my domain and what else I did before thinking of creating my portfolio website.

Motivation

Before even thinking of motivation I already have a few awesome friends who always motivate me to push into my boundaries and make me realize what is best for me and what I am good at. The reason for you people reading this blog is also a result of the huge guidance and support provided to me by them. Secondly, I found this topic really interesting and worth learning so started working on it. You shall see my various pieces of work in future as well.

Why I Decided to Create My Own Website

A website is an important tool, one of the best ways to develop an online reputation, whether you are an entrepreneur, job seeker, artist, or a writer. It is not difficult to make your own website, there are templates and tools available to create a website. At first I thought about writing my content on any of the websites that are available on the internet, but then I decided to create my own because there are multiple benefits that I could get by doing that like:

Options Available For Blog Post Website

So when I decided to create a website for posting my blogs, I found that there are many options available for it like Wordpress.com, Medium, Tumblr and many more. I explored almost all of them. These all are managed blog post websites but I wanted to learn how to create a portfolio website and hosting it over the internet

Getting my own Domain

I spent a lot of time searching for a domain suitable for me and then I got my domain shivam-sharma.tech. I had options to purchase it for a year or two but being a beginner I chose to buy it for one year. It cost me 799/year which is a good price compared to many other options that were available on BigRock. There are many other options available with even lesser price depending on your choice of domain.

Creating Website Using Open Source Available Themes

After researching how to create a website, I found some useful tutorials which helped me to create a website from scratch. But writing code to create a website was taking a lot of time and effort. So, I started searching for alternate ways to create websites and found that there are multiple open source themes available to use such as jamstackthemes.dev where collections of open source themes are available. After trying out a few themes, I selected YoussefRaafatNasry/portfolYOU theme (as shown in below screenshot) which is available on Github and is absolutely free.

I was able to modify websites after looking into their instructions in documentation. I just had to edit the configuration and markdown (md) files that automatically generates static websites. portfolYOU theme is using jekyll which is a static site generator tool.

Hosting My Website

Now my website was ready to be hosted over the internet. I found a lot of information on vendors who could give support and servers to host my website. After some more research I found that we could utilize Github to host static code. This was pretty cool for me to explore more about github functionality. You can generate a github page by following their tutorial. Now it was the time to add a custom domain which we could be set up by following github’s tutorial but after setting up the domain, I was getting multiple issues like SSL error and not properly updating with my domain.

Switching on Netlify

After doing some more research on the issues, I found one good article on How to host a website on Netlify with a custom domain for FREE — Step by Step Guide which was super helpful for me.

Netlify helps you to automate your process to deploy websites on your custom domain. You can follow the below steps:

First we need to setup our custom domain in the Domains module

Added my custom domain shivam-sharma.tech which was purchased on Bigrock.

Netlify will ask you to update the domain’s name server on domain manager. It will allow netlify to manage our custom domain.

Now we have to import our website theme from github into Netlify by clicking on “New Site from Git”

Selected Github and given authorization permission to Netlify.

Once we have selected a project and branch of the project we need to provide commands that run to build the website.

Build Command:

bundle exec jekyll build

Once the application deployed successfully we get the netlify.app link where our website is hosted.

Now we need to enable HTTPS and wait for DNS verification. Once DNS verification is successfully verified our custom domain will not go through SSL error.

We need to select our custom domain as the primary domain.

You can visit my website at https://www.shivam-sharma.tech/ and see my blog posts and activities.