20. August 2022

TYPO3 Quick Installation Guide

The famous five minutes installation using using DDEV, Composer and Sitepackagebuilder.

Prerequisites

Install Docker Desktop and DDEV Local (macOS, Windows/WSL 2, Linux).

Start Docker Desktop from the command line with open -a Docker (macOS).

Make a new directory for your project

(for example in the folder ~/Projects/)

mkdir my-new-project
cd my-new-project

Setup a DDEV project, download and install TYPO3 with Composer

The following steps are taken from get.typo3.org.

ddev config --project-type=typo3 --docroot=public --create-docroot
ddev composer create --no-install "typo3/cms-base-distribution:^11.5"
ddev composer install
ddev typo3cms install:setup

• When prompted, you may use these conventions for local development
  • username: admin
  • password: password
• When prompted to Specify the site setup type, select site

Create a folder for local composer packages and configure Composer accordingly

mkdir -p packages
ddev composer config repositories.local path "packages/*"

Create a new base package

• Go to sitepackagebuilder.com
• Select Fluid Styled Content as a base package
• Company and title fields will be used to generate namespace and package name, so you might want to keep these rather short
• Add base to the end of your title (for example my new project base) to indicate this is your basepackage.
• Create new folder mkdir packages
• Download the and extract the .zip file and copy the folder to /packages/

Give the base package a version number

Open /packages/my_new_project_base/composer.json in your code editor and add a new entry for the version:

{
  "name": "my-company/my-new-project-base",
  "version": "0.0.1"
}

Require the new base package with composer

Use name and version from above:

ddev composer require my-company/my-new-project-base:^0.0.1

Import setup and configuration typoscript from your base package

Open the TYPO3 backend in your browser

ddev launch typo3

• Open the Template module
• In the pagetree, select the rootpage (“Home”, globe icon)
• Open the Info/modify pane
• Click in the Edit the whole template record button
• Under Constants add this line

@import 'EXT:my_new_project_base/Configuration/TypoScript/constants.typoscript'

• Under Setup, remove the existing typoscript code and replace it with

@import 'EXT:my_new_project_base/Configuration/TypoScript/setup.typoscript'

Done!

Background

As a frontend developer setting up new projects is not my day to day business. However I find it useful to be able to quickly spin up a fresh TYPO3 installation. With this I’m able to try out new ideas, like the TYPO3 Vite integration. Having access to a barebones installation also helps me to understand things better, compared to the grown and rather large projects I usually work with.

Shout out to Korbinian Kugelmann, Sebastian Hofer and Eric Bode.