Creating a Project

Submitted by ross on Thu, 05/22/2014 - 15:38

In order to create a new development project, you'll first need a projects directory, i.e. somewhere to store your new projects. I recommend simply doing:

$ mkdir -p ~/projects

From now on all of your web development will happen within this directory.

Building a virtual host

In our setup, we'll give each of our projects it's own virtual host. This means creating a configuration file for all of our projects.

Create a web root

For each virtual host, you will need to have a web root location:

$ mkdir -p ~/projects/test

And give it something to load:

$ echo "<html>Here Comes Everybody</html>" > ~/projects/test/index.html

Add a virtual host file

Each project you create will require it's own apache virtual host configuration. You can do this with a simple configuration that looks like this:

<VirtualHost *:80>
        DocumentRoot /home/YOUR_USER_NAME/projects/test
        <Directory /home/YOUR_USER_NAME/projects/test>
            AllowOverride All
            Options FollowSymLinks
        </Directory>
        ServerName test.local
        CustomLog /var/log/apache2/access.log combined
        ErrorLog /var/log/apache2/error.log
 </VirtualHost>

You will need to create a new file by doing:

$ sudo gedit /etc/apache2/sites-available/test.local.conf

Add the above text into the file and save it.

Enable the new host

For every new site you create with apache you need to run two commands. The first command tells apache about the new virtual host:

$ sudo a2ensite test.local

The second command tells apache to reload it's configuration files so the new one will be included:

$ sudo service apache2 reload

Inform your browser

The final step in creating a local development environment is telling your system about the intended local domain. For this step, you simply need to add the new domain, in this case 'test.local' to your /etc/hosts file:

$ sudo gedit /etc/hosts

Add a new line to this file that looks like this:

127.0.0.2 test.local

Save the file and close the editor. Once you've done this step you should be able to go to http://test.local in your browser and see the text "Here Comes Everybody."

Hopefully everything has gone swimmingly and you now have your first local development environment.