Set up a local development environment to practice Drupal theme development. In order to practice theme development, either on your own or following our Hands-On: Theming guide, you'll need a Drupal site up and running on your computer.
By the end of this tutorial, you should be able to:
- Install Drupal on your computer so you can modify files with a code editor of your choice.
- Generate dummy content so that you have different kinds of pages to theme.
Set up a local development environment with Drupal installed and dummy content generated so that there are real pages on your site for you to theme.
- Ability/permissions to download software to your local machine.
- To use DDEV, you should have DDEV installed (which has its own set of prerequisites, such as Docker). See DDEV Documentation and follow the installation instructions for your operating system. You should also be comfortable using the command line to navigate the file system and run commands. See Command Line Basics if needed.
Recommendation: Use DDEV to install Drupal
We'll use DDEV to install Drupal. We've copied instructions from the Drupal Official Docs Local Development Guide in the following steps.
Exercise: Install Drupal and generate dummy content
Note: This tutorial assumes you're using ddev version 1.14.0 or greater.
To use DDEV to install Drupal, you'll need to install DDEV and its prerequisites, most importantly, Docker.
Go to the DDEV installation docs and follow the specific steps to install DDEV-Local for your computer's operating system.
Configure environment to serve your Drupal application
First you will need to configure your local development environment to serve a Drupal codebase. At minimum, this requires creating a new database for Drupal and configuring the web server to serve Drupal content at a particular URL.
Run the following command (assumes DDEV):
# Replace my-site-name! export SITE_NAME=my-site-name mkdir $SITE_NAME cd $SITE_NAME ddev config --project-type=drupal9 --project-name $SITE_NAME --docroot=web --create-docroot
ddev config and it will walk you through the options, step-by-step.
This will configure your new Drupal application to work with DDEV and will store the generated configuration in a new .ddev subdirectory.
Next, start the DDEV container:
You now have a web server and database server configured and running.
Create a new Drupal application
Next we'll install Drupal via Composer. (Replace
my-site-name with whatever you want to call your project directory). Or, use the
ddev composer command if you don't have Composer installed on your machine.
export command is optional and makes it easier to copy and paste commands in this step and the next. You could skip the
export line and replace
$SITE_NAME with the name of your directory, i.e.
# Install latest version of Drupal. ddev composer create "drupal/recommended-project" # Or alternatively, install Drupal 8. # ddev composer create "drupal/recommended-project:^8" ddev composer require drush/drush
We're also downloading Drush in this step. We'll use Drush in a moment to enable modules and generate content.
This will create a new directory and populate it with Drupal, Drush (and its dependencies).
Install Drupal using the interactive installer
Run the following command and DDEV will open up the local site URL in your browser and display the interactive installer.
ddev describe to see your site's URL and other connection information.)
Proceed through the interactive installer and install Drupal with the Standard installation profile. Refer to 3.7. Running the Interactive Installer if you need additional guidance with this multi-step form.
You have now installed Drupal!
Install the Devel Generate module
Next, we'll download and install the Devel Generate module (part of the Devel project) and use it to generate some sample content. It's easier to work on developing a Drupal theme if you've got some content on your site to look at.
ddev composer require drupal/devel ddev exec drush en devel_generate
composer require drupal/devel drush en devel_generate
Alternatively, in your browser use the Manage administrative menu and navigate to Extend and enable the Devel Generate module along with any required dependencies.
You have now installed/enabled Devel Generate module.
Generate users, tags, and content
Devel Generate comes with custom Drush commands that we can use to generate users, tags, and content. We recommend you run the commands in the order that follows so that the content you generate is assigned to random users to simulate a more realistic experience.
ddev exec drush devel-generate-users 10 ddev exec drush devel-generate-terms 20 --bundles tags --max-depth 1 ddev exec drush devel-generate-content 25
drush devel-generate-users 10 drush devel-generate-terms 20 --bundles tags --max-depth 1 drush devel-generate-content 25
Using the UI:
Alternatively, if you didn't install Drush, use the administrative UI to generate users, tags, and content. You can find this UI on the Configuration page in the Development section (after enabling Devel Generate on the Extend (admin/modules) page).
- Generate users (10).
- Generate terms. (Vocabularies: Tags. Number of terms: 20. (Optional) Maximum depth for new terms in the vocabulary hierarchy: 1.
- Generate content. (Check both Article and Basic Page content types. 25 nodes.)
You can verify that the commands worked by visiting the following administrative pages:
- Verify generated users at People (admin/people).
- Verify generated terms at Structure > Taxonomy > Tags (select List terms) (admin/structure/taxonomy/manage/tags/overview).
- Verify generated content at Content (admin/content).
You now have real pages to practice theming!
Demonstration of using Devel to generate content
After completing this exercise you should have a working copy of Drupal that you can access on your local development environment. It should contain either real or dummy content that you can use when previewing your theme during development.
Further your understanding
- Execute the
ddev helpcommand in your terminal and browse the additional ddev commands
- Can you figure out how you might share this new local development configuration with others on your team so that you can all work on similarly configured environments?
- Drupal Official Docs Local Development Guide (drupal.org)
- DDEV Documentation (ddev.readthedocs.io)
- Use Composer with Your Drupal Project (Drupalize.Me)
- Installation (Installing the Core Software) (Drupalize.Me)
- Downloading and Installing a Module from Drupal.org (Drupalize.Me)
- Development Environments (Drupalize.Me)
- Drush (Drupalize.Me)