Slide 1

Slide 1 text

Real Values. Simon Praetorius
 Fluid Components (Presentational) Components in Fluid-Templates

Slide 2

Slide 2 text

Real Values. ➊ Was sind Komponenten? ➋ Warum Komponenten? ➌ Fluid Components + Demo ➍ Ideen & Ausblick

Slide 3

Slide 3 text

Real Values. ➊ Was sind Komponenten? Presentational Component ohne Logik gekapselt klare Schnittstelle

Slide 4

Slide 4 text

Real Values. ➋ Warum Komponenten? •Wiederverwendbarkeit •Lesbarkeit und Strukturierung (Atomic Design) •Refactoring •Design-Guidelines sicherstellen •bessere Zusammenarbeit FE 㲗 BE

Slide 5

Slide 5 text

Real Values. ➋ Zusammenarbeit Layout Template Partial Partial Integration Renderer Komponente API FRONTEND INTEGRATOR

Slide 6

Slide 6 text

Real Values. ➌ Fluid Components •Extension: fluid_components
 github.com/sitegeist/fluid-components •Komponenten in Fluid-Templates •Mischung aus ViewHelper und Partial •ViewHelper als Markup •Partial mit Namespace und API

Slide 7

Slide 7 text

Real Values. ➌ Fluid Components Layout Template Partial Partial Integration API Renderer Komponente FRONTEND INTEGRATOR

Slide 8

Slide 8 text

Real Values. ➌ Fluid Components Integration API Komponente FRONTEND

Slide 9

Slide 9 text

Real Values. ➌ Komponenten-API light [...]

Slide 10

Slide 10 text

Real Values. ➌ Fluid Components Integration Renderer Komponente FRONTEND

Slide 11

Slide 11 text

Real Values. ➌ Komponenten-Renderer [...]

{title}

{description}

Slide 12

Slide 12 text

Real Values. ➌ Fluid Components Template Integration Komponente INTEGRATOR

Slide 13

Slide 13 text

Real Values. ➌ Komponenten-Integration {namespace my=VENDOR\MyExtension\Components}

Slide 14

Slide 14 text

Real Values. Demo

Slide 15

Slide 15 text

Real Values. ➍ Ideen & Ausblick •stabiler Prototyp •Baustellen: •Translations •fluid_styled_content •Formulare •Link-Felder •Responsive Images

Slide 16

Slide 16 text

Real Values. ➍ Ideen & Ausblick •Frontend-Building für Komponenten •Integration in Fluid? •Living Styleguide •Fixtures (statisch, dynamisch) •Metadaten für Komponenten

Slide 17

Slide 17 text

Real Values. Links Extension github.com/sitegeist/fluid-components sitegeist @sitegeist_de / techblog.sitegeist.de Simon Praetorius @s2bproject / @somethingphp

Slide 18

Slide 18 text

Real Values. Vielen Dank!