Create a Virtual Host in OSX
As someone who had always developed on PCs, switching over to using Mac OS X was like going from peasant to prince. Compared to Windows-based machines, Mac's OS X operating system is light years better. One OS X feature I make much use of is the integrated Apache server. Hosting websites on my local machine during development is a must. Let me show you how to create multiple websites on your local machine.
Step 1: Create Website Folder
User websites appear in the Users/Sites/ directory. Let's create a directory within Sites named "mynewsite":
cd ~/Sites/ mkdir mynewsite
As you'll see in a moment, you can add this directory anywhere you'd like, but for the sake of this post we'll add it in the standard Sites directory.
Step 2: Edit httpd-vhosts.conf
File
The next step is adding a new record to Apache's httpd-vhosts.conf
file. My httpd-vhosts.conf
file is located within the following directory: private/etc/apache2/extra/
. This configuration file holds your website virtual host location details. Let's add mynewsite to the configuration:
<VirtualHost *:80> DocumentRoot "/Users/myUserName/Sites/mynewsite" ServerName mynewsite.local </VirtualHost>
The two important configurations are DocumentRoot and ServerName. DocumentRoot points to the directory we created in step 1. ServerName refers to the address we want to type into the browser to get to this new site. I generally create all my hosts with the ".local" domain.
You can also place more specific configurations within this new virtual host, including ProxyPass, directory settings, error documents, redirects, and other settings you sometimes see in .htaccess files:
<VirtualHost *:80> DocumentRoot "/Users/myUserName/Sites/mynewsite" ServerName mynewsite.local <directory "/Users/davidwalsh83/Sites/mynewsite/trunk/"> Options Indexes FollowSymLinks AllowOverride All Order allow,deny Allow from all </directory> ProxyPass /web-service http://someotherwebsite.com/api/ ProxyPassReverse /web-service http://someotherwebsite.com/api/ </VirtualHost>
You can learn more about the possible settings here: http://httpd.apache.org/docs/2.2/vhosts/
Step 3: Edit hosts
File
The hosts
file contains a list of host names and IP address to which they match. We'll add another record to this file which points the new website's ServerName
setting from above (mynewsite.local) to the localhost IP address:
## # Host Database # # localhost is used to configure the loopback interface # when the system is booting. Do not change this entry. ## 127.0.0.1 localhost 255.255.255.255 broadcasthost ::1 localhost fe80::1%lo0 localhost 127.0.0.1 mynewsite.local
Now mynewsite.local host name is pointing toward your machine. Coupled with the httpd-vhosts.conf
file's new settings, the address will find your mynewsites directory!
Step 4: Apache Restart
The last step in the process is restarting your Apache install:
apache restart
The other method of quickly restarting Apache is by opening System Settings >> Sharing and unchecking and then checking "Web Sharing". That's all! Now you can navigate to http://mynewsite.local and see your web files!
Quick Side Note
Your IT people would probably prefer you not use your machine's Apache and instead use a virtual machine for your web development. I've personally felt the pain of using my MacBook Pro instead of a virtual machine but that was due to MySQL and not Apache. This tutorial is meant to show you how to quickly get a new site up and running on your local machine. The same process can be used to create a new virtual host on other machines but the file locations will simply be different.
Suitable tutorial for beginners, although I don’t understand those praises for Mac OSX (which I’m not at all going to scold). Apache web-server is available for windows, linux & mac, and it is pretty much the same, and you must go all the same steps to setup a virtual host – regardless of the platform you’re using.
So would you recommend using local Apache over something like MAMP?
I can shorten this blog post to less than 140 characters. Use the very excellent virtualhost.sh. http://code.google.com/p/virtualhost-sh/ worth every byte.
virtualhost.sh looks interesting. I setup a text expander snippet for step 2, which makes it very quick.
On Leopard you can do the same thing by editing ~/Sites/_sites.conf
And adding in the host to to the hosts file using sudo as per your instructions above.
However this is not quite enough though. You’ll probably need to install mysql and also upgrade the php version using the Entropy php5.3 build.
What about choice of IDEs. I feel the PC still has the best list of professional looking IDEs.
Anything as good as Netbeans, Dreamweaver on the Mac?
have you used Netbeans before? Did you know it runs on more platforms than just windows?
@Emmanuel TextMate, TextWrangler or Coda are all good IDE for web devving on a Mac. Personally I use Coda – its intuitive, modular and costs $99!
I set up a virtual host on Linux a few weeks ago, and it is pretty much the same.
Emmanuel, I think there is Dreamweaber for mac, but who needs dreamweaver anyways? A good text editor is always better. Personally I prefer gEdit from the gnome package.
@Buzu, i love dreamweaver; the only other IDE i love as much would be Netbeans.
@James, well i’ll check them out and see.
Thanks :)
Aptana is a great IDE, even if it’s a bit over the top
Nice write up, I have A LOT of named virtual hosts, port-based, etc currently running on my machine. I love to just type in dev/ and get to my little development projects. Yeah, MySQL on Snow Leopard is a hassle, but after installing the package, you typically only need to restart your computer to get it to work.
Nice article but yea its the same on windows, unix, linux and mac..
Nice stuff! If it’s a brand new mac you got, check the post I wrote on configuring development enviorment in OSX:
http://blue-and-orange.net/reference/osx/configuring-development-environment-in-osx-10-5.html
Developing on mac is a whole new experience if you are used to windows. In the long run I think its a more productive environment than on windows.
I prefer XAMPP even though Apache is built-in.
Tip for people who develop on multiple machines:
-Setup XAMPP on all your machines
-Install Dropbox and move your htdocs to your Dropbox directory
-Change your Document Root to your new htdocs directory
You’ll be able to develop locally on all of your machines using the exact same settings. I find this very helpful because I use my work desktop, laptop and home desktop.
Hi David,
Maybe you should talk about the MySQL tool for OSX and how to set it up. I’ve got it running on my iMac but It’s not working for me on my new Macbook Pro. Maybe I’m overseeing something and you’ve got a great post and the answer for me? ;)
Cheers!
I believe by default OS X’s httpd.conf does not include the vhosts.conf file, so find this line in that file and uncomment it before restarting apache:
# Virtual hosts
Include /private/etc/apache2/extra/httpd-vhosts.conf
sudo nano /private/etc/hosts
I had to add an IPv6 line to my hosts file to get named virtual hosting to work (OS X 10.8):
::1 mynewsite.local
Where have you added?
Brother, you missed the most important thing for MAC OSX. In apache’s httpd.conf also you need to include the file httpd-vhosts.conf to load virtualhosts.
Uncomment the line 477 in httpd.conf “Include /private/etc/apache2/extra/httpd-vhosts.conf” and reload apache using “apachectl restart”. Now check if the virtualhosts are properly loaded using command “httpd -S”
+ hosts file is under /private/etc/
Using MacPorts changes a few paths since it maintains a different version of apache:
Step 2: httpd-vhosts.conf is located at /opt/local/apache2/conf/extra/httpd-vhosts.conf
Step 4: restart apache with /opt/local/apache2/bin/apachectl stop (then ‘start’)
Hello David Walsh,
I follow all your step but still not work. message is like this:
You don’t have permission to access / on this server.
Apache/2.4.9 (Win64) PHP/5.5.12 Server at 192.168.114.234 Port 80
can you show me the problem? I install this site in local (http://www.allbesttop10.com/).
All your step are clear, however It still not work, Maybe I missed some point. Please kindly advise. Thank you in advance.
Great tutorial, but one big mention is necessary:
Apache on Mac is configured by default to read a vhost configurations from the /private/etc/apache2/vhosts directory. You must define your rules there in a new file or else the rule will not be read.
Alternatively, you can uncomment the
line in the httpd.conf file so the httpd-vhosts.conf file will be read by Apache.
Setting up Virtual Hosts in Apache on Mac OSX 10.9 Mavericks or Mountain Lion is straight forward after you have your local Web Development environment up and running – get your web development up and running first following the AMP stack guide here 10.8 or 10.9 if required.
The process of setting up Virtual Hosts is done easier in the Terminal either using nano or vi with sudo or as a root user, or you can you a GUI visual editor like Text Wrangler which allows access to the /private/etc directory by clicking ‘Show Everything” in the open dialog box.