How to put your own web site with Hostinger

(I will write this post as we advance in the development of this page. I wont talk about wordpress because Im not using it.)

I think the first thing to notice is the limitations that the shared hosting has:

In the other hand, I will tell you about the good things that it has:

Having said that, I will tell you the steps I followed to put this website, and I will tell you some things that I added that I think are cool.

1st step: do you really need it?

Think about it, because I bought the shared hosting for this website and I had ideas of what I wanted to put it, but I didn't have content to write about. After a lot of ideas it is taking finally a "coding" path, but I would suggest you to have some post already done that you want to share... or even just a web design course done... not like me.

2nd step: check your domain

I think that the best domains searcher is the one provided by Google (link), there you will be able to see if your website is free or who owns it. I've read that there are some adgents dedicated who can make the deals to sell you the domain you want.

Also, there are a lot of endings you can use, the most recommended ever is the ".com", but there a lot more and some are even half price of the ".com". Remember that the domains are rented, you must pay year by year. As well as the hosting plan you want.

3rd step: buy the hosting plan

Check for the plan you want, but I think that the best to try all the features and check if it is what you want, is the plan of 1 year (Not like me that I went straight forward for the 4 years plan... such a dumb).

4th step: set a FTP password

Go to the "FTP Accounts" option in the Dashboard, and then "Create a New FTP Account". Take care of the password you set, because is the one you will use to connect via SSH protocol.

5th step: allow the SSH access (using the FTP password)

You need to go to the advanced options in the Dashboard of your website. There you will fine the SSH Access option, then you will only need to activate it with the FTP password.

If you are using windows you need to download PuTTY that will allow you the SSH access. If you are in Linux or Mac you only need to learn the basic SSH terminal commands and you will have access to it.

6th step: erase all the WordPress files (in case you want it)

At the beggining I thought it will be cool to use WordPress, but then I noticed that I wasn't getting all the control I wanted and that for some features I would need to pay, so I decided to uninstall it. I don't know if there is a better way to do it, but I went to PuTTY and erase all the files I had in the main folder of the page. But there were some files that I didn't have acces to erase, so I went to the Dashboard and used the "Fix File Ownership" option, that gave me the rights to finally erase all the files in the main folder.

Then I created a "index.html" file in the main folder, it was a basic "Hello World!" in html. That was the first page I deployed.

7th step: link your GitHub

First go to the Git options in the Dashboard, then you will see the "SSH key" to connect to your website.

The SSH key of your website.

You need to go to the settings of your GitHub account, and then click on "SSH and GPG keys". Then copy the SSH key and then add it to your Git account. That will give an access credential using the SSH protocol.

The SSH and GPG keys of your account.

Then go to your GitHub and create a new repository, it must be empty. Watch out for the name of the branch you are using, because you need to specify it in Hostinger settings. Then copy the link of the repository, but notice that the link is different if the repository is private or public.

Adding the Repository.

Then the repository will appear in "Manage Repositories". Then click on "Auto Deployment" to get acces to the Webhook link.

Manage Repositories.

Then you will need to add the webhook of your website to your repository to autodeply any change in the Github to your website. According to Wikipedia: "A webhook in web development is a method of augmenting or altering the behavior of a web page or web application with custom callbacks. [...] Webhooks are "user-defined HTTP callbacks". They are usually triggered by some event, such as pushing code to a repository or a comment being posted to a blog. When that event occurs, the source site makes an HTTP request to the URL configured for the webhook. ".

Always verify what you are uploading to your repository, or use a ".gitignore" to avoid revealing any credential or private file.

Adding the Webhook.

8th step: activate your SSL certificate

Go to the SSL tab and then activate the SSL certificate, it will give the "https" (Hypertext Transfer Protocol Secure) to your website, that is an extension of the usual "http", but safer. According to Wikipedia: "HTTP is not encrypted and thus is vulnerable to man-in-the-middle and eavesdropping attacks, which can let attackers gain access to website accounts and sensitive information, and modify webpages to inject malware or advertisements. HTTPS is designed to withstand such attacks and is considered secure against them.".

And as I know, having the SSL certificate will improve the place of your website in online searches. So it is a good idea to put it on your website. Also, after you activate the certificate, it will take some hours that it updates, which is due to some DNS settings... I didn't want to change the settings, so I just waited until the next day.

SSL certificate.

9th step: activate the Cloudflare

Go to the Domains optins in the Dashboard and then buy Cloudflare Control, its a single pay of around 10 USD and it will give you a forlive service, so I think its cool. It is useful to see some stats from where are visiting your website and how many unique visitor do you have per dar/week/month.

Cloudflare stats.

Extras

Configure your SSH terminal

You must create a file with the name ".bashrc", that will configure the name that is shown when you type in the SSH terminal. 

[[ $- != *i* ]] && return

PS1="HeyUalabi \[\e[31m\]\\$\[\e[m\] "

Then it will look like this:

PuTTY Terminal in SSH connection.

Erase the .php or .html ending of your URLs

For this, you will need to create a new file inside of your domain's folder. It's name must be ".htacces". It is basically a URL rewriter using regular expressions. In my case, all the pages endes with "index.php", so if yours ends with something different, change it and it will work out. 

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(([A-Za-z0-9\-]+/)*[A-Za-z0-9\-]+)?$ $1/index.php