This guide helps you enable a web project on your own computer. It expects that you have already set up the web stack on your computer.
If you have previously run the web stack installer for your platform, you can also enable a site by running the enable_site command from the root project folder. This post explains the manual way of doing what the enable_site command automates.
Let's say you just cloned or downloaded a parentNode project to you local computer, and now you want to see it in your browser. That is what Enabling a site is all about. It means, that you'll make the Apache HTTP server aware of you local code, so it can serve it through your browser on a specific domain, typically only accessible on your local computer.
Practically speaking enabling a site involves two steps. Adding the local domain to your hosts-file and including the project Apache configuration to your Apache HTTP server. I'll explain more about that below. Although enabling a site expects you to already have the project source code on your computer, I have added that step to this guide for your convenience.
A parentNode project always comes with its own individual Apache configuration and a local test domain. It is designed this way to make collaboration between users across platforms easier, by ensuring an identical environment and configuration.
Clone project from Git repository
Perhaps you have already done this and you are ready to continue to the next step, Update your hosts file.
If you didn't clone or download a project yet, you can try cloning the parentnode_dk project now, to get an understanding of how to enable a site. Just go to your Git application and choose Clone Repository (available from the file menu in GitHub Desktop).
If you already have access to the parentNode repositories, you can select the parentnode_dk project from the repository list, otherwise you can clone it by using this url:
Clone the project into /srv/sites/parentnode/parentnode_dk on Mac/Linux or into C:/srv/sites/parentnode/parentnode_dk on Windows – and verify that you can see the code in this location after the cloning is done. It is important that the project is located in the correct folder.
Update your hosts file
The hosts file contains the local domain configuration for your computer. When you type a domain name (Ie. google.com) in the address bar of your browser, your system will first look for a match in your hosts file. If no match is found here, then it will try to get the domain information from a Domain Name Server (DNS) somewhere on the internet, and this is the case when you visit regular websites on the internet.
So the hosts file allows us to create a local domain and point it to your computer via the localhost IP address 127.0.0.1 (which is always equal to the computer itself). This means only your computer knows about this and that is really convenient when working as a developer.
By adding your development domains to your hosts file, you simple tell your computer, that when this specific domain is entered in a browser on your computer, then it should also find the matching site source code on your computer.
The hosts file location is a little different on Mac/Linux and Windows, but other than that, it works identically.
On Mac the hosts file is located here:
The file is read-only by default, so be ready to enter your password when you save it, after you have modified it.
The /etc folder is probably hidden on your system. You can access it by going to Finder and choosing Go and then Go to Folder from the file menu. In the prompt that shows up, you enter /etc and click the Go button. Now the folder is visible in Finder.
On windows the file is located here:
The file is read-only by default, so your Editor should be opened as administrator for you to be allowed to save it, after you have modified it.
Adding your test domain
On either system, open your hosts file in your preferred editor. In the bottom of the file, you simple add a new line and with your domain information.
Let's say we want to enable the parentnode_dk project. This project has a local development domain called parentnode.local. This is specified in the project apache configuration found in parentnode_dk/apache/httpd-vhosts.conf. In this case you should add the following line to your hosts file:
Similarly if you were to set up the janitor_parentnode_dk project:
You can always find the development domain inside the project apache/httpd-vhosts.conf file, specified as the ServerName value.
Now your computer is ready to respond correctly when you type the domain in the address bar of your browser.
Add project configuration to Apache
The next step is to tell the Apache HTTP server where to find the source code on your computer. As mentioned earlier, all parentNode projects comes with a ready made Apache project configuration for development, so all you have to do is to include the project configuration to the main Apache configuration.
When you installed the web stack, it also created an folder called apache in /srv/sites on Mac/Linux or in C:\srv\sites on Windows. Inside this folder you will find a file named apache.conf. This file is extending the Apache configuration and makes it easier to customize Apache and add local projects.
Adding your project configuration
To add a project, you simply include the project Apache configuration file, apache/httpd-vhosts.conf to apache.conf.
If you were to include the parentnode_dk configuration, you open apache.conf in your preferred editor and add the following line to the bottom of the file:
Similarly, if you wanted to include the janitor_parentnode_dk configuration:
Note that Apache will automatically translate the paths on Windows, so you can use the Mac/Linux path on both Mac/Linux and Windows.
After adding a project or in other ways modifying the Apache configuration, Apache needs to be restarted for the changes to come into effect.
You can restart Apache by using the Bash terminal. Simply open bash and enter this command:
Remember to open Bash as administrator on Windows.
Visit the site
Now the project is ready to be accessed through a browser on your local computer. In your browser, you simply type the domain name of the project in the browser.
In the case of the parentnode_dk project, just type:
Similarly, for the janitor_parentnode_dk project, type:
Chrome tends to think you are making a search, if you enter the domain without http://. So if it keeps forwarding you to a google search result, make sure you prefixed the domain with http:// like shown above.
No comments yet