Optimize Web Development with Symbolic Links and Apache Alias
Today, many web developers work remotely. We have access to numerous collaboration tools and file-sharing applications like Dropbox. However, a common issue arises when the web documents you save are not accessible through a localhost address in your browser because they are outside the Apache Server DocumentRoot.
To resolve this, you could change the DocumentRoot path to point to the Dropbox folder. Although this can be done easily in MAMP using the GUI, you might need to switch the path frequently to access other websites stored in the original path, which is quite inefficient.
A better option is to create a Symbolic Link (Symlink) and Apache Alias. These allow you to keep the original files in Dropbox while still accessing them through the localhost address in your browser – just as if the folder were in the Apache DocumentRoot. This post will guide you through the process.
Symlink in macOS
In macOS and other UNIX-based operating systems like Ubuntu, you can create a Symlink using Terminal with the following command:
ln -s path/to/source path/destination/symlink
For example, if your website files are saved under the “Dropbox/Sites/project” directory, use this command in Terminal to create a Symlink to that folder:
ln -s Dropbox/Sites/project ~/Sites/project
Be sure to adjust the destination path as needed. If you are using MAMP, you can set the path to Applications/MAMP/htdocs/project or /Library/WebServer/Documents if you are using the built-in Apache from macOS.
A key difference between a Symlink and a Shortcut or Alias Folder is that a Symlink is treated like the original file. It can be accessed through Terminal and added to any GUI application. For instance, in Sublime Text, you can add the Symlink as a Project instead of the original source – something you cannot do with a Shortcut or Alias folder.
Symlink in Windows
In Windows, you create a Symlink using the mklink command:
mklink /d "path\destination\symlink" "path\to\source"
Open Command Prompt and enter this command to create a Symlink in the WAMPServer directory that points to the source in Dropbox:
mklink /d "c:\wamp\www\project" "c:\Users\thoriq\project"
Apache Alias in macOS
In addition to creating a Symlink, you can also use Apache Alias. Not to be confused with an Alias Folder, Apache Alias is a module in Apache for URL mapping that designates a specific path with an Alias. This allows you to access folders through the localhost address as if they were stored inside the Apache DocumentRoot.
Before creating an Alias, ensure that the mod_alias module is enabled. In Terminal, navigate to /etc/apache2 and open the httpd.conf file. Remove the hash sign at the beginning of the following line:
LoadModule alias_module libexec/apache2/mod_alias.so
Next, add the following line at the bottom of httpd.conf to ensure that the folder and configuration files in it are recognized:
Include /private/etc/apache2/alias/*.conf
In Terminal, type these commands to create the “alias” folder and the “app.conf” file, where you will write the Alias configuration:
sudo mkdir /etc/apache2/alias sudo touch /etc/apache2/alias/app.conf
To open the app.conf file in Sublime Text, use this command:
sudo subl /etc/apache2/alias/app.conf
An Apache Alias is specified like this:
Alias /alias-name "/source/of/original/folder"
Here’s a complete example that you can add to app.conf:
Alias /app "/Users/thoriq/Dropbox/app"
<Directory "/Users/thoriq/Dropbox/app">
Options Indexes FollowSymLinks MultiViews
AllowOverride all
Order allow,deny
Allow from all
</Directory>
Save the file and restart Apache. With this configuration, you should be able to access the localhost/app address through your browser, even though the actual folder is in the Dropbox folder.
Apache Alias in Windows
If you’re using Windows and WAMPServer, you can easily create an Apache Alias. Start by clicking the WAMPServer icon in the taskbar and navigating to the “Apache/Alias directories/Add an alias” menu.
A window similar to the Windows Command Prompt will open. Enter the name of the alias. For example, if you name the alias “app,” it will be accessible at localhost/app in your browser. Press Enter to confirm the alias name.
Next, specify the source of the alias, such as c:/Users/thoriq/Dropbox/Sites/app.
And that’s it!
Conclusion
This post has demonstrated how to create Symbolic Links and Apache Aliases, which are helpful for accessing and managing folders outside the Apache DocumentRoot.