TYPO3 Neos - Next Generation CMS (IPC 2014)

TYPO3 Neos
Next Generation CMS
Patrick Lobacher
GF +Pluswerk GmbH
29.10.2014

Responsive Webdesign verkaufen
TYPO3 Neos - Next Generation CMS
Patrick Lobacher
Geschäftsführer +Pluswerk GmbH
• 44 Jahre, glücklich verheiratet, wohnhaft in
München
• Selbständig im Bereich Webentwicklung seit 1994
• Autor von 10 Fachbüchern und > 50 Fachartikeln
zum Thema TYPO3 und Webentwicklung
• Mitglied im TYPO3 Education Committee
• Speaker, Trainer, Consultant, Coach, Nerd
Veröffentlichungen:
(c) 2014 - Patrick Lobacher | TYPO3 Neos - Next Generation CMS | www.plus-werk.com | 29.10.2014

Agentur für digitale Kommunikation
+[ 10 ] Standorte in Deutschland
+[ 130 ] Mitarbeiter
+[ 999 ] realisierte Projekte mit Magento und TYPO3

Agenda
Slides: www.lobacher.de/ipc14-neos
• Was ist TYPO3 Neos?
• Features
• Architektur & Internas
• Konzepte
• Showcases
• Quellen & Infos

TYPO3 Neos is the next-generation
open source content management
system made by the TYPO3
community. Neos is based on the
PHP framework TYPO3 Flow.

Die Geschichte von TYPO3 Neos beginnt bei TYPO3 CMS
• TYPO3 CMS ist ein „Enterprise Open Source
Content Management Framework“
• TYPO3 CMS existiert seit 1998
• Erfunden vom Dänen Kaspar Skårhøj
• ca. 500.000 Installationen weltweit / > 5 Mio Downloads
• Einsatz in DE z.B. bei > 50% aller DAX 500 Unternehmen, >
50% aller Bundesliga-Vereinen, Discounter, Autovermieter,
Öffentliche Träger,
• > 6.000 Extensions
• > 150.000 Entwickler weltweit
• > 2000 Agenturen weltweit
• Finanziert und unterstützt von der TYPO3 Association

Die Geschichte von TYPO3 Neos: TYPO3 Phoenix
• Auf den ersten T3DD (TYPO3 Developer Days) im Jahr 2006
wurde der Entschluss gefasst, TYPO3 von Grund auf neu zu
schreiben
• Codename: TYPO3 Phoenix (bzw. TYPO3 5.0)
• Einige benötigte/gewünschten Features gab es damals in PHP
noch nicht und mussten komplett neu implementiert werden:
Content Repository (JSR-170), Aspect Oriented Programming,
Domain Driven Design, Dependency Injection, ...
• Mit dem „Berlin Manifesto“ wurde 2008 der Rahmen und die
Abgrenzung zum TYPO3 CMS festgelegt
http://typo3.org/about/the-history-of-typo3/berlin-manifesto/
(Erweitert 2013 um den Zusatz, dass TYPO3 Neos nicht der Nachfolger von TYPO3 CMS ist)

Die Geschichte von TYPO3 Neos: TYPO3 Flow und Neos
• Viele Grundfunktionen eines CMS sind nicht CMS-spezifisch
(Session-Handling, Datenbank-Handling, Templating, ...) =>
daher Trennung dieser Funktionalitäten in ein eigenes
Framework => TYPO3 Flow
• Am 20. Oktober 2011 wurde das Application Framework TYPO3
Flow (ehemals FLOW3) als Final veröffentlicht (Aktuell 2.2.2)
• TYPO3 Neos ist eine Applikation die auf TYPO3 Flow basiert
• Erste Version 1.0.0 am 10.12.2013
• Aktuell 1.1.2 am 02.09.2014

Die TYPO3 Welt
• Dachmarke TYPO3
• TYPO3 CMS
(hat kein eigenes Logo)
• TYPO3 Flow
• TYPO3 Neos

TYPO3 Neos: Positionierung
• Es gibt ab Dezember 2013 zwei unabhängige CMS aus dem Hause
TYPO3:
• TYPO3 CMS 6.2.x und 4.5.x LTS
• TYPO3 Neos 1.1.x
• Technologisch haben beide (fast) NICHTS miteinander zu tun
• Es gibt (zur Zeit) KEINE automatische Migrationsmöglichkeiten von
einem der beiden Systeme zum anderen
• TYPO3 Neos ist NICHT der Nachfolger von TYPO3 CMS,
sondern ein eigenständiges CMS mit anderem Fokus

Quelle: neos.typo3.org

