Development Setup

Our setup is a combination of

  • Git
  • Docker
  • Composer
  • TYPO3
  • GitLab automatic deployment

1 Git

There usually already is a git repository for the project (with the HTML template files). We clone the project:

git clone [email protected]:ext.dev/[project_name]

Please replace project_name with the name of the project.

After cloning you should have a new folder [project_name] with the current master branch of the git repository.

Configure Docker

To configure docker, we must edit the following files:

{project_name}
| docker-compose.yml
└─── docker
|  └─── typo3
|    |  Dockerfile
|  └─── database
|    |  Dockerfile

These files are in general identical for all our projects and can just be copy/pasted unless requested differently.

./docker-compose.yml

version: "3"
services:
  typo3:
    build: docker/typo3
    ports:
      - "80:80"
    volumes:
      - ./config:/var/www/html/config:Z
      - ./public:/var/www/html/public:Z
      - ./vendor:/var/www/html/vendor:Z
      - ./packages:/var/www/html/packages:Z
    environment:
      - TYPO3_CONTEXT=Development
      - HOSTNAME=localhost
      - APACHE_DOCUMENT_ROOT=/var/www/html/public
    external_links:
      - database:database
    networks:
      - backend
  composer:
    image: composer
    volumes:
      - .:/var/www/html:Z
    working_dir: /var/www/html
  database:
    build: docker/database
    command:
      - --character-set-server=utf8
      - --collation-server=utf8_unicode_ci
      - --default-authentication-plugin=mysql_native_password
    environment:
      - "MYSQL_USER=typo3"
      - "MYSQL_PASSWORD=typo3"
      - "MYSQL_DATABASE=typo3"
      - "MYSQL_ROOT_PASSWORD=rootpassword"
    networks:
      - backend
  phpmyadmin:
    image: phpmyadmin/phpmyadmin
    external_links:
      - database:db
    ports:
      - "8080:80"
    networks:
      - backend
networks:
  backend:

docker/typo3/Dockerfile

FROM php:7.4-apache
LABEL maintainer="ext.dev <[email protected]>"

ENV APACHE_DOCUMENT_ROOT=/var/www/html/public
RUN sed -ri -e 's!/var/www/html!${APACHE_DOCUMENT_ROOT}!g' /etc/apache2/sites-available/*.conf
RUN sed -ri -e 's!/var/www/!${APACHE_DOCUMENT_ROOT}!g' /etc/apache2/apache2.conf /etc/apache2/conf-available/*.conf

# Install TYPO3
RUN apt-get update && \
    apt-get install -y --no-install-recommends \
        wget \
# Configure PHP
        libxml2-dev libfreetype6-dev \
        libjpeg62-turbo-dev \
        libmcrypt-dev \
        libpng-dev \
        zlib1g-dev \
        libzip-dev \
# Install required 3rd party tools
        graphicsmagick && \
# Configure extensions
    docker-php-ext-configure gd --with-freetype --with-jpeg && \
    docker-php-ext-install -j$(nproc) mysqli soap gd zip opcache intl xml && \
    echo 'always_populate_raw_post_data = -1\nmax_execution_time = 240\nmax_input_vars = 1500\nupload_max_filesize = 32M\npost_max_size = 32M\nmemory_limit = 512M' > /usr/local/etc/php/conf.d/typo3.ini && \
# Configure Apache as needed
    a2enmod rewrite && \
    a2enmod deflate && \
    apt-get clean && \
    apt-get -y purge \
        libxml2-dev libfreetype6-dev \
        libjpeg62-turbo-dev \
        libmcrypt-dev \
        libpng-dev \
        libzip-dev \
        zlib1g-dev && \
    rm -rf /var/lib/apt/lists/* /usr/src/*
COPY --from=composer:latest /usr/bin/composer /usr/bin/composer

docker/database/Dockerfile

FROM mysql:5.7
LABEL maintainer="ext.dev <[email protected]>"

RUN echo 'sql_mode=ONLY_FULL_GROUP_BY,NO_ZERO_IN_DATE,NO_ZERO_DATE,ERROR_FOR_DIVISION_BY_ZERO,NO_AUTO_CREATE_USER,NO_ENGINE_SUBSTITUTION' >> /etc/mysql/mysql.conf.d/mysqld.cnf

 

Start Docker

Start the docker environment by running

docker-compose up

This should start up the docker instances - you should be available to access:

Setting up composer

To configure composer we will need to create the following file structure

{project_name}
| composer.json
| composer.lock

The composer.lock file will get generated by composer - so we only have to create the composer.json file

./composer.json

{
    "require": {
        "typo3/minimal": "10.4",
        "typo3/cms-about": "^10.4",
        "typo3/cms-belog": "^10.4",
        "typo3/cms-beuser": "^10.4",
        "typo3/cms-fluid-styled-content": "^10.4",
        "typo3/cms-reports": "^10.4",
        "typo3/cms-rte-ckeditor": "^10.4",
        "typo3/cms-tstemplate": "^10.4",
        "typo3/cms-form": "^10.4",
        "typo3/cms-lowlevel": "^10.4"
    },
    "repositories": [
        {
            "type": "path",
            "url": "./packages/*"
        }
    ]
}

Make sure to require all extensions that this TYPO3 project uses. Details on how to identify the package name can be found here:
https://docs.typo3.org/m/typo3/guide-installation/master/en-us/MigrateToComposer/MigrationSteps.html

Project specific extensions

Almost all projects use project specific TYPO3 extensions, for example a sitepackage extension.

To provide an extension that is not available via the public composer repository, we need to put the extension and all it's files in the packages subfolder:

{project_name}
└─── packages
   └─── {extension_key}
     |  composer.json
     |  ...

It's mandatory to have a composer.json for each extension. So we create it (if it's not there yet).

./packages/extension_key/composer.json

Make sure to replace the values (like extension_key and ExtensionNamespace) with the correct information. Make especially sure that the required typo3/cms-core version matches the core of your TYPO3 installation.

{
    "name": "extdev/extension_key",
    "type": "typo3-cms-extension",
    "description": "Extension Description",
    "license": "Unlicense",
    "require": {
        "typo3/cms-core": "^10.4.0"
    },
    "extra": {
        "typo3/cms": {
            "extension-key": "extension_key"
        }
    },
    "autoload": {
        "psr-4": {
            "ExtDev\\ExtensionNamespace\\": "Classes"
        }
    }
}

./composer.json

Require the extension by adding it to ./composer.json

{
    "require": {
        // [...]
        "extdev/extension_key": "@dev",
        // [...]
    }
    // [...]
}

 

Initializing the project via composer install

docker-compose up
docker exec -i [projectname]_typo3_1 composer install

 

Run chmod

Composer will generate a bunch of files. Since composer is running out of a docker container all files will be owned by root:root. To change this, run:

sudo chown user:user -R *

 

Run the TYPO3 installation

Once everything is set the TYPO3 install tool should be available at

http://localhost/typo3/

We set up our new TYPO3

Database

  • Database type: mysql
  • Server: database
  • Database: typo3
  • User: typo3
  • Password: typo3

Admin user

We create an admin user

Sitename

We use an appropriate site name (same as project name)

Open TYPO3 backend

We can now open the TYPO3 backend at http://localhost/typo3

The frontend (http://localhost/) will not be accessible yet, since we have no TypoScript page setup and no pages.

Start development

We can now start development by building the sitepackage extension [extension_key].