TASTY NEOS RECIPES FOR EVERY DAY

Presented at Inspiring Con 2016

Transcript

1. TASTY NEOS RECIPES FOR EVERY DAY CREATE BETTER WEBSITES WITH NEOS SEBASTIAN HELZLE - INSPIRING CON 2016
2. TASTY NEOS RECIPES FOR EVERY DAY - INTRODUCTION ABOUT ME ▸ Years of TYPO3, Flow & Neos experience ▸ Neos team member ▸ Product Owner @ punkt.de ▸ Living in Karlsruhe ▸ Sometimes living in Cambodia ▸ Hiker & baker ▸ @sebobo
3. TASTY NEOS RECIPES FOR EVERY DAY - INTRODUCTION THIS TALK HELPS ▸ Developers ▸ Who start a new project ▸ Who want to learn more ▸ Who want to stay up-to-date ▸ Editors ▸ Who want to know if things could be easier ▸ Project leaders ▸ Who want to know what’s possible
4. TASTY NEOS RECIPES FOR EVERY DAY - INTRODUCTION AGENDA ▸ A look into the past ▸ Improvements ▸ New recipes ▸ ??? ▸ Become a Neos chef
5. A LOOK INTO THE PAST
6. TASTY NEOS RECIPES FOR EVERY DAY - A LOOK INTO THE PAST ▸ Talk fi rst held at Inspiring Con 2015 by Aske Ertmann ▸ Check it out here ▸ https://speakerdeck.com/aertmann/tasty-recipes-for-every- day-neos ▸ or here goo.gl/A2WCiU ▸ Some recipes have are outdated — most are still great!
7. TASTY NEOS RECIPES FOR EVERY DAY - A LOOK INTO THE PAST GREAT RECIPES IN THE OLD SLIDES ▸ Automatically optimize images and process them faster ▸ Automatic deployment ▸ Customizable 404 pages ▸ Multi-Site techniques ▸ E-Mail Spam protection ▸ Adjust css and js for editors ▸ And many more!
8. TASTY NEOS RECIPES FOR EVERY DAY - A LOOK INTO THE PAST NEOS & FLOW DOCUMENTATION ▸ Was not always helpful ▸ Has much improved! ▸ Good examples ▸ Often used sentence: „With Neos you can do a lot with a few lines of code“ — „ fi nding them is the hard part“
9. IMPROVEMENTS
10. TASTY NEOS RECIPES FOR EVERY DAY - IMPROVEMENTS PERSISTENT CACHES ▸ Easier to con fi gure since Flow 3.0 ▸ Are kept even when fl ushing all caches # Caches.yaml # Flow 3.0+ Flow_Session_Storage: persistent: TRUE Flow_Session_MetaData: persistent: TRUE # Flow 2.0-2.3 (only works with Surf deployment – not flow:cache:flush command) Flow_Session_Storage: backendOptions: cacheDirectory: '%FLOW_PATH_DATA%Session/Flow_Session_Storage' Flow_Session_MetaData: backendOptions: cacheDirectory: '%FLOW_PATH_DATA%Session/Flow_Session_MetaData'
11. TASTY NEOS RECIPES FOR EVERY DAY - IMPROVEMENTS PERSISTENT CACHE - EXAMPLES ▸ Keep session data ▸ Store dynamic con fi gurations ▸ Fallback cache for fl aky API endpoints $result = $this->queryApi($endpointUrl); $fallbackCacheKey = $this->getCacheKey($endpointUrl); if ($result !== false) { $this->fallbackApiCache->set($fallbackCacheKey, $result); } else { $this->systemLogger->log( 'API connection failed - will use fallback cache', LOG_WARNING, 1458644107 ); $result = $this->fallbackApiCache->get($fallbackCacheKey); } return $result;
12. TASTY NEOS RECIPES FOR EVERY DAY - IMPROVEMENTS SEO ▸ Use the Neos package typo3/neos-seo ▸ Provides additional con fi guration for every page ▸ Alternative page title ▸ Meta tags (description, keywords, robots) ▸ Twitter card ▸ OpenGraph ▸ Canonical Link ▸ XML Sitemap
13. NEW RECIPES
14. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES GOOGLE ANALYTICS ▸ Use the Neos package 
 typo3/neos-googleanalytics ▸ View page statistics in the backend ▸ Tracking script helper
15. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES HELP EDITORS WITH BACKEND HINTS ▸ Hints only shown in edit mode <f:if condition="{neos:rendering.inEditMode()}"> <f:then> <p class="backend-editor-hint"> Please select the start point of your blog in the inspector. </p> </f:then> <f:else> <p>No blog entries found.</p> </f:else> </f:if>
16. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES HELP EDITORS UNDERSTAND ▸ Adapt naming of content to your customers vocabulary # NodeTypes.Headline.yaml ‘Neos.NodeTypes:Headline‘: ui: label: 'Leadtext' # NodeTypes.NewsArticle.yaml ‘Foo.Bar:NewsArticle‘: ui: label: 'Blogpost'
17. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES HELP EDITORS TO NOT GET LOST ▸ Disable unused features # NodeTypes.ContentImageMixin.yaml 'TYPO3.Neos.NodeTypes:ContentImageMixin': superTypes: 'TYPO3.Neos.NodeTypes:ImageAlignmentMixin': false # NodeTypes.Document.yaml 'TYPO3.Neos:Document': superTypes: 'TYPO3.Neos.Seo:TwitterCardMixin': true 'TYPO3.Neos.Seo:OpenGraphMixin': false
18. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES HELP EDITORS TO NOT MAKE MISTAKES ▸ Constraints, constraints, constraints ▸ Limiting possibilities reduces mistakes ▸ Part of your content architecture # NodeTypes.Document.yaml 'TYPO3.Neos:Document': constraints: nodeTypes: 'Foo.Bar:RootPage': false # NodeTypes.Column.yaml 'TYPO3.Neos.NodeTypes:Column': childNodes: column0: constraints: &columnConstraints nodeTypes: '*': true 'TYPO3.Neos.NodeTypes:Column': false column1: constraints: *columnConstraints column2: constraints: *columnConstraints column3: constraints: *columnConstraints
19. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES DISABLE SESSION TIMEOUT WHILE DEVELOPING ▸ Logging in 20 times a day is a waste of time # Development/Settings.yaml TYPO3: Flow: security: session: inactivityTimeout: 0
20. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES COMPRESS HTML ▸ Use the Neos package fl ownative/neos-compressor ▸ Removes whitespace, line endings, etc…
21. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES ENABLE FLUID AUTOCOMPLETION PT. 1 ▸ Modify template ▸ Also helps PHPStorm to validate your html # Templates/NodeTypes/Text.html <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xmlns:f="http://typo3.org/ns/TYPO3/Fluid/ViewHelpers" xmlns:neos=„http://typo3.org/ns/TYPO3/Neos/ViewHelpers"> <f:section name="Main"> <div{attributes -> f:format.raw()}> <neos:contentElement.editable property="text"/> <f:if condition="{referenceNodes}"> <ol class="reference-links"> {referenceNodes -> f:format.raw()} </ol> </f:if> </div> </f:section> </html>
22. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES ENABLE FLUID AUTOCOMPLETION PT. 2 ▸ De fi ne „sectionName“ in TypoScript prototype # TypoScript/NodeTypes/Text.ts2 prototype(TYPO3.Neos.NodeTypes:Text) { templatePath = 'resource://Foo.Bar/Private/Templates/NodeTypes/Text.html' sectionName = 'Main' @context.referenceNodesArray = ${q(node).property('references')} referenceNodes = TYPO3.TypoScript:Collection { collection = ${referenceNodesArray} itemRenderer = Foo.Bar:DocumentReference itemName = 'node' } }
23. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES ENABLE FLUID AUTOCOMPLETION PT. 3 ▸ Generate schemas for your own view helpers ▸ Include them in PHPStorm ▸ Press alt+enter while schema url in template is selected # bash ./flow documentation:generatexsd --phpNamespace "Foo\Bar\ViewHelpers" http://neos.readthedocs.org/en/2.1/ExtendingNeos/CustomViewHelpers.html
24. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES USE TYPOSCRIPT2 PROTOYPES ▸ Inheritable & extendable modules # TypoScript/NodeTypes/Example.ts2 prototype(Foo.Bar:Example) < prototype(Neos.NodeTypes:Text) { attributes.class = 'color-love' } prototype(Foo.Bar:Example) { attributes.class = 'color-rainbow' } prototype(Foo.Bar:Column) { prototype(Foo.Bar:Example) { attributes.class = 'color-peace' } }
25. TASTY NEOS RECIPES FOR EVERY DAY - NEW RECIPES CACHE EVERYTHING ▸ mode = ‚uncached‘ is usually not necessary # TypoScript/NodeTypes/MyPlugin.ts2 prototype(Foo.Bar:MyPlugin) < prototype(TYPO3.Neos:Plugin) { @cache { mode = 'cached' entryIdentifier { node = ${node} } entryTags { 1 = ${'Node_' + node.identifier} } } } prototype(TYPO3.TypoScript:GlobalCacheIdentifiers) { currentPage = ${request.arguments.page} } http://neos.readthedocs.org/en/2.1/CreatingASite/ContentCache.html
26. SUPER SECRET BONUS RECIPE
27. TASTY NEOS RECIPES FOR EVERY DAY - SUPER SECRET BONUS RECIPE MAKE SCREENCASTS ▸ Proof your features work ▸ Measure the length of the work fl ow ▸ Optimize ▸ Find bugs / inconsistencies ▸ Reduces support ▸ More fun than writing documentation
28. TASTY NEOS RECIPES FOR EVERY DAY - SUPER SECRET BONUS RECIPE MAKE SCREENCASTS - EXAMPLE WORKFLOW ▸ Go to a quiet room ▸ Use a headset ▸ Don’t think too much about it ▸ Use simple screen casting app like Voila (or similar) ▸ Make fi rst video ▸ Improve ▸ Make second video ▸ Export to dropbox ▸ Autoupload to Vimeo ▸ Share in private space with client / team
29. BECOME A NEOS CHEF
30. TASTY NEOS RECIPES FOR EVERY DAY - BECOME A NEOS CHEF LEARN FROM OTHERS ▸ Join us slack.neos.io ▸ Discuss on discuss.neos.io ▸ Don’t be afraid to ask questions ▸ Stay up-to-date on what’s going on ▸ Read the changelogs
31. TASTY NEOS RECIPES FOR EVERY DAY - BECOME A NEOS CHEF IT’S OPEN SOURCE ▸ Search ▸ Fork ▸ Learn ▸ Improve ▸ Give back ▸ Come up with new recipes
32. TASTY NEOS RECIPES FOR EVERY DAY - BECOME A NEOS CHEF NEOS IS MAKING THINGS EASY ▸ TypoScript 2 means con fi gurability and reusability ▸ Prototypes are powerful ▸ Many things can be easily toggled ▸ Don’t build complicated templates ▸ Build small reusable partials and prototypes ▸ Make it easy for others to use your recipes
33. ANY QUESTIONS? THANKS!
34. @SEBOBO FEEL FREE TO CONTACT ME