Categories
TUTORIALS VPS WEB DEVELOPMENT

Tutorial – Setting up a Ubuntu 16.04 VPS Instance on Vultr

In this article, we will learn about how to create a simple Virtual Private Server (VPS) running 64-bit Ubuntu 16.04 Operating System.

In case you have not created an account yet on Vultr, you can do so by visiting the link in the next paragraph and get $50 worth FREE CREDITS that you can use to create and use your Vultr Ubuntu VPS instances

Get Vultr VPS Worth $50 FOR FREE If you too would like to use Vultr VPS instance (which I strongly advise) while following these tutorial series, you can use the following Link to create your Vultr account and get $50 Free Credit which is more than sufficient to use and learn all about Linux, Web Development and much more for FREE!

Once you have created your Vultr account using the link above, you log into your Vultr account by visiting the Vultr Web App. Once you have logged in, you should be in the Products tab which would list all the Vultr instances you have created until now. Since your Vultr account is new, you will not have any instances listed there.

Vultr Dashboard displaying list of active Vultr instances created until now.
Vultr Dashboard displaying list of active Vultr instances created until now

But do not worry, this is about to change now.

Create a new Vultr VPS by clicking on the link that read “deploy now” at the end of that Vultr dashboard web page. You will then be taken to a new web page as shown below:

Vultr Deployment screen where new VPS instance can be created and deployed.
Vultr Deployment screen where new VPS instance can be created and deployed

Do not get perplexed by such a long web page with numerous options. While they may look baffling at first, it is actually pretty easy to use to create your first Vultr VPS instance. We will go through each of these options in a step by step fashion so that it is easier for you to follow and replicate.

Step 1 – Choose Server: Vultr not just provides services to deploy a VPS server, but also many more other products including Bare Metal Machine, Dedicated Cloud etc. However, in our case, we are only interested in deploying a simple VPS server running 64-bit Ubuntu 16.04 OS. Hence, we will simply choose “Cloud Compute” option which is what creates a VPS server.

Step 2 – Server Location: Next, we need to select where we want our VPS server to reside at. Vultr has its data centers spread across the globe and hence we have option to choose our VPS servers from various cities across the world as listed in the option. Choose the one which is closest to your and your web app’s visitors location is. This is because you will get a quick turn around time (time taken by the server’s response to be received) from your server if it is closest to your own location.

Step 3 – Server Type: In this option, we need to choose the type of Operating System (OS) we need to use. If for example we want to install 64-bit Ubuntu 16.04 OS, we select it over here.

Step 4 – Server Size: Next comes the size of the VPS server you want to deploy. This depends on a number of factors such as the amount of data size your app is going to use, the amount of traffic it gets, the speed of the CPU and the number of cores it holds etc. For tutorials and experiments, I usually just use the default selection of $10 per month VPS instance which gives comfortable performance for my requirements.

Step 5 – Additional Features: These are some advanced options which are not selected by default. These includes option to select IPV6 network addresses, backups etc. which I usually leave at its default unchecked state (in other words, I do not use it).

Step 6 – Startup Scripts: This option is useful if you need to run any additional scripts at the startup of your VPS instance. I have never used it until now so I may not be the right person to comment much about it! Sorry!! 😛

Step 7 – SSH Keys: SSH keys are special software keys that are used to create a secured shell protocol connection between your laptop/computer to your Vultr VPS server. In this option, you can generate SSH keys (using this tutorial) for your laptop and take the public part of the SSH keys and paste it here on the Vultr dashboard under this option. This way, you would not need to type in login and password every time you want to connect to your Vultr VPS server from your laptop’s command prompt.

Step 8 – Server Hostname & Label: Finally, you can create a new Hostname and label for your VPS server. This will result in the Vultr dashboard displaying this instance of the VPS server using this Hostname & Label.

Once you are done with filling up with all the above details in your Vultr dashboard, you can click on the “Deploy Now” button to create and deploy your Vultr VPS server. It may take a few minutes since clicking on the button after which your Vultr VPS server should be ready for use!

Hope this article gave you an insight into how to create and deploy a new Vultr VPS instance using Vultr dashboard. If you have any queries or any feedback on this article, do let me know in the comments below. Until next time, happy coding! 🙂

Categories
TUTORIALS VPS WEB DEVELOPMENT WEB SERVER

Things To Consider When Designing & Developing A Website

So you have decided to design and develop your own website? Great! But are you aware of all the things that you need to keep in the back of your mind when designing and developing your website? In this article, we will list some of the most important thing you need to consider when developing your website in 2019 & 2020.

