MacOS – Configuring XAMPP on macOS Sierra (version 10.12.6)

Had the same problem. I deleted one of my project's folder and it became broken. In this case the site's configs should be removed from httpd-vhosts.conf and httpd.conf.

Try ping 127.0.0.1

apachectl configtest can help you to detect the problem.

Based on your comment that when you go to site.local:8080 you get a white page with the words "It Works!" similar to the screen capture below

What you are seeing is the webpage based on the global server configuration where the DocumentRoot is whatever default MAMP is set for.

You mention in your OP that

If I go to site.local:8080 it loads but doesn't render the elements as it should (instead loads the elements of the html in a list format)

Apache isn't going to render your webpage as a HTML list (unless you tell it to). More than likely what you are seeing is a directory listing similar to this:

You get that listing because of the line Options Indexes FollowSymLinks in your httpd.conf file. If you want to disable this, remove the word Indexes from that line and the listing will no longer show up.

Your Virtual Host Configuration

First, we need to understand how Apache handles virtual host requests. From the Apache documentation:

When a request arrives, the server will find the best (most specific) matching argument based on the IP address and port used by the request. If there is more than one virtual host containing this best-match address and port combination, Apache will further compare the ServerName and ServerAlias directives to the server name present in the request.

If you omit the ServerName directive from any name-based virtual host, the server will default to a fully qualified domain name (FQDN) derived from the system hostname. This implicitly set server name can lead to counter-intuitive virtual host matching and is discouraged.

If you notice, your host that is defined the global server configuration is the same as the virtual host.

This is probably where you are getting your error.

Now, my fix for this is a bit more involved initially, but infinitely more efficient because I try to avoid turing my machine into both a client and a server. I do all my development on a Mac with a Virtual Machine running my AMP server. This way I can mirror my production environment much closer and I don't have unnecessary services (like Apache and MySQL) running on OS X; they are all relegated to the VM. The VM has it's own IP, own server name, everything so when I point my browser to it, I know what results to expect.

I have a write up on how to install a FreeBSD VM on VirtualBox running on a Mac that has autostart enabled. If you are interested, I can share it with you.