Keynote

The Sencha Platform, keynote by Art Landro, Danny McLaughlin and Lee Boonstra. Learn what's new in Ext JS 6, GXT and Sencha Space.

Transcript

2. Danny McLaughlin Vice President EMEA, Sencha
3. Welcome to SenchaDay! WIFI:  RodeHoed   Pasw:  rodehoed1987   Twi7er:  #senchacon  
4. KEYNOTE
6. Welcome to the Future of Application Development
7. “… software is eating the world” – Marc Andreessen  
8. The Web App World is Fragmented + Complex
9. And Complexity is Going to Increase Wearables Medical Automotive
10. Wearables Medical Automotive
11. Fragmentation on Steroids The Global 2000 Source:  IDG  Research,  Sep  2014   +1,000,000 8,000,000
12. The Web App World is Fragmented + Complex
13. The Sencha Platform
14. The Rising Pace of Complexity
15.         Enable enterprises to easily and seamlessly: design | develop | deploy mission critical web applications The right experience On the right screen At the right time The Sencha Mission
16. Design Prototype | Theme   Manage Secure | Deploy | Analyze Develop SDK (Ext JS / GXT) | Test | Tools Enterprise Workflow Integration IDE | Backend Connectivity | Build/CI Education & Support Implementation & Customization Services Sencha Web Application Lifecycle Management Platform
17. Danny McLaughlin & Lee Boonstra
18. What’s new in GXT
19. Touch Support GXT 4 Neptune Touch Theme Executive Dashboard App
20. GXT 4.0 •  standard widgets touch-enabled (nav tabs, button, slider, etc.) •  you can add new GestureRecognizers to any widget •  some chart types enhanced for touch also •  Test it on your tablet: gxt-dashboard.appspot.com
21. Theme Builder GUI •  Stand-alone desktop application to modify your GXT themes •  Configuration editing for many components •  Change colors and gradients
23. GXT 4.0 & Theme Builder GUI •  GXT 4.0 commercial release targeting Q3 •  End of Q2, beta for support customers
24. What’s new in Ext JS 5
25. 3D Column Charts (type bar3d)
26. Chart Events
27. Example 1 "plugins:"{" 2 """"""""ptype:"'chartitemevents'," 3 """"""""moveEvents:"true" 4 "}," 5 " 6 "series:"[{" 7 """"""""type:"'line'," 8 """"""""xField:"'month'," 9 """"""""yField:"'high'," 10 """"""""marker:"{" 11 """"""""""""radius:"4" 12 """"""""}," 13 """"""""listeners:"{" 14 """"""""""""itemclick:"function(chart,"item){"}" 15 """"""""}" 16 "}],"
28. Color Picker Component (xtype: colorfield)
29. Rating Widget (xtype: rating)
30. Spreadsheet Selection Model + clipboard plugin
31. Example 1 """"selModel":"{" 2 """"""""type:"'spreadsheet'," 3 """"""""columnSelect:"true," 4 """"""""rowSelect:"true," 5 """"""""cellSelect:"true," 6 """"""""checkboxSelect:"true," 7 """"}," 8 " 9 """"plugins:"'clipboard',"" 10 """//Ext.grid.plugin.Clipboard" "
32. Pivot Grid 1. Ext.define('MyApp.view.pivots.Basic',** 2. $$$requires:*[* 3. $$$$$$'Ext.util.Format'* 4. ***],* 5. 999extend:*'Mz.pivot.Grid',* 6. 999alias:*'widget.pivotbasic',* 7. * 8. ***aggregate:*[{* 9. *****dataIndex:*'value',* 10. ***header:*'Sum9of9value',* 11. ***aggregator:*'sum'* 12. ***},*{* 13. ******dataIndex:*'value',* 14. ******header:*'#9records',* 15. ******aggregator:*'count',* 16. ******align:*'right',* 17. ******renderer:* Ext.util.Format.numberRenderer('0')* 18. ***}],* 19. ****selType9:*'checkboxmodel',* 20. ****leftAxis:*[{* 21. ******dataIndex:**'company',* 22. ******header:*****'Company',* 23. ******sortable:***false* 24. ***},{* 25. ******dataIndex:**'year',* 26. ******header:*****'Year',* 27. ******sortable:***false* 28. ***}],* 29. ***topAxis:*[{* 30. ******width:*120,* 31. ******dataIndex:*'country* 32. ***}]* 33. });* * *
33. Accessibility Enhancements • ARIA support for screen readers (like JAWS) • keyboard navigation
34. Ext JS 5.1.1 •  We fixed many many bugs! •  ARIA support for border layouts •  keepRawData config in Reader to discard its rawData. •  Cell editors support widgets •  Lazy instantiation plugin for child items
35. Ext JS 6: Merge of the frameworks
36. Ext JS 6 •  Toolkits •  Classic (legacy views) •  Modern (modern touch views) •  Universal Apps •  1 code base, classic + modern view •  Single URL •  Ext loader will serve UI based on specified rules
37. DEMO
38. http://pages.sencha.com/Ext-JS-6-Beta-1.html Early Access Release
39. Buy Ext JS 5 now, and be ready for Ext JS 6!
40. Fashion
41. Application Theming •  Faster compilation of Sass Stylesheets •  Runs on top of JavaScript •  No Ruby
42. DEMO
43. TOOLS
44. Sencha Inspector •  Connect to any Sencha App •  Running in any browser •  Inspect the component tree •  Understands MVVM •  Record & Inspect Events •  Live edit themes
45. DEMO
46. JetBrains IDE Sencha Integration •  Any of these JetBrains Products: •  IntelliJ 14.1+ •  WebStorm 10+ •  PHPStorm 9+ •  RubyMine 7.1+
47. Plugin Features •  Code Completion •  Code Refactoring •  Code Inspecting •  Code Generation •  Add to the requires •  Package Support •  SDK Version selection •  Spell Checking
48. Download beta •  Choose Plugins •  Click: Browse Plugins •  Search: “sencha” •  Install Plugin
49. DEMO
51. Sencha Space
52. Ready for production
53. Easy deployment of apps •  Zip up your application and upload to Sencha Space via Sencha Cmd •  Secure data & source code •  Offline availability •  http://space.sencha.io/docs/developer/application_deployment.html sencha  config  -­‐prop  app.version=myapp   then  app  publish  
54. DEMO
55. Application Insights
56. Track information •  Device Specific information •  Event Capture API Ext.space.Logger.logEvent({        category:  "UserData",        action:  JSON.stringify(record.data),        label:  "",        extra:  "”   }).then(function(){          console.log("Successfully  logged");   },  function(error)  {          console.log("Error",error);   });  
57. Try out Sencha Space for free! https://manage.space.sencha.com/#register