1. Domain Name

The internet today is made up of over a billion of websites and web applications. With so many options at the tip of their hand, your website visitors will not be able to remember your website until and unless its name stands out from the crowd. So, pick a catchy website domain name that is easier for your website visitors to recollect in the future. Use the Namecheap’s search bar extensively to identify an easy to remember and available domain name. Ideally, a .com domain name is preferable over other domain name extensions as most of the non technical visitors by default assume the domain name to end with a .COM extension. It is also advisable not to use a name that is too long to remember or too many non interpret able characters such as vooooooooz.com (Here, it will be very difficult for your users to remember how many o’s are there in the domain name).

2. Web Hosting

Web hosting is the web server provider where your website will reside or hosted finally after web development activity is done. Where you host your website is very important as that becomes an important criteria in determining your website visitors satisfaction! Confused? You see, your website visitors will be very happy when your websites loads as quickly as possible. If it takes more than 10 seconds to load a web page, your website visitors will get frustrated and might close your website rather than waiting for it to completely load. As a result, the speed at which your web server delivers your website to its visitors plays a vital role in determining the ultimate customer satisfaction.

So how to determine which is the best web server to use?

Ideally, your web server must be located as close to your website visitor as possible. So for example, if your website visitors are mostly from the United States (US), you should host your website in a server located within the US. If your website is located in a far away location such as Australia, the amount of time required to deliver the web pages of your website from the server ot your website visitor will increase a lot!

What if your website visitors are coming from all across the world?

If you have a very generic website that appeals to all the people across the world, chances are you will have visitors coming into your website from across the globe round the clock. In such a case, where should we host the website? Well, the answer for this is to host your webserver across the globe!

Wait…what???

Yeah, you heard it right. If you are getting visitors from across the world, you will still need to deliver your web pages from the web server closer to your user’s location! But how to do that? Allow me to introduce you to the “Content Delivery Network” or CDN for short.

What does a Content Delivery Network or CDN do?

Content Delivery Network or CDN is a type of web service provided by certain set of CDN service providers whose main job is to host copies of your website across multiple web servers around the world. They will take care of determining where your website visitors are coming from and decide upon which CDN web server to use to serve web pages to them. In that way, you are ensuring that all of your visitors coming from across the world will get the same quality of website access as every other user from any other location in the world.

If you are just beginning with your website, you dont normally need to go for a CDN until you are able to determine the geographical locations from where majority of your website user base is located at. So, we will revisit again regarding CDN in the future and ignore it for now.

So now that we understand that our web servers need to be very fast and located closer to the website’s userbase, where do we look for a web server and how to determine a web hosting provider?

How to choose a web hosting provider?

There are different types of web hosting providers in the market. Some of them provide us with a managed hosting where they will manage the entire web server related issues and you will only need to worry about your website related parts. They also usually host not just your website on their server, but many other websites from other website owners as well in the same server. So, in other words, you will be sharing your website’s web server with other websites and hence they are usually called as the Shared Web Hosting service providers. One of the best example of such a Shared Web Hosting provider is the Namecheap shared hosting provider as shown below.

Shared Hosting with Namecheap

Using a shared hosting provider has its own set of advantages and disadvantages. One of the main advantage of using a shared hosting provider is that in that case the webmaster (aka website owner or website maintainer) need not worry about maintaining the web server part as it will be taken care of by the shared hosting service provider. On the other hand, one of the main disadvantage of a shared hosting provider is that since the same web server will be shared with other websites as well, the speed of the web server will be nondeterministic and usually slower. If one of the website in that shared hosting server gets high traffic, the other websites in the same server will be affected with its response time, thereby frustrating its users.

If you do not want to go for shared hosting, there are other types of web servers available to you. One such option is the Virtual Private Server (VPS).

In case of a Virtual Private Server (VPS), you will be the sole person in control of an entire virtual private server and it will not be shared with anyone else. This results in an increase and deterministic response time, all the time by your website to your website visitors. The other advantage of a VPS server is that since you have access to the complete VPS computer, you can install any software that you choose to, something that may not be possible when using a shared web hosting service provider. The downside, however is that this VPS will not be managed by the service provider and you will be completely responsible for maintaining the VPS server. There are many Virtual Private Server (VPS) providers in the market that are highly competitive and cost effective. One such service provider is the Vultr VPS service provider which provides a VPS server for as low as $2.5 per month! We highly recommend this VPS server if you are looking in to a VPS server option.

3. Design A Responsive Website For Mobiles