Was fehlt bisher noch?
• Mehrspachigkeit (1.2)
• ACL (1.3)
• Backend-Übersetzung (1.3)
• Content-Constraints (1.2)
• REST (1.3)
• Gemeinsame Workspaces & Workflows
• Repository (Plugins, NodeTypes, ViewHelper)
• Integrierter Formbuilder (Verwendung von Forms möglich)
• SEO Build-In (Leicht nachzurüsten)
• Digital Asset Management (es gibt einen Media-Browser)

Mini-Roadmap
• TYPO3 Neos 1.2 (in ein paar Tagen)
• TYPO3 Neos 1.3 (bis Weihnachten *g*)
http://neos.typo3.org/roadmap.html

Systemvoraussetzungen von TYPO3 Neos
• Webserver (empfohlen ist Apache 2.x mit aktiviertem mod_rewrite
Modul)
• PHP 5.3.7 - 5.4.x (minimal wäre PHP 5.3.2 - dort kann es zu Problemen
kommen)
• Folgende Funktionen müssen in PHP aktiviert sein: system, shell_exec, escapeshellcmd,
escapeshellarg, proc_open und exec()
• php.ini: memory_limit = 512M oder höher (empfohlen 1014M)
• php.ini: xdebug.max_nesting_level = 500 (sofern xdebug verwendet wird)
• php.ini: Fügen sie die folgende Optionen ans Ende hinzu: detect_unicode = Off
• php.ini: Zudem muss Magic_Quotes ausgeschaltet werden: magic_quotes_gpc = Off
• php.ini: Die Kommandozeile von Flow benötigt ferner noch eine Zeitzoneneinstellung:
date.timezone= „Europe/Berlin“
• Shell-Zugang

Installation von TYPO3 Neos - Composer
• Die Installation erfolgt über „Composer“
(Dependency Manager für PHP)
• Dafür ist Zugang zur Konsole nötig
$ cd /pfad/zum/webserver/
$ curl -sS https://getcomposer.org/installer | php
$ php /path/to/composer.phar create-project --no-dev
typo3/neos-base-distribution TYPO3-Neos-1.1
$ cd TYPO3-Neos-1.1
$ ./flow flow:core:setfilepermissions shelluser
wwwuser wwwgroup
http://neos.demo/setup/

http://www.codecoon.com

https://launchr.com/typo3-neos

Die Architektur von TYPO3 Neos - Backend
Fluid
Modern Templating Engine
TYPO3CR
Content Repository
(JCR 170/ Sling)
TypoScript
TypoScript 2.0
Form
Form API & Form Builder
Expose
Extensible admin interface
Eel
Embedded Expression
Language
FlowQuery

Die Architektur von TYPO3 Neos - Frontend
EmberJS
JavaScript Web Application
Framework
Create.js
Web Editing Interface
Aloha / Hallo
HTML5 WYSIWYG Editor
VIE = viejs.org
Semantic Interaction
Framework
RequireJS
JavaScript file and module
loader

TYPO3 Flow - Web Application Framework
• OOP - Object-Oriented Programming
• TDD - Test Driven Development
• DDD - Domain Driven Design (Eric Evans)
• MVC - Model, View, Controller
• AOP - Aspect Oriented Programming
(Separation of Concerns, Cross cutting
concerns)
• DI - Dependency Injection
• ORM - Object Relational Mapping
(basierend auf Doctrine 2, eigenes ORM
möglich)
Achtung:
Buzzword-
Bingo :-)

Node Structure
• TYPO3CR Node
• Node Name
(dient der Identifikation)
• Node Type
(z.B. Document, Folder, AbstractNode, Content,
ContentCollection...)
• Properties
(Abhängig vom NodeType)
• Einfach erweiterbar und leicht
konfigurierbar
Page
Content Section
Content Element
Site root
Domain Model

Node Type
• Jede TYPO3CR Node hat einen
sogenannten Node Type
• Node Types können in jedem Package
über YAML (Yet Another Markup
Language) definiert werden
• Jeder Node Type kann einen oder
mehrere Eltern-Typen haben. Wenn
diese spezifiziert sind, werden alle
Eigenschaften und Settings der Eltern
Types vererbt
• Zusätzlich ist es möglich Child-Nodes zu
definieren, die automatisch erstellt
werden

Node Zugriff
• Der Zugriff auf Nodes erfolgt durch „NodePaths“
• Jede Seite ist ein Node, jedes Element auf einer Seite ebenfalls
/sites/typo3org/home/subpage/main/text1
section
content
pages
site root

Fluid
Objektorientierte Templating Engine (CMS, Flow, Neos)

TypoScript
• TypoScript ist eine hierarchische, objektorientierte und Prototypen-basierte
Verarbeitungssprache
• Wird von Neos verwendet, um den Content flexibel zu rendern
• Objekte sind z.B. Array, Collection, Case, Menu, Page, Template, Plugin,
Value, ...
• Objekte haben Eigenschaften, die das Objekt „konfigurieren“
• TypoScript hat Zugriff auf den jeweiligen „Context“ (z.B. Seitenbaum im
Objekt „menu“ oder Seiteneigenschaften im Objekt „page“)
• Es gibt „Prozessoren“ die die Eigenschaftswerte verändern können
(ähnlich stdWrap-Funktionen in TYPO3 CMS)

