In this chapter, we will be setting up a development environment for the Drupal framework. We will be also installing and exploring Drupal 8 from a developer's perspective and learn about the virtual development environment.
In this chapter, we will cover:
Installing Drupal for local development
Setting up PHPStorm IDE for Drupal development
Installing, configuring, and using Drush 7 with Drupal 8
Installing Drupal 8
GitHub for Drupal development
Installing Vagrant using PuPHPet
You can install Drupal using different web servers and databases. The most commonly used combination is Apache, MySQL, and PHP, often referred as the *AMP stack.
Specific to Drupal, there are two main ways you can do this:
Acquia Dev Desktop (for Mac and Windows only)
AMP: Manual installation of Apache MySQL PHP
These two ways have the following minimum system requirements:
If you are using Mac or Windows, Acquia Dev Desktop is the easiest method to develop Drupal:
Visit https://www.acquia.com/downloads and download the installer you need.
Open the
Acquia Dev Desktopfile and start the installation process. If you are a Windows user, find the folder that you used to save your Acquia Dev Desktop download and double-click on the.exeinstallation file.If you are a Mac user, find the folder that you used to save your Acquia Dev Desktop download. Move the file to the
Applicationfolder and double-click on the.dmginstallation file. A new folder will pop up, with an icon that says Acquia Dev Desktop Stack Installer. Go ahead and click on that. Allow the installer to run on your Mac or PC.
Let the installer run and click on Next for every step once you have read and agreed to the terms and conditions. Next, you can select where you are going to install the application stack (Apache, MySQL, and PHP) and where you are going to install your first Drupal site.
During this installation, we won't use our Drupal site directly but in other chapters, if you decide to use Dev Desktop for development work, you can import sites from other locations on your hard drive as well. Leave these at the default and click on Next. On the next page, you have to select the port number for Apache and MySQL. In most cases, it will work without any conflict, but if you are using multiple AMP stacks, you can go ahead and make the changes.
On the next screen, we set the defaults for our first Drupal site. Fill this out and click on Next. Make sure you note down the username and password. You will need this to log in to your Drupal site.
Creating credentials for the first Drupal site
Click on Next to begin the installation process. Once the installation is complete, click on Finish, and this will open up the Acquia Dev Desktop Control Panel.
Acquia Dev Desktop Control Panel
Go to your new site by clicking on Go to my site. Use Manage my database to browse to PHPMyAdmin.
Login page for setting up the site
You have installed Drupal using Acquia Dev Desktop. From here, you can begin working on your new Drupal site.
Note that the site is running using Acquia Drupal, which is little different in that you would download from your https://www.drupal.org/. Installing Acquia Dev Desktop on Windows is almost similar.
For Mac OS X, we will use the MAMP package to install an AMP stack.
First, download the latest version of MAMP from https://www.mamp.info/en. Once MAMP is completed downloading, double-click on the downloaded
.pkgfile. Move the file to the application folder and double-click on the MAMP.pkgfile. This will launch the MAMP installer. The system installer will guide you through the installation process.After completing the installation process, launch your local server.
Start MAMP and click on the Start Servers button. You will see the server status in the top-right corner. Click on the Open WebStart page button. You will see the default MAMP start page having links to access utilities such as phpMyAdmin, phpInfo, SQLite Manager, phpLiteAdmin, FAQ, MyFavoriteLink, and the MAMP website.
The default MAMP start page
After successful installation, you can launch your local servers. Start MAMP and click on the Start Servers button. In the status display in the top-right corner, the launch status of the servers is displayed. If necessary, you will be asked for your administrator password.
Tip
The process for setting up a development environment for Mac OS X is very similar to setting a development environment for a Linux distribution. They are both Unix-based operating systems. If you aren't already tied to a particular Linux distribution and would like to set up a development environment in Linux, then I highly recommend Ubuntu. There are excellent directions on setting up a Drupal development environment available at https://help.ubuntu.com/community/Drupal.
For windows, we will use XAMP:
Tip
I do most of my Drupal development on Mac OS or Ubuntu. Unix-based OS is a better fit for Drupal development as there are many development-oriented aspects of Drupal that are Unix-centric. From cron to .htaccess based clean URL, a lot of documentation on http://drupal.org/ will be biased towards the Unix OS.
Download the latest version of XAMPP from https://www.apachefriends.org/download.html. Once your download is complete, double-click on the
.exefile to install the program. Accept the default settings and complete the installation process. You can change the settings by editing the configuration files later at any point in time.After completing the installation process, start the XAMPP control panel.
XAMPP Control Panel
Inside the XAMPP Control Panel application, click on the Start button next to Apache and MySQL. Now open up your favorite web browser, navigate to
http://localhost, and you should see something similar to the following screenshot:
XAMPP is not meant for production use but only for development environments. Secure XAMPP before publishing anything online. You should go to the URL
http://localhost/security/. With the security console, you can set a password for the MySQL userrootandphpMyAdmin.
Congratulations! You now have a working AMP stack installed on your Windows PC. And also you have a working AMP stack installed on your Mac!
Drupal 8 recommends PHP version 5.4 or higher with the CURL extension. The latest version of MAMP includes PHP version 5.5 (it also includes an older PHP version and allows you to switch between them). The latest version of XAMPP for Windows includes PHP version 5. Although this version of PHP meets the requirements of Drupal 7, there are some PHP-related settings that need to be tweaked before we install Drupal in order to ensure that things will run smoothly. The PHP requirements list is from Drupal 8 at https://www.drupal.org/requirements/php.
To modify the php.ini settings in Mac OS X and Windows:
Navigate to the respective folder location in Mac OS X and Windows, and edit the settings to match the following values:
max_execution_time = 60; max_input_time = 120; memory_limit = 128M; error_reporting = E_ALL & ~E_NOTICE
Congratulations! You have successfully modified the php.ini file in Mac OS X and Windows systems.
Open the my.cnf/my.ini file in your text editor, and find and edit the following settings to match these values:
# * Fine Tuning # key_buffer = 16M key_buffer_size = 32M max_allowed_packet = 16M thread_stack = 512K thread_cache_size = 8 max_connections = 300
One of the real goals for the Drupal MySQL configuration is the max_allowed_packet setting. This has always been a source of bewildering errors in the past for me and many other Drupal developers that I know, and it is a setting that is specifically mentioned on the http://drupal.org/requirements#database page, under the database server section.
When you are ready to make your site live, there are some excellent performance tuning tips available at http://drupal.org/node/2601.
Git is a free source control and versioning software that has become very popular over the last few years. In February 2011, Drupal (https://www.drupal.org/) migrated from the outdated CVS versioning system to Git. The migration to Git has enabled a completely new way for Drupal developers to interact with Drupal (https://www.drupal.org/), and we will highlight this enhanced interaction throughout the book. However, we will also immediately start using Git to facilitate setting up a Drupal development environment. So, if you don't have Git already installed on your computer, let's get it set up.
To install Drush for the Mac, we are going to use Homebrew (an open source package manager for Mac OS X), with installation instructions available at http://brew.sh/.
Once you have Homebrew installed, installing Git is as easy as opening up the Terminal application (in /Applications/Utilities) and typing the following command:
brew install git
Download the installer for Windows from http://git-scm.com/downloads. Double click on the .exe file to install the program.
Click on the downloaded file link to begin the installation process.
The Git setup wizard
Click on Next, and then on Next again on the GNU General Public License screen.
On the Select Destination Location screen, click on Next to accept the default destination.
On the Select Components screen, accept the defaults again and click on Next.
On the Adjusting your PATH Environment screen, select Use Git and optional Unix tools from the Windows Command Prompt as this will allow Git to work with Drush, which we will cover next.
Choosing how to use Git from command line
You have installed the Git version control system—a tool that will greatly facilitate interaction with the existing contributed code at Drupal (https://www.drupal.org/).
Drush, a portmanteau of the words Drupal and shell, is a command-line utility that facilitates the management of a Drupal environment from your favorite shell (the Terminal application on Mac OS X and Ubuntu, and the Command Prompt application on Windows). For example, installing a contributed module on Drupal (https://www.drupal.org/) can be as easy as running the following commands from the command line:
drush dl modulename drush en modulename -y
To install Drush for Mac, we are going to use Homebrew again at https://www.drupal.org/node/954766.
In the Terminal, type the following command:
brew install drush
To install Drush in Windows, we will need to use Cygwin that provides a Linux-like environment for Windows.
We are now going to install Drush using Composer in Cygwin:
Download and install Cygwin
In the packages section install the following packages:
ncurses: This is a library used for showing text-based user interface.git: This is a version control packagebsdtar: This is used to untar compressed tar files.curl: This is a client-side URL transfer package.
Now installer Composer, a PHP dependency package management tool, using the Composer installer.
From Cygwin terminal, type the following command to install Drush 8:
composer global require drush/drush:8.*
Note
Learn more about Cygwin project at http://www.cygwin.com/. For more information on installing Drush, check Install Drush on Windows—the easy way at https://www.drupal.org/node/594744
We are going to use a combination of Drush and Git to install Drupal:
Mac OS X: Open up the Terminal application, and type the following command:
cd /Applications/MAMP/htdocsWindows: Open Command Prompt and type the following command:
cd C:\xampp\htdocsNow, we are going to use Git to locally clone the Drupal core Git repository into a new
d8devfolder (this will take a few minutes or so depending on your network bandwidth):$ git clone --branch 8.1.x http://git.drupal.org/project/drupal.git d8dev Cloning into 'd8dev'... remote: Counting objects: 456756, done. remote: Compressing objects: 100% (95412/95412), done. remote: Total 456756 (delta 325729), reused 445242 (delta 316775) Receiving objects: 100% (456756/456756), 100.04 MiB | 8.60 MiB/s, done. Resolving deltas: 100% (325729/325729), done. cd d8dev
Next, we want to use Git to switch to the latest Drupal 8 release. First, we will list all the available releases:
8.0-alpha1 8.0-alpha10 8.0-alpha11 8.0-alpha12 8.0-alpha13 8.0-alpha2 8.0-alpha3 8.0-alpha4 8.0-alpha5 8.0-alpha6 8.0-alpha7 8.0-alpha8 8.0-alpha9 8.0.0 8.0.0-alpha14 8.0.0-alpha15 8.0.0-beta1 8.0.0-beta10 8.0.0-beta11 8.0.0-beta12 8.0.0-beta13 8.0.0-beta14 8.0.0-beta15 8.0.0-beta16 8.0.0-beta2 8.0.0-beta3 8.0.0-beta4 8.0.0-beta5 8.0.0-beta6 8.0.0-beta7 8.0.0-beta8 8.0.0-beta9 8.0.0-rc1 8.0.0-rc2 8.0.0-rc3 8.0.0-rc4 8.0.1 8.0.2 8.0.3 8.0.4 8.0.5 8.0.6 8.1.0 8.1.0-beta1 8.1.0-beta2 8.1.0-rc1 8.1.1 8.1.2 8.1.3
You will see that the latest release is
8.1.3, but you should substitute whatever the latest release may be for you and use that in the following Git command:git checkout 8.1.3 Note: checking out '8.1.3'. You are in the detached HEAD state. You can look around, make experimental changes, and commit them, and you can discard any commits you make in this state without impacting any branches by performing another checkout. If you want to create a new branch to retain commits you create, you may do so (now or later) by using -b with the checkout command again. Example: git checkout -b new_branch_name HEAD is now at 079a52b. Revert Issue #2457653 by Gábor Hojtsy: System.site langcode is both used as a file language code and a site language code.
Tip
By using Git, we are linking our download of Drupal to Drupal's Git repository for our local core Drupal install. This will facilitate an easy update process for future Drupal core updates.
Drupal 8 uses Symfony components, which is managed by using a vendor directory and has to be downloaded in the Drupal repository using Composer. For Drupal repositories cloned via Git, you need to run composer install, which will download the vendor directory.
Next, we are going to go through the web-based installation process to set up Drupal:
You should see the following screen:
Select your language and click on Save and Continue.
Select the Standard profile and click on Save and Continue.
On the Database configuration screen, select MySQL. Enter
d7devas the database name androotas the database username and password. Click on Save and Continue. You will see the site installation screen.For a local development site, it is quite convenient to use the root MySQL user. However, for a live/production site, you should always create a unique MySQL user and password for your Drupal database.
On the Configure site screen, enter the following values (the e-mail address doesn't have to be real but must appear valid):
Site name:
d8devSite e-mail address: A valid e-mail address
Username:
adminPassword and Confirm password:
admin(this is only a development environment, so keep it simple)E-mail address: The same as used for Site e-mail address
Fill out the rest of the form and click on Save and continue. Your Drupal site installation is complete. So click on the Visit your new site link to see the site.
PhpStorm has emerged as one of the most Drupal-friendly IDEs for developing and debugging Drupal modules and themes at https://confluence.jetbrains.com/display/PhpStorm/Drupal+Development+using+PhpStorm.
Go to https://www.jetbrains.com/phpstorm/download/, and download the free 30-day trial of the correct version of the PHPStorm IDE for your operating system. Double-click (for Windows and Mac) on the file once it has completed downloading, and follow the instructions given on the page to install PHPStorm as per the documentation.
Tip
By no means should you feel like you have to use PHPStorm. There are a number of other good IDEs out there, and you may already be using a different IDE or may just be happy using your favorite text editor. However, I will be using PHPStorm throughout the book, so it may be easier to follow along if you are also using PHPStorm.
The Drupal development plugin is activated by default in PHPStorm. Otherwise, you can enable it in the settings dialog box.
Upon opening PHPStorm for the first time, you should see the following screen:
Click on the Create New Project button, select PHP Project, and click on Next. At this point, you will see the New PHP Project window:
Browse to your new Drupal 8 project. For Windows, it is
C:\xampp\htdocs\d7dev, and for Mac OS X, it is/Applications/MAMP/htdocs/d7dev. After you have selected the location of your new Drupal 7 installation, click on Finish.
As soon as you set up a project in PHPStorm for an existing project or a new Drupal module, the IDE checks if the development environment is configured for Drupal or not. It will suggest you to enable Drupal support with a popup and an event in the Event log.
Clicking on the Enable Drupal support link will open the configuration dialog box. You can change the Drupal project installation path and select version number 8 for Drupal 8.
You can also change the Drupal integration settings later by opening the Preferences dialog.
To get updated information about Drupal integrations with the latest version of PHPStorm, visit https://confluence.jetbrains.com/display/PhpStorm/Drupal+Development+using+PhpStorm.
If you are new to Drupal development, the first thing that you should understand is that being a good Drupal developer means being a part of the Drupal community. Drupal development is very much an open source process, and as such it is a community-driven process.
Drupal has numerous resources to assist developers of all experience levels. However, before you can take advantage of all of these resources, you need to be a member of Drupal (https://www.drupal.org/). So, if you haven't already joined Drupal, now is the time to do so at http://drupal.org/user/register. Once you are a member and have logged in to Drupal (https://www.drupal.org/), you will see the folllowing screen:
As we move forward with Drupal 8 development, we will return to your Drupal (https://www.drupal.org/) dashboard on many occasions to keep a track of issues of the contributed modules that we are using. We will also utilize the new sandbox development feature that Drupal has added as part of the migration to Git.
As developers, a lot of times we need to set up a local version of the AMP stack that is similar to the production web server. Vagrant allows developers to build the virtualized environment once and keep sharing it for every case.
Vagrant is written in Ruby, so if you are unfamiliar with Ruby, writing Vagrant files could be challenging. This is where PuPHPet helps. Using PuPHPet, we can generate the package to create a virtual machine the same way as we specify on the PuPHPet website. We just have to provision it.
To install Vagrant, download the appropriate Version of vagrant packages and the VirtualBox for your system from https://www.virtualbox.org/wiki/Downloads:
Create a location: Choose a location where you would like your VM to be saved. This location is regardless of where you save your VM configuration and files. Create a folder where you decide to store your VM. For example, in Windows, we can use
C:/drupalvm.Install VirtualBox: Download and install the latest version of VirtualBox from https://www.virtualbox.org/wiki/Downloads, depending on the OS package.
Install Vagrant: Installing Vagrant is easy. Just download your OS-specific package from https://www.vagrantup.com/downloads.html. Follow the OS-specific normal installation process.
Create your VM at PuPHPet: Until now, we have installed Vagrant and VirtualBox. Now let's create our VM configuration at PuPHPet. Open the URL https://puphpet.com/. Here we will select what we need from our VM.
VM Settings: On the first page, click on Get started right away. This should lead to the following page. Here I have selected the distro as Ubuntu Trusty 14.04 LTS x64. You can select your distro and other configurations depending on your server choice. You can leave other settings as default if you are not aware of them.
Selecting distro for your machine
Once you have selected your favorite package, hit the System Packages button.
In the next four steps, you can just leave the settings as they are and click on the buttons on the right-hand side to move forward.
You should get the Nginx option. Now I do not want Nginx as a web server. Instead I have opted for Apache.
Just browse to the page's top and uncheck Install Nginx. This should collapse the Nginx configuration form and bring the button to move to the Apache configuration page.
Select the web server of your choice
You can select your web server configuration and move next to select the PHP configuration. Here, I have selected Install Xdebug, a good tool for Debugger, and a profiler tool for PHP.
After this, I just clicked on other language configuration without making any changes and moved on to MySQL.
Selecting database
Here you can select the MySQL version and root password, add more users, and create new databases. You can explore other databases too if you like.
Again, keep moving forward until you reach Create Archive, and you are done. Download your custom server config! This will download a ZIP file with the configuration of your custom VM.
Set up your VM: Extract the ZIP file you have downloaded just now and navigate to the location you just extracted your ZIP file to.
Open the Terminal in Mac OS X or Ubuntu. In Windows, you should open the command line with administrative privileges.
In the Terminal, browse to the folder location and type this:
vagrant upHit Enter. It will take a couple of minutes and you should see a message, everything finished installing.
Setting up the host: There is the last step of setting up the hostname before we start using our VM. For Drupal, it is always better to use proper domain names. To create virtual hosts, we need to make changes to the host files on our computer. Browse to the following folders depending on the OS:
Windows:
C:\windows\system32\drivers\etc\hostsLinux (Ubuntu):
/etc/hostsMac:
/private/etc/hosts192.168.1.32 drupal8.dev www.drupal8.dev
You can use your favorite editor with administrative permission to make changes to the host file. I have selected to use
drupal8.devas my domain name. So let's add this line to the host file:We have used this IP address while creating our VM config file on PuPHPet. If you do not remember it now, you can find it by opening
config.yamlin Notepad. Theconfig.yamlfile is located inside yourpuphetfolder, which you placed inside your VM folder earlier. You should see the IP address top next toprivate_network.
We have just completed configuring a VM on our computer. You can open the browser and type your domain name—drupal8.dev.
You have reached the end of the chapter! You should now have a working Drupal 8 website and PHPStorm IDE to begin custom Drupal development. We are yet to write actual code, so I am excited to get started with some development examples. However, this chapter has given us the tools and configuration system needed to make the development process much easier and enjoyable. Now, we are ready to begin developing for Drupal in earnest. In the next chapter, we will create a new content type and a basic custom module to change one of the fields on our content type.