Now that we have covered the infrastructure part of a website – domain name and the web server, let us now start looking into the design aspects of a website.

Over 70% of the website traffic these days come from smartphones and tablets. As the mobile data rates continue to fall along with the fall of smartphone prices with excellent technical specs, this number of mobile visitors is only going to increase in the future. So what does this mean to your website?

Make your website responsive and mobile friendly!

What do we mean by a responsive website?

In the early days of web development, where there were not many devices with varying form factor – that is the size of the screen did not vary a lot, designing a website for these computer devices where reasonably easy. But with the advent of smartphone since 2007 – the year iPhone was launched, most of the website traffic started coming from these smartphones and every year this is only increasing. With the introduction of smartphones, web developerf faced a new challenge – huge range of smartphone computing device screen sizes!

By default, what the operating system of these smartphones do – such as the iOS of iPhone or Android is to shrink the size of a website to just fit enough into the screen size of the smartphone.

However, problem with such a scheme is that many of the links and buttons of the websites where user was supposed to take action on, became extremely difficult to click on thereby reducing the user experience (UX) of the website. This can be extremely frustrating to your website visitors and hence, an alternative design had to be thought of to handle mobile visitors to the website. This is when the Responsive Website Design was born!

In a Responsive Web Design, the website is designed in such a way that the size of the buttons, links, texts or images and the overall layout of the web page are determined depending on the size of the device’s screen and rendering accordingly, automatically!

The advantage now is that the visitors of your website need not have to fight with their smartphones and tablets to interact with your website. So always build your website using responsive design strategy.

One of the easiest way to design a responsive website if you do not have the time to learn every aspect of a responsive design is to use a frontend website framework such as Twitter’s Bootstrap. Using Bootstrap framework while building the frontend of your website will ensure that your website is always responsive!

4. Search Engine Optimization (SEO)

Finally, we also need to ensure our website is optimized for search engines such as Google, Bing, Yahoo, DuckDuckGo etc.

What is Search Engine Optimization (SEO)?

Most of the people use search engines such as Google or Bing to find answers to their queries. In return, the search engine will display a list of websites that is expected to answer those queries. In the early days of our website, when not many people will know about its existence will mostly end up on our website mainly through these search engines. If our website has answers to the queries asked by the search engine’s users and the searach engine thinks our website’s answers are better than other websites’ answers, it will display our website link above other websites, there by increasing the probability of the search engine user to click our link and visit our website.

So then, what are the parameters that we need to take care of to ensure the search engine such as Google places our website at the top of the search result? It is these set of parameters that becomes the basis of Search Engine Optimization (SEO).

Search Engine Optimization (SEO) as the name suggests, is the optimization methodology used on our websites to ensure that the search engines can easily traverse throughout our website’s web pages, analyze the content of our website for quality and hopefully determine the best position of our website in its results displayed to its users. The position given to our website in the search result for a particular query is called the search engine ranking of our web page for that query.

Our aim hence, will always be to figure out a way to get our articles to the top of as many search query results as possible. This is usually achieved by ensuring quality of the content of the website, ease of navigation across the web pages throughout the website – both for search engine bots as well as our website users, proper use of appropriate HTML tags depending on the content, easy readable hyperlinks & URLs, good amount of highly authoritative websites linking back (aka backlinks) to our web pages there by signalling the search engines that our articles are highly recommended by them etc.

Categories
HTML JAVASCRIPT LAMP PHP STATIC WEBSITES TUTORIALS WEB DEVELOPMENT WEB SERVER

Beginners Tutorial – What Is A Website?

We have all heard about different websites present on the internet such as Google, Youtube, Facebook, Twitter etc. But what exactly is a website? What is it made up of?

Imagine you just found a 100 year old book in your attic that contains a wealth of information about the world wars. It also has a collection of photographs that revealed some secrets that are lesser known to the public. You wanted to share this information with the world, but how?

One way is to go to the newspapers and get it published, but it can still not reach all the people across the world. What would be an easy and best possible way to share this information to people around the world? Publish it on the internet!

When you publish it on the internet, anyone from around the world having a computer or a smartphone with an access to the internet will be able to consume your content.

You can publish this information on social networking websites such as Facebook, Twitter or Youtube or create your own website to publish it.

A website example

So, a website, simply put, is a collection of information present in different formats such as texts, images, videos, graphs that is published on the internet to helps its users consume them.

But just like you, there are millions of people who are sharing information on the internet, so how do you make your contents accessible from other people’s information? This problem is very similar to having thousands of building in a city and needing to find a particular building. How do we do that? We will discuss about this in the future articles