Hallo Kuchen! — Einstieg in das Web-Framework CakePHP 4.x

5 min readOct 16, 2020

Der Einstieg in ein neues Programmier-Framework ist immer mit einer gewissen Lernkurve verbunden. Sobald man aber die Grundkonzepte verstanden hat, kann man Anwendungen damit sehr schnell realisieren.

Hier zeige ich euch, wie ihr eine Web-Anwendung mit einem einfachen Formular und ohne Datenbank-Zugriff mit dem Framework CakePHP in der aktuelle Version 4 erstellt.

CakePHP umfasst die gesamte Anwendungsarchitektur, also Frontend (HTML, JS, CSS) und Backend (PHP, MySQL). Es nutzt, wie viele Web-Frameworks, das Model-View-Controller Entwurfsmuster. Für eine einfache “Hallo Welt!”-Anwendung brauchen wir aber erst einmal nur View und Controller. Los geht’s!

Vorbereitung

Für die Anwendung brauchen wir den Paket- und Dependency-Manager von PHP, Composer. Die Installation ist ausführlich im CakePHP-Handbuch beschrieben. Danach reicht ein einziger Befehl zum Erstellen eines CakePHP-Projektgerüsts (scaffolding) im Order MyCakeApp:

composer create-project --prefer-dist cakephp/app:~4.0 MyCakeApp

Mit Entwicklungsumgebungen wie PhpStorm oder VisualStudio Code (+Extensions) stehen uns Syntax-Prüfungen, Code Smells und Auto-Vervollständigung zur Verfügung, die uns vor vielen Fehlern bewahren.

Nun starten wir den eingebauten Webserver (Achtet unter Windows auf die richtigen Schrägstriche!):

bin\cake server

Beim Aufruf von http://localhost:8765 solltet ihr nun den CakePHP-Begrüßungsbildschirm sehen:

Alternativ geht das alles natürlich auch über XAMPP und ähnliche Pakete (denen neben PHP und Apache auch gleich noch MySQL beiliegt. Dabei sollte das Projektverzeichnis im Ordner htdocs/ liegen und es müssen die korrekten Pfade und Ports benutzt werden (z. B., http://localhost/MyCakeApp anstelle von http://localhost:8765 beim eingebauten Server). Auch müsst ihr für CakePHP 4.x in der my.ini von PHP (erreichbar über das XAMPP Control Panel) das Semikolon vor der intl-Extension entfernen.

1) Routing festlegen

Als Erstes legen wir den Pfad fest, unter der unsere Funktionalität in der Anwendung erreichbar sein soll. Diesen konfigurieren wir in der Datei config/routes.php.

Wir wollen jemanden begrüßen und registrieren dafür einen /hello-Pfad beim RouteBuilder von CakePHP. Diesem teilen wir außerdem mit, welcher Controller Anfragen an diese Route verarbeiten soll (HelloWorld) und welche Methode bzw. Aktion dafür in diesem Controller aufgerufen wird (greetSomeone).

Da wir unsere Route innerhalb des “/”-scope-Blocks einfügen, ist die Route innerhalb der gesamten Anwendung nutzbar.

$builder->connect('/hello', ['controller' => 'HelloWorld', 'action' => 'greetSomeone']);

2) Controller anlegen

Ein Aufruf der Route (http://localhost:8765/hello) weist uns auf den noch fehlenden Controller hin und gibt uns sogar den erwartenen Dateipfad und ein Code-Schnipsel mit:

Und genauso setzen wir das auch um. Wir legen also die Datei src/controller/HelloWorldController.php an und kopieren den vorgeschlagenen Code hinein:

<?php
namespace App\Controller;class HelloWorldController extends AppController
{}

Nach einem Refresh der Seite beschwert sich das Framework nun über eine fehlende Methode greetSomeone(), weil wir die zuvor schon im Routing angegeben hatten, sie aber nicht im Controller existiert. Also fügen wir eine leere Methode mit dem korrekten Namen ein:

<?php
namespace App\Controller;

class HelloWorldController extends AppController
{
    public function greetSomeone()
    {
        
    }
}

3) View anlegen

Nun fehlt noch das Template, das unsere View im MVC-Muster darstellt. Auch hierfür bekommen wir einen hilfreichen Hinweis vom Framework:

Das DebugKit von CakePHP weist uns in der Entwicklungszeit auf seine Konventionen hin. In diesem Fall erwartet der Controller das Vorhandensein eines Templates mit einem passenden Namen.

Beim Aufbau des User Interface (UI) sollten wir so viel wie möglich mit wiederverwendbaren Templates arbeiten. Dazu legen wir, den Namenskonventionen von CakePHP folgend, den Ordner “HelloWorld” und darin die Datei templates/HelloWorld/greet_someone.php mit folgendem Inhalt an:

