[t3con12ca] typo3 phoenix - the current state
DESCRIPTION
Held at the T3CON12CA in Québec, Canada on 15th of June 2012.TRANSCRIPT
TYPO3 PhoenixThe Current State
Christian Müller
Tuesday 26 June 12
Christian Müller
@daskitsunet
Tuesday 26 June 12
Content Model
Plugin System
Module System
What did we do?
UserInterface
TypoScript Foundations
Tuesday 26 June 12
Content Model
Tuesday 26 June 12
Node Treesite root
page
content section
content element
representation of domain models
and just anything you want them to be!
Tuesday 26 June 12
Node Paths
/sites/typo3org/home/subpage/main/text1
Tuesday 26 June 12
/sites/typo3org/home/subpage/main/text1
site root
Node Paths
Tuesday 26 June 12
/sites/typo3org/home/subpage/main/text1
site root
pages
Node Paths
Tuesday 26 June 12
/sites/typo3org/home/subpage/main/text1
site root
pages
section
Node Paths
Tuesday 26 June 12
/sites/typo3org/home/subpage/main/text1
site root
pages
section
content
Node Paths
Tuesday 26 June 12
Context
Tuesday 26 June 12
Context is
• an environment a node exists in
• for example a workspace or a language
Tuesday 26 June 12
Plugin System
Tuesday 26 June 12
Plugin System
• Every FLOW3 Package can be used as Phoenix Plugin
• Just needs a few lines of configuration
Tuesday 26 June 12
Module System
Tuesday 26 June 12
Single Page Modules
• Backend Modules!• Use the Javascript Framework you like• Style it to fit your needs• reuse our interface widgets
Tuesday 26 June 12
User Interface
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
http://www.sxc.hu/photo/1281342
Progressvery slow
Tuesday 26 June 12
http://www.sxc.hu/photo/1281342
Why... no progress?
Tuesday 26 June 12
http://www.sxc.hu/photo/1281342
Why... no progress?
• Difficult to build stable + extensible JS application
Tuesday 26 June 12
http://www.sxc.hu/photo/1281342
Why... no progress?
• Difficult to build stable + extensible JS application
• we could not use FLOW3 strenghts for Phoenix
Tuesday 26 June 12
http://www.sxc.hu/photo/1281342
Why... no progress?
• Difficult to build stable + extensible JS application
• we could not use FLOW3 strenghts for Phoenix
• styling and adjusting ExtJS very complex
Tuesday 26 June 12
http://www.sxc.hu/photo/1281342
Why... no progress?
• Difficult to build stable + extensible JS application
• we could not use FLOW3 strenghts for Phoenix
• styling and adjusting ExtJS very complex
• un-agile development process
Tuesday 26 June 12
The UX Concept from Last Year
Tuesday 26 June 12
The UX Concept from Last Year
Visionary!
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Which kind of web applications
do I use?
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
Web-StyleApplication
Desktop-StyleApplication
Tuesday 26 June 12
Try outsomethingnew...
Tuesday 26 June 12
Try outsomethingnew...
take thebird-eyeview
Tuesday 26 June 12
Tuesday 26 June 12
ReliableEditing
Tuesday 26 June 12
ReliableEditing
PredictableBehavior
Tuesday 26 June 12
ReliableEditing
PredictableBehavior
ImmediateUser Feedback
Tuesday 26 June 12
ReliableEditing
PredictableBehavior
ImmediateUser Feedback
Built With The Web - For The Web
Tuesday 26 June 12
more pragmatic
Tuesday 26 June 12
Technical Foundations
• ExtJS where it makes sense
• good mixture of Server- and Client Side
• SproutCore 2
Tuesday 26 June 12
Wanna See It Live?
Tuesday 26 June 12
Really?
Tuesday 26 June 12
Demo!
Tuesday 26 June 12
UI Architecture
Tuesday 26 June 12
EmberJS
Tuesday 26 June 12
About EmberJS
• build on top of jQuery
• strong MVC concept
• MIT license
• mobile.me and iWork
Tuesday 26 June 12
Data Binding
Tuesday 26 June 12
Data Binding truly connects your UI and data
Content (Data)
UI ComponentUI Component
Tuesday 26 June 12
Tuesday 26 June 12
Tuesday 26 June 12
<div class="t3-inspect">{{view T3.Content.UI.InspectButton pressedBinding="T3.Content.Controller.Inspect.inspectMode" label="Inspect"}}
</div>
How Handlebars Templates Look Like
Tuesday 26 June 12
Content Module Architecture
Tuesday 26 June 12
DOM Manipulation allows us
• integration into the existing website
• no frames needed
• content editing wysiwyg
Tuesday 26 June 12
Using FLOW3
Tuesday 26 June 12
•use Fluid templates•request pre-made elements from server•separate modules•security
Use the strengths of the foundation
Tuesday 26 June 12
Productivity!
Tuesday 26 June 12
Tuesday 26 June 12
TypoScript 2
Tuesday 26 June 12
TypoScript 2 usage
• mainly dealing with nodes
• but not always involving a node
• nodes can be rendered multiple times
• flexibility needed
• hierarchical access to nodes
Tuesday 26 June 12
• TypoScript v4: extensibility, stdWrap
• Fluid: HTML Templating
• JavaScript: Prototype-based inheritance
• jQuery: selecting nodes, fluent interface
• CSS: set-based API; Selector Syntax
• XPath: Traversal Operations
Inspirations
Tuesday 26 June 12
Foundations
Tuesday 26 June 12
FLOW3 1.1
• Internationalisation
• Speed Improvements
• HTTP Foundations
Tuesday 26 June 12
Node Repository
• Polishing API
• Sorting Nodes
Tuesday 26 June 12
Installation Tool
• Almost ready
• Few simple steps to get your Phoenix installation running
Tuesday 26 June 12
The Future
Tuesday 26 June 12
http://www.sxc.hu/photo/107023
Tuesday 26 June 12
Next Steps
• System / Reports Views
• fine-tune editing and module API
• Implement a proper design
• find a name
RELEASE!
Tuesday 26 June 12
Running Phoenix Yourself
• Follow http://wwwision.de/githelper/#TYPO3v5/Distributions/Base.git for checking out from Git
• Follow http://flow3.typo3.org/fileadmin/manual/nightly/Quickstart/Index.html#setting-file-permissions for setting permissions
• create database, adjust /Configuration/Settings.yaml
• ./flow3 doctrine:migrate
• ./flow3 site:import --packageKey TYPO3.PhoenixDemoTypo3Org
• Point your Firefox or Chrome browser to your local installation
Tuesday 26 June 12
Wrap-Up
Tuesday 26 June 12
Thank You!
Tuesday 26 June 12
Tuesday 26 June 12
?????????????
Tuesday 26 June 12
Tuesday 26 June 12
inspiring people to share.
Tuesday 26 June 12