How To Set-up An Apache Web Server on your Mac with Virtual Hosts » Daniel Groves Web Design

8/6/2019 How To Set-up An Apache Web Server on your Mac with Virtual Hosts » Daniel Groves Web Design

http://slidepdf.com/reader/full/how-to-set-up-an-apache-web-server-on-your-mac-with-virtual-hosts-daniel 1/12

Daniel Groves

Home

About

PortfolioNotebook

Contact

July 26, 2010

As a web designer and a web developer I am always looking for ways to improve the way I work

when using a local test environment to make it more realistic as well as easier to use. Because of this, I decided to take the plunge and configure my MacBook so it runs Apache, PHP and MySQL

natively, in the background rather than as a 3rd party app like before.

Since getting my MacBook I have always run MAMP (Mac, Apache, MySQL and PHP) in order

to do all of my local development, but now I have set-up everything up properly from scratch I

decided to record here how I did it, in the hope that it might help someone else, but also on the off

chance that I have to re-do this again in the future.

This is a set-up step guide on the full-works. Installing Apache, PHP and MySQL natively as well

as setting up virtual hosts on Mac OS X so you can access an array of sites locally by visiting

URL’s such as example.local or fried.egg. These will only work on your computer, but it is still

worth doing in order to create a better testing environment.

Installing Apache

The first step here is to install Apache to your system. Well, this bit is easy. Because it is already

sat there on your system, all you need to do is turn it on, which takes about 30 seconds. Open up

System Preferences and then go to “Sharing”. Here select the make sure the panel is unlocked by

clicking the padlock in the lower-left corner and typing in your password. Now tick the box

labeled “Web Sharing”.

http://daniel-groves.co.uk/2010/how-to-set-up-an-apache-web-server-on-your-mac-with-virtual-hosts/

1 of 12 2/05/11 10:22 PM



System Preferences Sharing Panel

OK, so that’s it – Apache is up and running. That was easy, wasn’t it?

Installing PHP

The next stage isn’t an install either, getting PHP up and running is simply a case of configuring

Apache. In order to do this you will need a text editor that allows you to save as a super-user.

There are plenty of free text editors available, but I would suggest using Fraise1, more on why I

suggest Fraise later.

Open a Finder window and then go to Go:Go To Folder or press Cmd+Shift+G. Once you have

done this a drop-down box will appear, in which you need to type /etc/apache2 and hit enter.

Finder Go To


2 of 12 2/05/11 10:22 PM



In this folder you should see a file called httpd.conf. Double-click it and OS X will ask you to

choose an application to open it in as there is no application assigned to a .conf file yet. Select

Fraise, or whatever other editor you would like to use, and open the file. Now go to line 115 which

should read #LoadModule php5_module libexec/apache2/libphp5.so. If not, do a search for

this line (Cmd+F).