<h1>Hello <?= $someoneToGreet ?>!</h1><?= $this->Form->create() ?>
<label>A special someone's name:
    <input name="someoneSpecial" type="text" />
</label>
<?= $this->Form->submit("Send greetings!") ?>
<?= $this->Form->end() ?>

Der Inhalt dieses Templates ist eine lustige Mischung aus HTML und PHP Code. Das <?= $var ?> ist eine Kurzschreibweise für <?php echo $var ?>. Weitere Besonderheiten sind die Möglichkeit mit $this auf die Bibliotheken des Frameworks zuzugreifen. In diesem Fall erstellen wir uns ein einfaches Formular mit einem Texteingabefeld und einem Senden-Knopf.

Besonders wichtig sind hier aber die beiden Bezeichner $someoneToGreet und someoneSpecial. Sie stellen unsere Verbindung zum Controller dar. Die Variable ($someoneToGreet) muss im Controller deklariert werden und ihr Inhalt wird einfach nur ausgegeben. Den Bezeichner (someoneSpecial) können wir im Controller-Scope nutzen, um eine neue Variable einzuführen.

Namenskonventionen

Als Schreibweisen für Bezeichner (Dateien, Klassen, Methoden…) gibt es snake_case, döner-spieß-case (kebap-case), CamelCase und viele andere Standards. Die Controller bei CakePHP verlangen CamelCase (Dateiname und Klasse). Für die Template-Dateinamen erwartet das Framework snake_case.

4) Ablauflogik ergänzen

Nun ergänzen wir noch etwas Logik im Controller, um unsere Anwendung zu vervollständigen:

<?php
namespace App\Controller;

class HelloWorldController extends AppController
{
    public function greetSomeone()
    {
        $someoneSpecial = $this->request->getData('someoneSpecial');        if ($someoneSpecial == '') {
            $someone = 'World';
        } else {
            $someone = $someoneSpecial;
        }
        $this->set('someoneToGreet', $someone);
    }
}

Standardmäßig wird “Hello World!” angezeigt. Wenn die Nutzerin jedoch ihren Namen eingibt, wird sie persönlich gegrüßt. Die zwei wichtigen Stellen sind…

$this->request->getData(‘someoneSpecial’), das uns den Inhalt des Eingabefelds “someoneSpecial” liefert, wenn das Formular abgesendet wurde und
$this->set(‘someoneToGreet’, $someone), das uns eine Variable mit dem Namen “someoneToGreet” zur Nutzung im Template zur Verfügung stellt.

Automatische Code-Vervollständigung in PhpStorm

Über den Zugriff auf die Request- und Response-Objekte wie bei $this->request lassen sich im Controller viele Dinge anstellen. So könnte man hier zum Beispiel auch Parameter aus der Aufruf-URL extrahieren (z. B., /hello/Peter?age=25). Schaut euch dazu die automatischen Vorschläge der IDE und das Handbuch an.

Alternativ lässt sich der Controller übrigens auch per Kommandozeile im Projektverzeichnis erzeugen, wodurch aber auch noch etwas zusätzlicher Code erstellt wird, den wir für dieses Beispiel noch nicht brauchen, der aber auch nicht schadet:

bin\cake bake controller HelloWorld

Achtet bei diesem Weg darauf, dass eine korrekt benannte Methode existiert. Von unserem greetSomeone in der Route weiß der Code-Generator nämlich nichts.

Das Ergebnis

Nach unserem definierten Routing sollten wir die Funktionalität aus View und Controller nun über http://localhost:8765/hello aufrufen können. Das mitgelieferte Stylesheet der CSS-Bibliothek Milligram sorgt dafür, dass das bisschen HTML auch gleich noch richtig schick aussieht:

Vom Ausgangszustand (“Hello World!”) bis zum persönlichen Gruß über die Variable aus dem Formular.

Das war’s schon! Für die häufigsten Fehler gibt CakePHP 4.x hilfreiche Hinweise und oft sogar Korrekturvorschläge.

Von diesem einfachen Beispiel aus kann man nun in verschiedene Richtungen vertiefen. — Formularvalidierung. Templating und Layouts. Aber vor allem natürlich zu den Models und ihrem Mapping auf eine relationale Datenbank (Objekt-relationales Mapping, ORM). Damit lässt sich dann der gesamte Weg für das Entwurfsmuster Model-View-Controller (MVC) abdecken.

Viel Erfolg beim Ausprobieren und Stöbern in der Dokumentation von CakePHP!