When developing a website, web designers must be able to view their web pages in the same way as end users. Sometimes you just click and view the HTML file in a web browser, but if you want to test dynamic content, you need to set up a local web server. This is very simple and can be done easily on Windows, macOS and Linux. There are many types of web servers available, but we used Apache in this tutorial because it is the most common server, very easy to configure, and compatible with all major operating systems.
Set up a local web server on Linux
Apache is designed for Unix-like operating systems. Linux falls into this category, and the installation and configuration of the Apache Web server can be done in one step.
Here we deal with the command line. The most popular distribution allows you to install Apache without compiling it from source using simple commands.
For Debian, Ubuntu, and Ubuntu-based distro:
For Red Hat and CentOS
Once installed, navigate in your web browser to either “127.0.0.1” or “localhost.” If it displays “It Works!” that means your Apache installation is successful.
To better understand how Apache is serving this particular webpage, let’s edit it. To do this, navigate to the root web directory of your Linux local machine.
Open “index.html” as root with your favorite text editor.
Search for “It Works!” and change the text to something random like “Hello it’s Me!” (It could be anything really.) Make sure to save the file.
Now refresh the webpage on 127.0.0.1. You should see “Hello it’s Me!” where “It Works!” was formerly.
Note: be aware that every time you make a configuration change, you will need to restart Apache for it to apply.
If this does not work, you can restart it by directly executing the upstart file.
Set up a Local web server on macOS
The good thing about macOS is that Apache is installed on it by default. All you need to do is turn it on.
In Finder, go to “Applications -> Utilities,” then double-click on Terminal to open it.
To turn on your already pre-installed Apache web server, run the following command:
To test that our web server is running, navigate to “127.0.0.1” or “localhost” in your web browser.
We can change the content of the webpage by simply navigating to the document root the same way we did in Linux. The only thing that is different is the path location.
Now edit the “index.html.en” file using your favorite text editor. Change “It works!” to “Hello World!”
If we refresh our webpage hosted on 127.0.0.1, we now see the changes reflected.
To further configure Apache web server under macOS, navigate to the “httpd.conf” file.
Like Linux, you can easily restart the Apache service using the
apachectl command with root privileges.
Set up a local web server on Windows
Unlike Linux and macOS, Windows is not Unix-based, so there is no need to install an eyeliner. Fortunately, there are several installation wizards that combine things like Apache, MySQL, and PHP to make life easier for us. One of them is XAMPP.
Note: XAMPP is available for Linux and Mac OS X, too.
Continue through the installation and click “Finish” when complete. By default, the XAMPP control panel will be launched.
Click “Start” for Apache and MySQL, if needed.
If you navigate to “127.0.0.1” or “localhost” in your web browser, you should see the XAMPP configuration page.
To create a new webpage, the procedure is the same. Open notepad and create a sample HTML file. Name it “hello.html.”
Save it in the document root located in “c:\xampp\htdocs\”.
Navigate to it using your web browser by going to 127.0.0.1/hello.html. You’ll be able to see the webpage you created.
Note: WampServer is another solid option for installing Apache on Windows.
Apache is a great solution for creating simple and complex websites, but it is not the only option. Although Apache can integrate well across all three platforms, you may want to use IIS as an option for Windows because it supports many Windows authentication features that Apache does not support. However, in order to simply test the basic functions of a website, Apache is perfect.