The hash (#) at the start of this line is there to comment out the line, meaning that Apache ignorethat line, and moves on. We don’t want Apache to do this as this is the line that initiates PHP, so

simply delete the hash at the start of the line and hit save. At this point Fraise will ask you if you

would like to Authenticate, click Authenticate and type in your password so that Fraise can write

to the file.

Fraise asks you to authenticate as the file we were editing is located in among the computers

system files which require administrator privileges to edit.

Editing httpd.conf in Fraise

Installing MySQL

Next we need to install MySQL, and this time we really do have to install it. Go to the MySQL

download page and select the appropriate download for you computer – for example I am running

Snow Leopard on a 64-bit MacBook, so I downloaded “Mac OS X ver. 10.6 (x86, 64-bit), DMG

Archive”. It doesn’t really matter which archive type you choose, but I decided on a DMG just

because they are easy to work with.


3 of 12 2/05/11 10:22 PM



Installing MySQL really is easy. Once your chosen archive has downloaded open it and you

should find three files inside. Install each of these in order, the first item is the MySQL software

itself. The second is a preferences pane2

that allows you to start and stop MySQL. Finally the

package MySQLStartupItem allows MySQL Server to launch when you turn your computer on.

MySQL Install files

Once installed go to System Preferences and you should see a new pane called “MySQL”. Open is

a click the button “Start MySQL Server”. This will start the MySQL server, but that’s not

everything. Most people, at some stage, will want to add more databases so they can use it for

multiple things, rather than just using the default “test” database. We also need to set-up a

username and password for MySQL so web applications can use it.

MySQL Preferences Pane

Although it may seem a little daunting to begin with, using a terminal really is not that bad at all,

and that is exactly what we need next. Up another Finder window and go toApplications:Utilities:Terminal. Now type ls -a. What you just did was show the content of your


4 of 12 2/05/11 10:22 PM



home directory with hidden files showing, now look through tthat list of files and folder that

appeared after you hit enter and look for a file called .profile. If you can see a file called .profile

type Open /Applications/Fraise.app .profile, and if you cannot see it open a blank

document and save it in your home directory as .profile. Now type export PATH=”/usr/local

/bin:/usr/local/sbin:/usr/local/mysql/bin:$PATH” at the end of the document and save it.

What you have just done is make it possible to just type mysql or mysqladmin in terminal when

you need access to MySQL to perform tasks such as adding databases.

Now, in terminal again we are going to run a quick command in order to set a password on our

root account so we can logon to MySQL in the future. In terminal type mysqladmin -u root

password 'password'. You can change the password to read whatever you like.

Adjoining PHP and MySQL

In order to make PHP and MySQL work seamlessly together we need to edit the PHP

configuration file called php.ini. To do this open a Finder window, press Cmd+Shift+G and then

type /etc/. Now look for a file called php.ini and open it.

If you can’t find php.ini there should be a file called php.ini.default If this is the case go to

terminal and type sudo cp /etc/php.ini.default /etc/php.ini then hit enter and type your

password when prompted. All this terminal command does is duplicate the file as php.ini. Now

open this file in Fraise.

Around line 962 you should find a line that says ;extension=php_mysql.dll . Like with the

Apache configuration file a semicolon acts as a comment, making PHP skip over that line. Deleted

the semi-colon and then look for ;extension=php_pdo_mysql.dll around line 969 and delete the

semi-colon again.

Now, scroll down and look for a line that starts like this mysql.default_port = arounf line 1211

and make sure it reads in full mysql.default_port = 3306 then look for mysql.default_socket

= a few line sbelow and make sure their is nothing after the equals sign. This forces PHP to loads

the MySQL default. Save the changes to this file and you are done configuring MySQL and PHP.


5 of 12 2/05/11 10:22 PM



Editing php.ini in Fraise

Now we have to complete one final step, and this one is really easy. We need to restart Apache and

MySQL for our changes to take effect. So go to the “MySQL” pane in System Preferences and hit

the stop button. Then go to the “Sharing” pane, unlock it again if you closed system preferences

and un-tick “Web Sharing” again. Once Web Sharing has finished turning off turn it back on by

re-ticking the box and then go back to the “MySQL” pane and start MySQL again.

Thats it, you have set-up, from scratch a fully functioning Apache web server for local testing.

That wasn’t that bad, was it? Read on to find out how to set-up VirtualHosts so you can have a

different local domain for each site (these are really quick and easy to set-up!).

Setting up Virtual Hosts for Apache

For those who don’t know a Virtual Host is a seperate local domain name that can be used for

development. It is useful to have multiple domains for multiple websites that you work on. Setting

up Virtual Hosts really is quite simple, you make two simple alterations to two files and thats it.

Job done.

Before we begin it is important that you have decided two things, firstly where you want to store

your virtual host and secondly what you would like it to be called. For example I have one called

portfolio.local which I store in /Users/danielgroves/Sites/portfolio/ . This is the site I will

use for this example.

Firstly you need to open your hosts file. Open a Finder window, press Cmd+Shift+G and the type


6 of 12 2/05/11 10:22 PM



in /etc/ then find and open in Fraise a file called hosts. Now scroll down to the bottom and add

the following:

# Custom edits for virtual hosts #127.0.0.1 portfolio.local# Custom edits for virtual hosts #

You can freely change portfolio.local to whatever you like, but I would advise not usingextensions such as .com or .co.uk as these are commonly found online and so you may find

yourself unable to access various websites.

Editing the hosts file in Fraise

Next press Cmd+Shift+G in finder again and go to /etc/apache2/ and open httpd.conf in Fraise.

Scroll down to line 464 and look for a line nearby that reads # Virtual hosts then remove the

hash from the line below so that it reads Include /private/etc/apache2/extra/httpd-

vhosts.conf. Now save this file and close it.


7 of 12 2/05/11 10:22 PM





</VirtualHost>

You can change the DocumentRoot if you like so it points anywhere on your system. What this

does is load the files located in /Library/WebServer/Documents when you type localhost into

your browser. Next we need to configure our custom Virtual host. To do this duplicate the lins

above and change them to your needs. For example this is what I added to the end of httpd-

vhosts.conf for my vhost portfolio.local stored in /Users/danielgroves/Sites

/portfolio/

<VirtualHost *:80>DocumentRoot "/Users/danielgroves/Sites/portfolio"ServerName portfolio.local

</VirtualHost>

Editing httpd-vhosts.conf in Fraise

Now you need to restart Apache one last time. So go to the “MySQL” pane in System Preferences

and hit the stop button. Then go to the “Sharing” pane, unlock it again if you closed system

preferences and un-tick “Web Sharing” again. Once Web Sharing has finished turning off turn it

back on by re-ticking the box and then go back to the “MySQL” pane and start MySQL again.

Thats it, you have set-up your first Virtual Host in Apache on your Mac. Go on, stick some files in

your Document root (mine was /Users/danielgroves/Sites/portfolio/ ) and type the address

of your Virtual Host into your browser. Good isn’t it?


9 of 12 2/05/11 10:22 PM



portfolio.local

The reasoning behind using Fraise

If you remember, back at the start of this article I said I would explain alter on why I suggested

that you use Fraise. The reason is that Fraise has something called “Projects” built in, this means

you can save a project on your computer and when you double click it all of your project files will

open in Fraise.

Whenever you want to add or delete a VirtualHost you can to edit two files, /etc/hosts and

/etc/apache2/extra/httpd-vhost.conf . These two files are hidden away deep with your

system and so it is much easier to store a project file somewhere on your system (I keep mine in

my Sites folder) which makes it quick to open these two file for editing. That is why I suggested

using Fraise earlier on in the tutorial. For those who are interested in how to create a project in

Fraise follow these instructions:

Close all files in Fraise1.

Open the files you want to turn into a project in Fraise (/etc/hosts and /etc/apache2

/extra/httpd-vhost.conf)

2.

Select File:Save Documents As Project3.

Conclusion

That’s it. Your now finished with this tutorial, but please don’t just close the window. I want to

hear what you think, so I am asking you as nicely as possible to leave me a comment below. What

did you think of this tutorial? What did you like and not like? How has this benefitted you? And if

you have any problems, leave me a comment and I will see what I can do to help you.

Does anyone know what exactly a Fraise is? Is it just a kinda strawberry? [↩

]1. To install these just double click on them. Easy as pie. [↩]2.


10 of 12 2/05/11 10:22 PM



4 Comments

Daniel Wiltshire Says:

July 27th, 2010 at 9:59 pm

Great read, very informative! I think if I had more time, I would defiantly use your method

and follow your post. But overall extremely good!

[Reply]

Daniel Groves Reply:July 27th, 2010 at 10:01 pm

Took me about an hour to do the actual process, after research. Lucky for you though you

have some nice step-by-step instructions.

[Reply]

Daniel Wiltshire Reply:July 27th, 2010 at 10:07 pm

@Daniel Groves, Ahah, yes. I am liking your Gravatar!

Daniel Groves Reply:July 27th, 2010 at 10:09 pm

@Daniel Wiltshire, Thanks. I think you need to design yourself a logo to use

1.

Leave a Reply

Name (required)

Mail (will not be published) (required)

Website

0

0

0

Digg

1

Email

1

Share


11 of 12 2/05/11 10:22 PM



Submit Comment

Processing Visualisation Development

Flash game: Evaluation

Flash Game: Backend Processing

Flash Game: High Scores Page

Flash Game: The Game

Last.fm

Twitter

RSS

Valentine's Day

Minutes to Midnight

Linkin Park

No More Sorrow

Minutes to Midnight

Linkin Park

Please wait while my tweets load...

Error: Feed has a error or is not valid

©2010 Daniel Groves. All Rights Reserved.


12 of 12 2/05/11 10:22 PM