Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Fluid Styleguide – Living Styleguide für TYPO3

Avatar for Simon Praetorius Simon Praetorius
September 12, 2019
Technology
210
0

Fluid Styleguide – Living Styleguide für TYPO3

TODO

https://fluidcomponents.sitegeist.de/

#dmexco #typo3

Avatar for Simon Praetorius

Simon Praetorius

September 12, 2019

More Decks by Simon Praetorius

See All by Simon Praetorius
What SPAs Got Right: Lessons for Boring Web Development
Avatar for Simon Praetorius s2b
0
77
Fluid Templating in TYPO3 14
Avatar for Simon Praetorius s2b
0
300
The State of Fluid (2025)
Avatar for Simon Praetorius s2b
0
370
Vite – TYPO3's nimble frontend companion
Avatar for Simon Praetorius s2b
0
550
Pragmatic Responsive Images
Avatar for Simon Praetorius s2b
0
330
Expedition into the Frontend Jungle
Avatar for Simon Praetorius s2b
0
900
Vite & TYPO3
Avatar for Simon Praetorius s2b
0
1.5k
The [r]evolution of Fluid Components
Avatar for Simon Praetorius s2b
0
780
Daily Business with a Living Styleguide
Avatar for Simon Praetorius s2b
0
360

Other Decks in Technology

See All in Technology
【Gen-AX】20260530開催_JJUG CCC 2026 Spring
Avatar for Gen-AX株式会社 genax
0
420
Cloud Run のアップデート 触ってみる＆紹介
Avatar for Gre212 gre212
0
310
ITエンジニアを取り巻く環境とキャリアパス / A career path for Japanese IT engineers
Avatar for 高玉 広和 / TAKATAMA Hirokazu takatama
4
1.8k
生成 AI × MCP で切り拓く次世代 SRE！自律型運用への挑戦と開発者体験の進化
Avatar for _awache _awache
0
150
TypeScript Compiler APIとPHP-Parserを活用し、TypeScriptとPHPで型を共有する
Avatar for did0es shuta13
0
360
Chart.js が簡単に使えるようになっていたので OGP 画像生成に使った話
Avatar for すずとも kamekyame
0
150
Platform engineering for developers, architects & the rest of us (AI agents)
Avatar for danielbryantuk danielbryantuk
0
180
製造業のクラウド活用最適解〜AI，DXを加速するデータ基盤の作り方〜
Avatar for 濱田孝治 hamadakoji
0
360
Claude Codeを組織で使いこなす— サーバサイドAIエージェント運用の実践知
Avatar for PERSOL CAREER Dev | techtekt techtekt
PRO
0
200
LLMと共に進化するプロセスを目指して
Avatar for y_matsuwitter ymatsuwitter
9
2.2k
Mastering Ruby Box
Avatar for Satoshi Tagomori tagomoris
3
150
ポケモンの型をTypeScriptの型システムで表現してみた
Avatar for subroh_0508 subroh0508
0
310

Featured

See All Featured
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
Avatar for Greg Gifford greggifford
PRO
0
190
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
350
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
Avatar for Helen Beal helenjbeal
1
220
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
10
1.2k
The Cost Of JavaScript in 2023
Avatar for Addy Osmani addyosmani
55
10k
Exploring anti-patterns in Rails
Avatar for Elle Meredith aemeredith
3
390
How To Stay Up To Date on Web Technology
Avatar for Chris Coyier chriscoyier
790
250k
SEO Brein meetup: CTRL+C is not how to scale international SEO
Avatar for Linda Hogenes lindahogenes
1
2.7k
The browser strikes back
Avatar for Jono Alderson jonoalderson
0
1.1k
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
790
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
41
2.5k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
35
3.5k

Transcript

  1. Real Values. Simon Praetorius
 Fluid Styleguide Living Styleguide für TYPO3

  2. Real Values. Simon Praetorius: Fluid Styleguide TYPO3 + Fluid Fluid

    Components Fluid Styleguide

  3. Real Values. Simon Praetorius: Fluid Styleguide TYPO3 + Fluid Fluid

    Components Fluid Styleguide

  4. Real Values. Simon Praetorius: Fluid Styleguide – Komponenten Was sind

    Komponenten?

  5. Real Values. Beispiel: Teaser ICON TITLE DESCRIPTION LINK THEME Simon

    Praetorius: Fluid Styleguide – Komponenten

  6. Real Values. ♻ # $ ♿ presentational logicless encapsulated clear

    API enforce guidelines reusable ⌨ code Simon Praetorius: Fluid Styleguide – Komponenten

  7. Real Values. Component-Driven Development Integration Komponente Look&Feel API Website-Layout Daten-Aufbereitung

    $ FRONTEND ) INTEGRATOR Simon Praetorius: Fluid Styleguide – Komponenten

  8. Real Values. TYPO3 + Fluid Fluid Components Fluid Styleguide Simon

    Praetorius: Fluid Styleguide

  9. Real Values. Simon Praetorius: Fluid Styleguide – Living Styleguide Was

    ist ein Living Styleguide?

  10. Real Values. Was ist ein Dead Styleguide? Styleguide_Final2.pdf Simon Praetorius:

    Fluid Styleguide – Living Styleguide

  11. Real Values. Simon Praetorius: Fluid Styleguide – Living Styleguide Was

    ist ein Living Styleguide?

  12. Real Values. ♻ # $ ♿ presentational logicless encapsulated clear

    API enforce guidelines reusable ⌨ code Simon Praetorius: Fluid Styleguide – Living Styleguide

  13. Real Values. Simon Praetorius: Fluid Styleguide – Zielgruppen Wer ist

    die Zielgruppe?

  14. Real Values. Fluid Styleguide $ DESIGNER # DEVELOPER * PROJECT

    MANAGER + CLIENT Simon Praetorius: Fluid Styleguide – Zielgruppen

  15. Real Values. Simon Praetorius: Fluid Styleguide Sponsor & Erstnutzer

  16. Real Values. Demo fluidcomponents.sitegeist.de Simon Praetorius: Fluid Styleguide

  17. Real Values. Links mehr Informationen fluidcomponents.sitegeist.de sitegeist @sitegeist_de / techblog.sitegeist.de

    / sitegeist.de Simon Praetorius @s2bproject / @somethingphp / [email protected] Simon Praetorius: Fluid Styleguide

  18. Real Values. Danke für die Aufmerksamkeit!