Eel - Embedded Expression Language
•Während TypoScript Zuweisungen und Prozessoren beinhaltet, kann man
mit Eel Ausdrücke der Art
myObject.foo = ${…}
formulieren
•Die Embedded Expression Language (Eel) ist ein Baustein um Domain
Specific Languages (DSL) zu erstellen.
•Eel stellt eine reichhaltige Syntax zur Verfügung um beliebige
Ausdrücke zu erstellen, damit sich der Autor der DSL auf die Semantik
konzentrieren kann
•Eel ist in Anlehnung an JavaScript (Subset) realisiert worden

Eel - Embedded Expression Language
${String.substr("Hello world!", 6, 5)}
${String.toUpperCase(value)}
${Date.year(Date.now())}
${(value ? value + ' - ' : '') + 'TYPO3 Neos'}
${'item' + (carouselItemsIteration.isFirst ? '
active' : '')}
${'col-sm-' +
String.split(q(node).parent().property('layout'),
'-')[multiColumnIteration.index]}

FlowQuery
• FlowQuery ist eine Art jQuery für das Content Repository
• FlowQuery stellt damit einen Weg dar, um Content (der ja eine TYPO3CR
Node in Neos ist) in Eel zu verarbeiten
• FlowQuery Operationen werden durch PHP-Klassen realisiert
• In FlowQuery gibt es Operationen (property, filter, children, parents,
count, …) und einen Kontext (Node, Site, DocumentNode, …)
• FlowQuery ist beliebig erweiterbar

Quelle: http://learn-neos.com/
FlowQuery
TypoScript:
page = Template {
templatePath = 'Main.html'
node = ${node}
childNodes = ${q(node).find('main').children()}
}
Template:
<html>
<title>{node.properties.title}</title>
<body>
<h1>{node.properties.title}</h1>
<f:for each="{childNodes}" as="childNode">
<h2>{childNode.properties.title}</h2>
<p>{childNode.properties.text}</p>
</f:for>
</body>
</html>

FlowQuery
TypoScript:
prototype(TYPO3.Neos:BreadcrumbMenu) < prototype(TYPO3.Neos:Menu) {
templatePath = 'resource://TYPO3.Neos/Private/Templates/TypoScriptObjects/
BreadcrumbMenu.html'
itemCollection = ${q(node).add(q(node).parents('[instanceof
TYPO3.Neos:Document]')).get()}
attributes.class = 'breadcrumb'
}
Template:
{namespace neos=TYPO3NeosViewHelpers}
<f:if condition="{items}">
<ul{attributes -> f:format.raw()}>
<f:for each="{items}" as="item" reverse="TRUE">
<li{ts:render(path:'{item.state}.attributes') -> f:format.raw()}>
<f:if condition="{item.state} == 'current'"><f:then>{item.label}</f:then>
<f:else><neos:link.node node="{item.node}">{item.label}</
neos:link.node></f:else>
</f:if>
</li>
</f:for>
</ul>
</f:if>

Konzepte: Content-Dimension
Sprache de en fr
Land DE US CH
Multi-Varianten A B C
Ziel-Gruppen Marketing Vertrieb GF
CORE:þ
UI:ý
Personalisierung User1 User2 User3
Location based, Time-Zone, Channel, Device,…

Konzepte: Content Cache
• Jedes TypoScript-Objekt
kann seine eigene Cache
Konfiguration besitzen
• @cache {
mode = 'cached'
maximumLifetime = '86400'
entryIdentifier {
node = ${node}
format = ${request.format}
}
entryTags {
# Whenever the node changes the matched condition could change
1 = ${'Node_' + documentNode.identifier}
# Whenever one of the parent nodes changes the layout could change
2 = ${'DescendantOf_' + documentNode.identifier}
}
}
CORE:þ
UI:ý

Konzepte: Editing / Preview Modes
CORE:þ
UI:þ

Showcases
http://neos.typo3.org/demo/neos-references.html

Das TYPO3 Neos Kompendium
Über 330 Seiten zu allen
Aspekten von TYPO3 Neos
• Installation
• Konfiguration
• Architektur
• FAQ
• Integration
• Entwicklung
www.lobacher.de/neoskompendium
de.slideshare.net/
plobacher/typo3-neos-das-kompendium

Das TYPO3 Neos Buch
Fake
Cover!
Verlag: O’Reilly
Umfang: ca. 450
VÖ: Ende Q1 / 2015

Quellen und Informationen
• TYPO3 Neos Website
http://neos.typo3.org/
• TYPO3 Neos Download
http://neos.typo3.org/download.html
• TYPO3 Flow Website
http://flow.typo3.org/
• TYPO3 Neos Dokumentation
http://docs.typo3.org/neos/TYPO3NeosDocumentation/Index.html
• TYPO3 Flow Dokumentation
http://flow.typo3.org/documentation.html

• TYPO3 Neos & TYPO3 Flow Bugtracker
https://jira.typo3.org
• Cheatsheet für Fluid (und demnächst für Flow)
http://www.lobacher.de/files/cs/
FluidCheatSheet_3.01_Lobacher.pdf

• Learn Neos
http://www.learn-neos.com
• TypoScript 2 Pocket Reference
http://learn-neos.com/reference/pocket-reference-typoscript2.
html
• GitHub Account von Lelesys (Pankaj Lele / http://www.lelesys.com/)
https://github.com/lelesys
• IRC Log vom Channel #typo3-neos bei Freenode
http://riesvantwisk.com/cms/home/irc-logs/typo3-neos-irc-log.
html

Installations-Alternativen und Hilfen
• TYPO3 Neos Vagrant Box
https://github.com/tlayh/vagrant-typo3neos
• TYPO3 Neos Installation auf Mac OS X Snow Leopard und MAMP
http://www.content-driven-ecommerce.de/typo3-neos-install/
• .git ignore File
https://git.typo3.org/Neos/Distributions/Base.git/blob/
HEAD:/.gitignore
• Launchr (TYPO3 Neos Online testen)
https://launchr.com/
• Mittwald Hosting - 30 Tage TYPO3 Neos Account
https://www.mittwald.de/neos-testen/
• Manuelle Installation von jweiland.net
http://jweiland.net/typo3/neos/neos-installation/manuelle-neos-installation.
html
• Installation auf einen Shared Hosting (Hostshare)
https://wiki.hostsharing.net/index.php?title=TYPO3_Neos_installieren

TYPO3 Neos Schulungen
Termin: 01.-02.12.2014
Ort: München
Infos: info@plus-werk.com
@PatrickLobacher

Komme ins TYPO3 Neos Team
• Komme ins TYPO3 Neos und
Flow Team!
• Jeder wird gebraucht: Programmierer,
Architekten, UX-Experten, Designer,
Doku, Tester, JS-Spezialisten, ...
• Meldet Euch bei robert [at] typo3.org

Kunden gesucht!
• Direkte Mitarbeit
• Gebe frühes Feedback zu neuen Funktionen, User Interfaces, ...
• Direkter Kontakt und Diskussion mit den Entwicklern
• Sofern sinnvoll, wird das Feedback unmittelbar umgesetzt
• Vorteile
• Gestalte das WCMS der Zukunft direkt mit
• Nimm Einfluss auf die Entwicklung
• Zugang zu Entwicklern, Architekten und UX‘lern
• Networking mit anderen Neos-Kunden
• Kontakt
• rasmus [at] typo3.org
• TYPO3 Neos Agentur (pluswerk, techdivision, networkteam, …)

Fragen?
Oder komplett verwirrt?
Slides: www.lobacher.de/ipc14-neos

Besten Dank für Eure
Aufmerksamkeit!
plus-werk.com

Kontakt
Klassisch:
+Pluswerk GmbH
Patrick Lobacher
Solmstr. 6A
60486 Frankfurt am Main
Fon: +49 89 130 145 20
Email: lobacher@plus-werk.com
Web: www.plus-werk.com
Twitter:
www.twitter.com/PatrickLobacher
Facebook:
www.facebook.com/patrick.lobacher
Blog:
blog.lobacher.de
Schulungen:
www.lobacher.de
Google+:
plus.google.com/105500420878314068694
XING:
www.xing.com/profile/Patrick_Lobacher
LinkedIn
www.linkedin.com/pub/patrick-lobacher/
4/881/171
Slideshare:
www.slideshare.net/plobacher
Amazon:
www.amazon.de/Patrick-Lobacher/e/
B0045AQVEA
Profil: Full Service Agentur für digitale Kommunikation
Schwerpunkt: Open Source Technologie
Kunden: Enterprise & KMU

Referenzen (Auszug: +Pluswerk/net-o-graphic/typofaktum/typovision)

TYPO3 Neos - Next Generation CMS (IPC 2014)

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (7)

Andere mochten auch

Andere mochten auch (20)

Ähnlich wie TYPO3 Neos - Next Generation CMS (IPC 2014)

Ähnlich wie TYPO3 Neos - Next Generation CMS (IPC 2014) (20)

Mehr von die.agilen GmbH

Mehr von die.agilen GmbH (20)

TYPO3 Neos - Next Generation CMS (IPC 2014)