1. Single Page Applictions in DrupalChris Tankersleyphp[world] 2014

2. 2Who Am I? A PHP Developer for 10 Years Drupal Dev for 4 years Lots of projects no one uses, and a few somedo https://github.com/dragonmantank 3. 3What is a Single Page Application? An application that loads in a single page 4. 4What is a Single Page Application?1)Loads all the necessary HTML, JS, and CSSneeded in a single page load2)Loads all the necessary HTML, JS, and CSSneeded to bootstrap an application in a singlepage load 5. 5Traditional Application FlowBrowser ServerUser requests a pageServer returns page1)Server gets request2)Server calls PHP3)PHP builds the HTMLUser requests a pageServer returns page1)Server gets request2)Server calls PHP3)PHP builds the HTML 6. 6This is heavy 7. 7No, it's really heavy 8. 8Single Page Application FlowBrowser ServerUser requests a pageServer returns page1)Server gets request2)Server returns base HTMLBrowser requests dataServer returns page1)Server gets request2)Server calls PHP3)PHP builds the JSONBrowser requests dataServer returns page1)Server gets request2)Server calls PHP3)PHP builds the JSONBrowser requests dataServer returns page1)Server gets request2)Server calls PHP3)PHP builds the JSON 9. 9SPAs Are Great! Reduce server load More responsive Separates server and front-end Make the front end people do all the work 10. 10SPA ALL THE THINGS! 11. 11 12. 12It's not all great Users have to have JS enabled SEO SUUUUUUUUUUCKS This will probably break navigation This will probably break your analytics Your host may not support it 13. 13Drupal 7 Doesn't Support SPAs 14. 14Or Does It...? 15. 15It Doesn't Out of the Box 16. 16Why do you want a Single Page Application? 17. 17Create an SPA If... You want a more desktop-app-likeexperience A lot of data coming and going You want/have a good API backend The interface lends itself to being a SPA 18. 18Gmail Makes Sensehttp://mashable.com/2014/03/31/email-wrong/ 19. 19My Blog Doesn't 20. 20Don't create an SPA if... You want to reduce page refreshes It sounds cool 21. 21Only create a SPA if it makes sense 22. 22Parts of a Single Page Application 23. 23The knee bone is connected to ... Controllers Chunks and Templates Routing Data Data Transport 24. 24Controllershttp://en.wikipedia.org/wiki/Game_controller 25. 25The Logic of our Application 26. 26Chunks and Templates 27. 27Routing 28. 28Data 29. 29Data Transport AJAX AJAJ AJAH 30. 30Sample SPA ApplicationDEMO TIME! 31. 31Picking a Javascript Framework 32. 32Backbone 33. 33EmberJS 34. 34AngularJS 35. 35Getting Drupal 7 to work with Single PageApplications 36. 36The Services Module 37. 37What does it do?A standardized solution of integrating externalapplications with Drupal. Service callbacks maybe used with multiple interfaces like REST,XMLRPC, JSON, JSON-RPC, SOAP, AMF, etc.This allows a Drupal site to provide webservices via multiple interfaces while using thesame callback code. 38. 38Services does a lot of heavy lifting for you 39. 39DEMO TIME! 40. 40Getting it into your Drupal Site 41. 41Use an .html file Really easy to do Doesn't impact your existing site 42. 42Add it to a template file Start small 43. 43Just make a small module Gives you more control 44. 44Questions? 45. 45Thanks! https://joind.in/11865 @dragonmantank chris@ctankersley.com