Setting Up a Simple Web Hosting Environment in Localhost

Websites are designed and build using many different tools, such as HTML, CSS, JavaScript and many more. All these tools help you in designing the front end of the website and also the back end as well, but, everything that is made or built needs a platform of space to run on. For example, the architect may have designed a building on paper or even on software but to really push it into existence there must be a land present to construct the designs into reality. Also the area must be known of the land so that the designs may be made accordingly. Well just as a land is required for a building to be constructed so also every web software or website requires a server to run on, the difference between the example given and the actual server space is that the website is usually built first and then the space requirements on the server can be specified later.

                That’s all with the example part explanation; here comes a better technical part, a server is a machine that has some storage space and processing power that can be used by a website for its full operation. Every website requires a storage space for its database and some processing power for all the data processing that is done at the backend of the server. According to the size of the website some space in the server is allocated for all its requirements and also some processing power which is usually the RAM.

                Hosting a website in the public domain, well that is not what we’ll be discussing today but, before displaying your website to the public you should have a look at it for yourself as to how would it look and whether all the functionalities incorporated into it are working as per planned or not. This can be done by converting your own personal computer into a Web Server, using its processor’s power for processing the data and the computer’s hard drives to store the data.

Now, to convert your computer into a server you would need the help of some other free software. The most commonly used is the XAMPP abbreviated for Cross-Platform (X), Apache (A), MySQL (M), PHP (P) and Perl (P). It is package of the different things required for a website to be fully functional such as, Apache HTTP Server that is used for creating a bridge between the servers and the web browsers, MySQL which is used handling the database created for the website, PHP allowing for some operations to be performed by the server on the data from the database, etc.

Let’s download and configure XAMPP in your system. Follow the steps given below :

1. Go to https://www.apachefriends.org/download.html and select the file as per your requirement and download it. There are different versions available for Windows, Linux and iOS users, choose accordingly.

2. A .exe file would be available in the download section of the browser, open it and proceed with the additional dialogue boxes that would prompt you for different steps for the software’s installation. Some anti-virus may block your installation, so please turn your anti-virus or firewall off and then proceed with the installation.

3. After installation you can open it by clicking on the icon, generated on the desktop and since you will be opening it for the first time it will prompt you to select a language, select one and then click OK. You can now use the software.

Steps for using XAMPP for testing your website:

1.  Open XAMPP, you should see a window as below:

2.  You can see there are different packages given like Apache, MySQL, etc. Corresponding to each package there is a Start button. Click on it to start the feature, in your case Click Start for Apache and MySQL. After Starting the function you should see a window as below:

In the above dialog box, against each function there is a Port No. on which they are running. In this case 4433 and 8080 for Apache Server and 3306 for MySQL.

3. If everything works fine and the Services are started successfully and correctly then you can go to your favourite browser and type in the URL http://localhost:port_no. Here port_no is the port number on which you have started your HTTP service. In the browser you should see a page like this:

4. Now, as everyday is not a Sunday or a holiday the same goes here, because it may happen that you may face some problems while starting the Apache Server and MySQL

Above it can be seen that the services cannot be started as the ports are occupied.

5. To solve this problem, you need to change the port number in the Config file of the Services. There is a button named Config  for Apache Server, click on it and a menu will be shown, click on Apache(httpd.conf)

6. A text file will be opened in Notepad, here you need to make some minor changes i.e., the port number that must be used for creating the HTTP connection. The default port is 80 but there may be times that this port may be occupied by some other processes so, you can assign a different port number to run the HTTP service.

 In the text file you need to change the port number at two locations:

• First find this line  –  Listen 80 (Here 80 is the port number and this is already occupied)

Change this to – Listen 8080

• Second find this line –  ServerName localhost:80

Change this to – ServerName localhost: 8080

7. After the changes have been made, save the changes and close the text file. Next, start Apache Server and MySQL again. The services should start now without any hitch. You should now be able to see a window as this:

Now that the server is started, you now have to upload your website in to the server so that it can be viewed from the browser. Let’s have a look at the steps:

1. Go to the directory where XAMPP is installed and open it. Here you will see a folder named htdocs :

2. Open htdocs and create a folder in it of your choice and upload your website files and all other resources required for your website in the folder created.

3. After uploading your files into the folder within htdocs, you can now go to the browser and open your website to see how it works. For this go to your browser and type in the URL – http://localhost:8080/index.html where index.html is your website’s landing page.

Now the last part of this article…

XAMPP also provides a helpful tool for database handling. It can be accessed by typing http://localhost:8080/phpmyadmin in the browser. It will redirect to a similar page as shown below:

Here the whole database can be managed like adding, deleting and updating the database. Queries can also be executed through this panel. This panel helps in visualizing the queries and also to check the results of the queries executed through the website.

With this knowledge you can host your website for testing purpose, but do you want to go live and show the world how beautiful your website is, come to Techmion for super-fast hosting at the most affordable rates.