One place for hosting & domains

      Develop

      How To Develop a Docker Application on Windows using WSL, Visual Studio Code, and Docker Desktop


      Introduction

      The advent of the Windows Subsystem for Linux 2 (WSL 2 or WSL for short) has simplified Linux-based development on Windows. The WSL 2 allows for direct integration with Docker Desktop and has plugins for direct development using Visual Studio Code.

      In this tutorial you’ll set up a development environment on Windows using Visual Studio Code, the WSL, and Docker Desktop. You’ll build a Python Flask web service in Docker to demonstrate the development functionality of these tools.

      Prerequisites

      In order to follow along with this guide, you’ll need:

      • Personal Computer with Windows 10 and the WSL 2 installed: You’ll want to ensure that the WSL is installed correctly and that you have Ubuntu 20.04 installed into the WSL. You can follow the tutorial How To Install the Windows Subsystem for Linux 2 on Microsoft Windows 10 to set this up.

      • VSCode Installed: You can download and install VSCode from its official website. You do not need to worry about installing plugins. The required plugins will be discussed in this tutorial.

      Step 1 — Installing Docker Desktop and Connecting to the WSL

      Docker is a common development tool used by developers to deploy applications. Docker Desktop has the advantage of also being able to run and integrate with your WSL Linux environments.

      Set up Docker by downloading Docker Desktop from Docker’s website and clicking the Get Docker button to start the download.

      Go to Docker's website and download Docker Desktop

      Run the executable once you get it downloaded and allow it to make changes.

      Run the executable and let Docker make changes

      During the installation make sure that Install required Windows components for WSL 2 is checked. Whether or not you want a Desktop icon is up to you.

      Make sure that

      After the installation process is done you’ll be prompted to log out and back in for your changes to take effect. Click on the Close button and then make sure to log out and back in so that the changes take effect.

      Once Docker is done installing you'll need to logout and log back in for changes to take effect

      Log back in and launch Docker Desktop from the Start menu.

      Launch Docker Desktop from the start menu

      Warning: When you first launch Docker it will prompt you with a Docker tutorial.

      Docker Tutorial Launched

      If you are unfamiliar with Docker it may be worth your time to do the Docker tutorial, but it is not required for this current tutorial. Once you have either done the tutorial or skipped it, continue on.

      The Docker dashboard will show up. This is where any running containers will appear as well as settings and status of Docker. If you see the logo is green in the bottom left corner that means that Docker is running. If it is yellow then Docker Desktop is still starting; give it a minute or so to finish. If the indicator is red, then Docker is unable to start.

      The Docker dashboard will open. If the logo in the bottom left is green it means Docker is running

      Next you’ll need to expose Docker to the WSL so you can run Docker on your Ubuntu environment. Click on the Gear icon in the top right corner to open Settings. From there you’ll click the Resource tab and then click WSL Integration. You’ll see your Ubuntu environment there, but toggled off, along with any other WSL environments you may have installed.

      Go to Settings, select Resources, and select WSL Integration. You'll see your WSL Ubuntu there, not selected

      Enable Docker in your Ubuntu environment by clicking on the slider to turn it on, and then click Apply & Restart. Once the restart is done your Ubuntu environment will have access to Docker.

      Select your WSL Ubuntu and click Apply & Restart

      Now you can test your Docker connectivity with the WSL. Open a terminal to the operating system you enabled Docker in, Ubuntu in this case, and run the Docker hello world command:

      Your Ubuntu environment should download and run the hello world container and display its output.

      Test Docker by running Docker run hello-world in your WSL Ubuntu

      Now that you have Docker connected to the WSL you’ll learn how to develop within the WSL directly using Visual Studio Code and the Remote Development Extension.

      Step 2 — Using Visual Studio Code’s Remote Extension to Develop within the WSL

      You can integrate your WSL Ubuntu environment with your Visual Studio Code, henceforth known as VSCode, to be able to develop directly in a Linux environment.

      First, open VSCode. Go to the Extensions tab on the left hand side of the window. Search for Remote - WSL and the Remote - WSL extension will appear. Click on it and click Install to install it.

      Open VSCode, go to Extensions and search for Remote. Install the Remote - WSL Extension

      Once the installation is completed, press CTRL + Shift + P to open the VSCode command dialog. Type Remote-WSL and you’ll see a few options appear. You can open a new WSL environment, open an existing folder, etc. Select Remote-WSL: New WSL Window. This will open a new VSCode window connected to the Ubuntu WSL environment.

      Press CTRL + Shift + P to open the VSCode command dialog and type Remote. You'll see WSL there. Select Remote-WSL: New WSL Window

      Now that you’re in this new window you can press CTRL + Shift + ` or by clicking on Terminal -> New Terminal in the navigation bar to open up a new terminal and you’ll be dropped into the WSL terminal. Any file you create will be stored in the WSL filesystem as well.

      If you open a new terminal you'll open your Ubuntu terminal and be able to develop using VSCode directly in the WSL

      Now that you have your development environment set up, you’ll build a Python microservice using the Flask framework that creates a 301 redirect to a site that you specify as an environment variable and package it within a Docker container.

      Step 3 — Setting Up Your Developer Environment

      First you’ll want to set up a development environment so you can develop your code using Visual Studio Code. Navigate to the sidebar on the left hand side and click on the topmost icon that looks like a sheet of paper. You will be prompted to either Open a Folder or Clone a Repository.

      File explorer dialog box open

      From here select Open a Folder. The default location will be your home directory. Select this option and click OK.

      Open home directory

      You may be prompted by Visual Studio Code asking if you trust the authors of this folder. This is a security measure to ensure that no automatically executed code can harm your PC. In this case, everything is good so select Yes, I trust the authors.

      Author Trust Dialog box

      Now you should see your home directory in the file explorer panel to the left. Next, create a directory to store your project. Navigate to the folder icon with a plus symbol. When you hover over the icon a popup should appear saying New Folder. Click on this icon to create a new folder and name it my-app. A new empty directory should appear in the explorer to the right.

      New Folder Icon
      You now have your developer environment set up and ready to build your Python microservice in the next step.

      Step 4 — Creating a Python Virtual Environment for Your Project

      Before you get started coding, you need to set up your Python developer environment. In this step, you will install and activate your Python requirements within a virtual environment for easier management.

      You can do all of this from within the terminal in Visual Studio Code. Press the CTRL + Shift + ` key combo to open a new terminal or click on New Terminal under the Terminal section in the top navigation bar. Once you’ve done this you should see a new terminal appear at the bottom of the Visual Studio Code window.

      New terminal in Visual Studio Code

      From this terminal navigate into the directory you created for you code, my-app.

      Next, install the python3-venv Ubuntu package so you can create Python virtual environments.

      • sudo apt update && sudo apt install python3-venv

      Now create your virtual environment using Python:

      This will create a directory called myapp in your current directory. Inside, it will install a local version of Python and a local version of pip, the package manager for Python. You can use this to install and configure an isolated Python environment for your project.

      Before you install your project’s Python requirements, activate the virtual environment:

      • source myapp/bin/activate

      Your prompt should change to indicate that you are now operating within a Python virtual environment. It will look something like this: (myapp)user@host:~/my-app$.

      With your virtual environment active, install flask and gunicorn with the local instance of pip:

      • pip install flask gunicorn

      Note: Once you have activate your virtual environment (when your prompt has (myapp) preceding it), use pip instead of pip3, even if you are using Python 3. The virtual environment’s copy of the tool is always named pip, regardless of the Python version.

      Now that you have the packages installed, you will need to save this requirement and its dependencies. This is good practice so you can recreate your developer environment as needed and will aid in installing the correct packages into your Dockerfile in a later step.

      Use pip to save your environment’s information to a requirements.txt file:

      • pip freeze > requirements.txt

      Now that you have a working virtual environment for development, let’s build the microservice.

      Step 5 — Building a Python Microservice to Redirect Traffic

      The first thing you’ll need to do is create a Python file named app.py and a Dockerfile to specify your Docker requirements. You can create files via the terminal with the touch command and then refreshing the explorer:

      You can also use the file explorer to create a new file by clicking on your my-app folder, then clicking on the New File icon that looks like a piece of paper with a plus sign, then typing out the full name and extension of the file.

      Create your app.py

      Use either method to create app.py and Dockerfile.

      Once you’ve done this, open app.py. The microservice you are going to write today will have only one endpoint, as defined by the @app.route("/") decorator. This endpoint will use the redirect method within the Flask library to perform a 301 redirect to a site that is specified in an environment variable. If no environment variable is set, the app will redirect to DigitalOcean’s website by default.

      Open app.py by clicking on it and add the following lines of code.

      Add an import statement to import the os package, which will enable the microservice to read the environment variable you’ll define later:

      import os
      

      Next, import the Flask class and redirect function from the flask library. You’ll use these to set up your web framework and to redirect traffic to another site.

      from flask import Flask,redirect
      

      Next, create a Flask object that can be acted upon within the code. This is the instance of your web app that you will register routes to.

      app = Flask(__name__)
      

      Create a single method at the / route. You’ll use your Flask instance to decorate the function to specify the route. Within the function, you will use the Flask redirect function to perform a 301 redirect to another site that will be read from an environment variable. If the environment variable is not found, your app will default redirect to DigitalOcean’s home page. This is to ensure your app doesn’t crash if you forget to set an environment variable.

      @app.route('/')
      def hello():
          # Attempt to read REDIRECT_TO from the environment. If nothing is set
          # perform a 301 redirect to DigitalOcean's website
          return redirect(os.environ.get("REDIRECT_TO", "https://www.digitalocean.com"), code=301)
      

      Finally, create a main function that runs your Flask app externally on port 8080. The address 0.0.0.0 is used to designate that you want your app to run on the externally facing network interface of your device, not the local loopback device, also known as localhost.

      if __name__ == '__main__':
          app.run(host="0.0.0.0", port=8080)
      

      The finished app.py can be found below:

      # Import the os package to read the environment variable
      import os
      
      # Import the Flask class and redirect function from the flask library
      from flask import Flask,redirect
      
      
      # Create a Flask object to be acted upon
      app = Flask(__name__)
      
      # Python decorator that specifies the web route that will execute the code below
      @app.route('/')
      def hello():
          # Attempt to read REDIRECT_TO from the environment. If nothing is set
          # perform a 301 redirect to DigitalOcean's website
          return redirect(os.environ.get("REDIRECT_TO", "https://www.digitalocean.com"), code=301)
      
      # Main function that executes the Flask app
      if __name__ == '__main__':
          app.run(host="0.0.0.0", port=8080)
      

      Once you are done, save the file as app.py.

      Now that your app is written, let’s test it.

      Step 6 — Testing Your Microservice

      Now that your app is written, it is time to test it. In the terminal you opened in Visual Studio Code with the activated virtual environment, run the command:

      You should see Flask output that looks similar to this:

      Output

      * Serving Flask app 'app' (lazy loading) * Environment: production WARNING: This is a development server. Do not use it in a production deployment. Use a production WSGI server instead * Debug mode: off * Running on all addresses. * WARNING: This is a development server. Do not use it in a production deployment. * Running on https://256.333.112.1:8080/ (Press CTRL+C to quit)

      This means that your Flask app is running. Open a browser and navigate to localhost:8080. When you do you should see output happen in your terminal and be redirected to DigitalOcean’s website. This is because you have not specified anywhere for your Flask app to redirect to, so it is using the default.

      To stop your Flask app, click in the Visual Studio Code window to ensure it is active and then press CTRL+C. You’ll see the prompt stop and you’ll be presented with your terminal again.

      Next, run the following command to set your redirect to something else.

      • REDIRECT_TO="https://digitalocean.com/community/tutorials"

      Run your Flask app again using the command

      Go to your browser again and navigate to localhost:8080. You should then be directed to the DigitalOcean tutorials page.

      Note: If you plan on testing multiples redirects with the same container, you may want to use a form of incognito mode. Most modern browsers will cache a 301 redirect, so if you change the environment variable, you may end up at the same site and not see your changes reflected. Using an incognito window or clearing your cache will help with this.

      With this, your app is done and is ready to be built into a Docker image.

      Step 7 — Building and Running Your Microservice in Docker

      In this final step you’re going to package your Python app as a microservice using Docker and a Dockerfile. A Dockerfile is a list of build commands that Docker uses to create your image. These can be commands to install packages, copy files, and more.

      Open the Dockerfile you created in a previous step so you can edit it. In this file you’re going to specify the base image, tell Docker where you want the code to run, create an environment variable that holds the redirect target, copy over all the necessary files to the Docker image, install the necessary Python packages, and finally add the command that will be executed when the container is run.

      Add the following code to Dockerfile to do this.

      First, you need to specify the base image you want to use. The python base image will contain the latest version of Python.

      FROM python 
      

      Next, set your working directory. This is the default directory that Docker will run commands in and drop you into if you connect with ssh.

      WORKDIR /var/www/
      

      Set the REDIRECT_TO environment variable to the default location you want to redirect to. Here I’m setting it to DigitalOcean’s Community Tutorial site. This can be changed when you run the image via the command line.

      ENV REDIRECT_TO=https://digitalocean.com/community/tutorials
      

      Copy your app.py and requirements.txt into your Docker container, using fully qualified paths for the destination.

      COPY ./app.py /var/www/app.py
      COPY ./requirements.txt /var/www/requirements.txt
      

      Run the necessary command to install the Python library requirements within your Docker image.

      RUN pip install -r /var/www/requirements.txt
      

      Finally, set the image run command to run your app. This is the command that is run whenever anyone tries to run your Docker container.

      CMD python3 app.py
      

      The complete Dockerfile is listed below.

      # Choose your base image
      FROM python 
      
      # Set your working directory
      WORKDIR /var/www/
      
      # Set environment variable for redirect. Can be overwritten by Docker run command
      ENV REDIRECT_TO=https://digitalocean.com/community/tutorials
      
      # Copy the necessary files
      COPY ./app.py /var/www/app.py
      COPY ./requirements.txt /var/www/requirements.txt
      
      # Install the necessary packages
      RUN pip install -r /var/www/requirements.txt
      
      # Run the app
      CMD python3 app.py
      

      When you are done, save the file.

      Now you can build the Docker image locally for testing. Run the following command to build your image and tag it with the name myapp. The -t option applies the tag to the Docker image:

      Finally, it’s time to test your Docker image. In your Dockerfile above you set an environment variable REDIRECT_TO to point at a website. This will overwrite the default value in your code so when you run this container, whatever site you specified in the Dockerfile will be your new location.

      Note: If you are prompted by windows to grant permission to Docker to access the network, click Allow.

      To test your image, run the following command:

      • docker run -p 8080:8080 myapp

      While your image is running, navigate to a browser and type localhost:8080 in the navigation bar and you should be redirected to the site listed in the Dockerfile.

      Warning: Sometimes the WSL terminal doesn’t recognize CTRL + C as a way to stop your Docker image. In this instance you’ll need to open another terminal and search for your running Docker image using the command:

      This will show an output similar to this:

      Output

      CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES 3f081712283e myapp "/bin/sh -c 'python3…" About a minute ago Up About a minute 0.0.0.0:8080->8080/tcp, :::8080->8080/tcp reverent_saha

      Take the container id, which in this example is 3f081712283e and use the docker kill command to stop it.

      Finally, let’s test changing the environment variable of the redirect in the docker run command.

      Type the following command to change the environment variable to the DigitalOcean cloud console page, https://cloud.digitalocean.com.

      • docker run -p 8080:8080 -e REDIRECT_TO=https://cloud.digitalocean.com myapp

      Now if you go to a browser and browse to localhost:8080 you will be redirected to the site specified on the command line.

      Conclusion

      You have successfully set up a developer environment on Windows using the WSL, Visual Studio Code, and Docker Desktop. You’ve demonstrated how to build, test, and package code on Windows, allowing you to have more options when it comes to developer environments.



      Source link

      Happiness First: Ways to Develop Products in Record Time


      Video

      About the Talk

      This talk helps startups stay away from over-engineering in the early stages of their projects by describing methods for keeping both people and businesses happy.

      Resources

      • Slides

      About the Presenter

      Nikita Savrov is a proud father, bad skater, and a developer with a passion for business and product development. After ten years in tech, he is still in love with Ruby.



      Source link

      How To Develop a Drupal 9 Website on Your Local Machine Using Docker and DDEV


      The author selected the Diversity in Tech Fund to receive a donation as part of the Write for DOnations program.

      Introduction

      DDEV is an open-source tool that uses Docker to build local development environments for many different PHP frameworks. Using the power of containerization, DDEV can greatly simplify how you work on multiple projects that use multiple tech stacks and multiple cloud servers. DDEV includes templates for WordPress, Laravel, Magento, TYPO3, Drupal, and more.

      Drupal 9 was released on June 3, 2020 for the Drupal CMS. Known for its ease of use and a massive library of modules and themes, Drupal is a popular PHP framework for building and maintaining various websites and applications of all sizes.

      In this tutorial, you will begin developing a Drupal 9 website on your local machine using DDEV. This will allow you to build your website first, and then later, when you are ready, deploy your project to a production server.

      Prerequisites

      To complete this tutorial, you will need:

      Note: It is possible to develop Drupal 9 using DDEV on a remote server, but you will need a solution to access localhost in a web browser. The DDEV command ddev share works with ngrok, which creates a secure tunnel into your server for you and other stakeholders to view your development site. For personal use, you could also install a GUI on your remote server and access your development site through a web browser inside that interface. To do this, you could follow our guide on how to install and configure VNC on Ubuntu 20.04. For an even quicker GUI solution you can follow our guide on how to set up a remote desktop with X2Go on Ubuntu 20.04.

      Step 1 — Installing DDEV

      In this step you will install DDEV on your local machine. Option 1 includes instructions for macOS while Option 2 provides instructions for Linux. This tutorial was tested on DDEV version 1.15.0.

      Option 1 — Installing DDEV on macOS

      DDEV advises that macOS users install their tool using the Homebrew package manager. Use the following brew command to install the newest stable release:

      • brew tap drud/ddev && brew install drud/ddev/ddev

      If you prefer the absolute newest version, you can use brew to install ddev-edge:

      • brew tap drud/ddev-edge && brew install drud/ddev-edge/ddev

      If you already have a version of DDEV installed, or if you ever wish to update your version, shut down DDEV and use brew to update your installation:

      • ddev poweroff
      • brew upgrade ddev

      Once you have installed or updated DDEV, run ddev version to verify your software:

      You will see an output like this:

      Output

      DDEV-Local version v1.15.0 commit v1.15.0 db drud/ddev-dbserver-mariadb-10.2:v1.15.0 dba phpmyadmin/phpmyadmin:5 ddev-ssh-agent drud/ddev-ssh-agent:v1.15.0 docker 19.03.8 docker-compose 1.25.5 os darwin router drud/ddev-router:v1.15.0 web drud/ddev-webserver:v1.15.0

      DDEV includes a powerful CLI, or command line interface. Run ddev to learn about some common commands:

      You will see the following output:

      Output

      Create and maintain a local web development environment. Docs: https://ddev.readthedocs.io Support: https://ddev.readthedocs.io/en/stable/#support Usage: ddev [command] Available Commands: auth A collection of authentication commands composer Executes a composer command within the web container config Create or modify a ddev project configuration in the current directory debug A collection of debugging commands delete Remove all project information (including database) for an existing project describe Get a detailed description of a running ddev project. exec Execute a shell command in the container for a service. Uses the web service by default. export-db Dump a database to a file or to stdout help Help about any command hostname Manage your hostfile entries. import-db Import a sql file into the project. import-files Pull the uploaded files directory of an existing project to the default public upload directory of your project. list List projects logs Get the logs from your running services. pause uses 'docker stop' to pause/stop the containers belonging to a project. poweroff Completely stop all projects and containers pull Pull files and database using a configured provider plugin. restart Restart a project or several projects. restore-snapshot Restore a project's database to the provided snapshot version. sequelpro This command is not available since sequel pro.app is not installed share Share project on the internet via ngrok. snapshot Create a database snapshot for one or more projects. ssh Starts a shell session in the container for a service. Uses web service by default. start Start a ddev project. stop Stop and remove the containers of a project. Does not lose or harm anything unless you add --remove-data. version print ddev version and component versions Flags: -h, --help help for ddev -j, --json-output If true, user-oriented output will be in JSON format. -v, --version version for ddev Use "ddev [command] --help" for more information about a command.

      For more information about using the DDEV CLI, visit the official DDEV documentation.

      With DDEV installed on your local machine, you are now ready to install Drupal 9 and begin developing a website.

      Option 2 — Installing DDEV on Linux

      On a Linux operating system, you can install DDEV using Homebrew for Linux or using the official installation script. On Ubuntu, begin by updating your list of packages in the apt package manager (you can use apt in Debian, otherwise use the equivalent package manager associated with your Linux distribution):

      Now install some prerequisite packages from Ubuntu’s official repository:

      • sudo apt install build-essential apt-transport-https ca-certificates software-properties-common curl

      These packages will allow you to download the DDEV installation script from their official GitHub repository.

      Now download the script:

      • curl -O https://raw.githubusercontent.com/drud/ddev/master/scripts/install_ddev.sh

      Before running the script, open it in nano or your preferred text editor and inspect its contents:

      nano install_ddev.sh
      

      Once you have reviewed the script’s contents and you are satisfied, save and close the file. Now you are ready to run the installation script.

      Use the chmod command to make the script executable:

      Now run the script:

      The installation process might prompt you to confirm some settings or to enter your sudo password. Once the installation completes, you will have DDEV available on your Linux operating system.

      Run ddev version to verify your software:

      You will see an output like this:

      Output

      DDEV-Local version v1.15.0 commit v1.15.0 db drud/ddev-dbserver-mariadb-10.2:v1.15.0 dba phpmyadmin/phpmyadmin:5 ddev-ssh-agent drud/ddev-ssh-agent:v1.15.0 docker 19.03.8 docker-compose 1.25.5 os linux router drud/ddev-router:v1.15.0 web drud/ddev-webserver:v1.15.0

      DDEV is a powerful CLI, or command line interface. Run ddev without anything else to learn about some common commands:

      You will see the following output:

      Output

      Create and maintain a local web development environment. Docs: https://ddev.readthedocs.io Support: https://ddev.readthedocs.io/en/stable/#support Usage: ddev [command] Available Commands: auth A collection of authentication commands composer Executes a composer command within the web container config Create or modify a ddev project configuration in the current directory debug A collection of debugging commands delete Remove all project information (including database) for an existing project describe Get a detailed description of a running ddev project. exec Execute a shell command in the container for a service. Uses the web service by default. export-db Dump a database to a file or to stdout help Help about any command hostname Manage your hostfile entries. import-db Import a sql file into the project. import-files Pull the uploaded files directory of an existing project to the default public upload directory of your project. list List projects logs Get the logs from your running services. pause uses 'docker stop' to pause/stop the containers belonging to a project. poweroff Completely stop all projects and containers pull Pull files and database using a configured provider plugin. restart Restart a project or several projects. restore-snapshot Restore a project's database to the provided snapshot version. sequelpro This command is not available since sequel pro.app is not installed share Share project on the internet via ngrok. snapshot Create a database snapshot for one or more projects. ssh Starts a shell session in the container for a service. Uses web service by default. start Start a ddev project. stop Stop and remove the containers of a project. Does not lose or harm anything unless you add --remove-data. version print ddev version and component versions Flags: -h, --help help for ddev -j, --json-output If true, user-oriented output will be in JSON format. -v, --version version for ddev Use "ddev [command] --help" for more information about a command.

      For more information about using the DDEV CLI, you can visit the official DDEV documentation.

      With DDEV installed on your local machine, you are now ready to deploy Drupal 9 and begin developing a website.

      Step 2 — Deploying a New Drupal 9 Site Using DDEV

      With DDEV running, you will now use it to create a Drupal-specific filesystem, install Drupal 9, and then initiate a standard website project.

      First, you will create a project root directory and then move inside it. You will run all remaining commands from this location. This tutorial will use d9test, but you are free to name your directory something else. Note, however, that DDEV doesn’t handle hyphenated names well. It is considered a best practice to avoid directory names like my-project or drupal-site-1.

      Create your project root directory and navigate inside:

      DDEV excels at creating directory trees that match specific CMS platforms. Use the ddev config command to create a directory structure specific to Drupal 9:

      • ddev config --project-type=drupal9 --docroot=web --create-docroot

      You will see an output like this:

      Output

      Creating a new ddev project config in the current directory (/Users/sammy/d9test) Once completed, your configuration will be written to /Users/sammy/d9test/.ddev/config.yaml Created docroot at /Users/sammy/d9test/web You have specified a project type of drupal9 but no project of that type is found in /Users/sammy/d9test/web Ensuring write permissions for d9new No settings.php file exists, creating one Existing settings.php file includes settings.ddev.php Configuration complete. You may now run 'ddev start'.

      Because you passed --project-type=drupal9 to your ddev config command, DDEV created several subdirectories and files that represent the default organization for a Drupal website. Your project directory tree will now look like this:

      A Drupal 9 directory tree

      .
      ├── .ddev
      │   ├── .gitignore
      │   ├── config.yaml
      │   ├── db-build
      │   │   └── Dockerfile.example
      │   └── web-build
      │       └── Dockerfile.example
      └── web
          └── sites
              └── default
                  ├── .gitignore
                  ├── settings.ddev.php
                  └── settings.php
      
      6 directories, 7 files
      

      .ddev/ will be the main folder for the ddev configuration. web/ will be the docroot for your new project; it will contain several specific settings. files. You now have the initial scaffolding for your new Drupal project.

      Your next step is to initialize your platform, which will build the necessary containers and networking configurations. DDEV binds to ports 80 and 443, so if you are running a web server like Apache on your machine, or anything else that uses those ports, stop those services before continuing.

      Use the ddev start command to initialize your platform:

      This will build all the Docker-based containers for your project, which include a web container, a database container, and phpmyadmin. When the initialization completes you will see an output like this (your port number might differ):

      Output

      ... Successfully started d9test Project can be reached at http://d9test.ddev.site http://127.0.0.1:32773

      Note: Remember that DDEV is starting Docker containers behind the scenes here. If you want to view those containers or verify that they are running, you can always use the docker ps command:

      Alongside any other containers that you are currently running, you will find four new containers, each running a different image: php-myadmin, ddev-webserver, ddev-router, and ddev-dbserver-mariadb.

      ddev start has successfully built your containers and given you an output with two URLs. While this output says that your project “can be reached at http://d9test.ddev.site and http://127.0.0.1:32773,” visiting these URLs right now will throw an error. Starting with Drupal 8, the Drupal core and the contrib modules function like dependencies. Therefore, you’ll first need to finish installing Drupal using Composer, the package manager for PHP projects, before anything loads in your web browser.

      One of the most useful and elegant features of DDEV is that you can pass Composer commands through the DDEV CLI and into your containerized environment. This means that you can separate your machine’s specific configuration from your development environment. You no longer have to manage the various file path, dependency, and version issues that generally accompany local PHP development. Moreover, you can quickly context-switch between multiple projects using different frameworks and tech stacks with minimal effort.

      Use the ddev composer command to download drupal/recommended-project. This will download Drupal core, its libraries, and other related resources and then create a default project:

      • ddev composer create "drupal/recommended-project"

      Now download one final component called Drush, or Drupal Shell. This tutorial will only use one drush command, and this tutorial provides an alternative, but drush is a powerful CLI for Drupal development that can improve your efficiency.

      Use ddev composer to install drush:

      • ddev composer require "drush/drush"

      You have now built a default Drupal 9 project and installed drush. Now you will view your project in a browser and configure your website’s settings.

      Step 3 — Configuring Your Drupal 9 Project

      Now that you have installed Drupal 9 you can visit your new project in your browser. To do this, you can rerun ddev start and copy one of the two URLs that it outputs, or you can use the following command, which will automatically launch your site in a new browser window:

      You will encounter the standard Drupal installation wizard.

      Drupal 9 installer from browser

      Here you have two options. You can use this UI and follow the wizard through installation, or you can return to your terminal and pass a drush command through ddev. The latter option will automate the installation process and set admin as both your username and password.

      Option 1 — Using the Wizard

      Return to the wizard in your browser. Under Choose language select a language from the drop-down menu and click Save and continue. Now select an installation profile. You can choose between Standard, Minimal, and Demo. Make your choice and then click Save and continue. Drupal will automatically verify your requirements, set up a database, and install your site. Your last step is to customize a few configurations. Add a site name and a site email address that ends in your domain. Then choose a username and password. Choose a strong password and keep your credentials somewhere safe. Lastly, add a private email address that you regularly check, fill in the regional settings, and press Save and continue.

      Drupal 9 welcome message with a warning about permissions

      Your new site will load with a welcome message.

      Option 2 — Using the Command Line

      From your project’s root directory, run this ddev exec command to install a default Drupal site using drush:

      • ddev exec drush site:install --account-name=admin --account-pass=admin

      This will create your site just like the wizard will but with some boilerplate configurations. Your username and password will be admin.

      Now launch the site to view it in your browser:

      You are now ready to begin building your website, but it is considered best practice to check that your permissions are correct for the /sites/web/default directory. While you are working locally, this is not a significant concern, but if you transfer these permissions to a production server, they will pose a security risk.

      Step 4 — Checking Your Permissions

      During the wizard installation, or when your welcome page first loads, you might see a warning about the permissions settings on your /sites/web/default directory and one file inside that directory: settings.php.

      After the installation script runs, Drupal will try to set the web/sites/default directory permissions to read and execute for all groups: this is a 555 permissions setting. It will also attempt to set permissions for default/settings.php to read-only, or 444. If you encounter this warning, run these two chmod commands from your project’s root directory. Failure to do so poses a security risk:

      • chmod 555 web/sites/default
      • chmod 444 web/sites/default/settings.php

      To verify that you have the correct permissions, run this ls command with the a, l, h, and d switches:

      • ls -alhd web/sites/default web/sites/default/settings.php

      Check that your permissions match the following output:

      Output

      dr-xr-xr-x 8 sammy staff 256 Jul 21 12:56 web/sites/default -r--r--r-- 1 sammy staff 249 Jul 21 12:12 web/sites/default/settings.php

      You are now ready to develop a Drupal 9 website on your local machine.

      Step 5 — Creating Your First Post in Drupal

      To test some of Drupal’s functionality, you will now create a post using the web UI.

      From your site’s initial page, click the Content button on the upper menu’s left-hand edge. Now click the blue add content button. A new page will appear. Click Article, and another page will appear.

      Drupal 9 Create Article Prompt

      Add whatever title and content you like. You can add an image, too, like one of DigitalOcean’s wallpapers. When ready, click the blue save button.

      Your first post will appear on your website.

      Drupal 9 Created Post

      You are now developing a Drupal 9 website on your local machine without ever interacting with a server, thanks to Docker and DDEV. In the following step, you will manage the DDEV container to accomodate your workflow.

      Step 6 — Managing the DDEV Container

      When you have finished developing your project, or when you want to take a break, you can stop your DDEV container without worrying about data loss. DDEV can manage rapid context-switching among many projects; this is one of its most useful features. Your code and data are always preserved in your project directory, even after you stop or delete the DDEV container.

      To free up resources, you can stop DDEV at any time. From your project’s root directory, run the following command:

      DDEV is available globally, so you can run ddev commands from anywhere, as long as you specify the DDEV project:

      You can also view all your projects at once using ddev list:

      DDEV includes many other useful commands.

      You can restart DDEV and continue developing locally at any time.

      Conclusion

      In this tutorial, you used Docker and the power of containerization to develop a Drupal site locally, with the help of DDEV. DDEV also integrates well with numerous IDEs, and it provides built-in PHP debugging for Atom, PHPStorm, and Visual Studio Code (vscode). From here, you can also learn more about creating development environments for Drupal with DDEV or developing other PHP frameworks like WordPress.



      Source link