decade of expertise in modern web technology Leaders in driving modern web applications with JavaScript and CSS Market leading JavaScript frameworks ! Background Facts Founded in 2007 Headquarters in Redwood City, CA More than 100 employees across 8 countries Funded by Sequoia Capital, Jafco Ventures, Radar Partners ! Customer Facts 60%+ of the Fortune 100 as customers More than 10,000 enterprise customers Worldwide developer community more than 2M strong Billions of dollars transacted or supported by Sencha-based applications every day !
Developer Time and Productivity Profitability Right Experience on the Right Screen Customer Satisfaction Differentiation Compelling Value Today’s Challenges Web Application Priorities
devices, tablets and the desktop Improve web application control and analysis while maintaining user flexibility and increasing IT/Business collaboration Deploy & Manage Design visually compelling web applications using pre-built and pre-tested components Improve design process through tools that make it faster and easier to mockup, style, prototype, and evaluate interface designs! Design Accelerate application development by utilizing an enterprise-ready framework Improve development efficiency by developing once for multiple platforms and devices Develop Why Sencha
Application Lifecycle Management $ $$ $$$ $$$$ Design & Develop Deploy & Manage Single platform for mobile, tablets and desktop lowers cost Comprehensive solution lowers risk and improves productivity Accelerates time to market by reducing development cycles
Develop SDK | Test | Tools Sencha Architect Sencha Architect Visual application builder for Sencha’s JavaScript SDKs Build the UI and code fully featured applications directly in Architect Theme designer Connect to backends easily Best practices generated code Teams can create their own templates, or use existing ones Support for custom user extensions Design Prototype | Theme
Deploy | Analyze Develop SDK | Test | Tools Design Prototype | Theme A better way to build business apps Modern app framework Robust user interface library Thousands of documented APIs Rich data package Class-based architecture The industry’s most powerful app development framework Deliver solutions to the most platforms and browsers More than 150 user interface components, all designed to work together Complete set of components for building apps
Deploy | Analyze Develop SDK | Test | Tools Design Prototype | Theme 2007 2009 2011 2014 Ext JS 2.0 Ext JS 3.0 Ext JS 4.0 Ext JS 5.0 Rich Internet Apps using JavaScript Robust user documentation APIs and samples REST support Ext.Direct server-side support Charts and graphs ListView Declarative class system MVC architecture Animation and drawing Two-way data binding MVVM architecture Tablet and touch screen support Routing
Secure | Deploy | Analyze Develop SDK | Test | Tools Design Prototype | Theme Safari 6+ Firefox IE 8+ Chrome Opera 12+ Safari on iOS 6+ Chrome on Android 4.1+ IE 10+ on Windows 8 Deliver apps on the widest selection of browsers and operating systems with a single code base. Ext JS leverages HTML5 features on modern browsers while maintaining compatibility for legacy browsers.
framework Write applications once, in JavaScript, and leverage HTML5 capabilities on devices Themes for each platform Smooth scrolling and animations Multi-touch gestures and adaptive layouts Deploy applications inside of Sencha Space for a consistent, rich, secure runtime environment across all platforms and devices Android 2.3+ Windows Phone 8 Tizen BlackBerry 10 iOS 4+ Manage Secure | Deploy | Analyze Develop SDK | Test | Tools Design Prototype | Theme
| Analyze Develop SDK | Test | Tools Design Prototype | Theme 2 3 Code in Java using Google Web Toolkit (GWT) Native GWT solution with no external JavaScript or third-party libraries High performance, customizable UI widgets Well designed, consistent and fully documented source Built-in support for RPC, RequestFactory, and JSON Compiles to optimized HTML and JavaScript Sencha GXT - Examples http://www.sencha.com/examples
| Analyze Develop SDK | Test | Tools Design Prototype | Theme 2 4 Out of the box code completion and refactoring capabilities Makes use of the powerful cross-compiler in GWT to deliver optimized builds for each browser Robust data APIs Big data grids Cross platform browser compatibility Plugin-free charting
need in one box - User Interface components, data layer, layout manager You’re not maintaining your own set of components Components are designed to work together, plus they look and function in a consistent manner Code is modular, making it more reusable Plenty of documentation and examples Development can be focused on your application logic rather than the framework that supports it Cross-platform development Large developer community, professional documentation, trained partners worldwide Manage Secure | Deploy | Analyze Develop SDK | Test | Tools Design Prototype | Theme
| Analyze Develop SDK | Test | Tools Design Prototype | Theme Eliminate native packaging and multiple codebases Deliver HTML5 apps directly to end-users through a managed, secure runtime platform Helps protect your apps and data by Securing your application’s codebase Managing user access Remotely wiping your data from devices (mobile/desktop) as needed Encrypting and segregating your business data from other data on the device Leverage developer APIs for a rich application experience Easily manage and deploy web and HTML5 apps across mobile and desktop
| Analyze Develop SDK | Test | Tools Design Prototype | Theme Eliminate native packaging and multiple codebases Deliver HTML5 apps directly to end-users through a managed, secure runtime platform Helps protect your apps and data by Securing your application’s codebase Managing user access Remotely wiping your data from devices (mobile/desktop) as needed Encrypting and segregating your business data from other data on the device Leverage developer APIs for a rich application experience Easily manage and deploy web and HTML5 apps across mobile and desktop
| Analyze Develop SDK | Test | Tools Design Prototype | Theme 1) Develop your apps with Sencha Space API Features 2) Deploy your apps in Sencha Space 3) Manage your application via the Space Admin Panel 4) Auto distribute to various Sencha Space Clients (Desktop & Mobiles)
| Analyze Develop SDK | Test | Tools Design Prototype | Theme The review process of various app stores can take a lot of time! Sencha Space can deliver directly to all end users. Eliminate native packaging.
| Deploy | Analyze Develop SDK | Test | Tools Design Prototype | Theme 3 3 Provides centralized management of the user, data, and application lifecycles Improves efficiency of cross-platform application development, testing, maintenance and deployment Allows administrators to enforce policy consistently Set PIN strength Set user session length Block users and devices Deploy applications by user group Captures user, device (mobile/desktop), and application analytics
Secure | Deploy | Analyze Develop SDK | Test | Tools Design Prototype | Theme Manages and secures use of HTML5 apps on mobile and tablet devices, and across Windows and Mac on the desktop Desktop client supports multiple windows and multiple tabs Enforces policies from central management console Modern browser engine (Chromium) on the desktop for more performant apps Provides developer API to OS/Device features for rich, modern user experience
If you use Angular JS, you’ll need to adopt a selection of other libraries alongside it to match the basic capabilities that Sencha would otherwise offer in one solution
If you use Angular JS, you’ll need to adopt a selection of other libraries alongside it to match the basic capabilities that Sencha would otherwise offer in one solution This adds extra complexity throughout the whole development lifecycle: • To be effective, developers need to know the ins and outs of all these other libraries • What happens when a new version of one library is released? Will a new version work with all the other pieces? • When used together, there is no common architecture or coding style, so apps can quickly become spaghetti-like if not maintained and managed properly
If you use Angular JS, you’ll need to adopt a selection of other libraries alongside it to match the basic capabilities that Sencha would otherwise offer in one solution This adds extra complexity throughout the whole development lifecycle: • You often get overlaps or duplication of some functionality between libraries • You will likely end up with an app that doesn’t promote code reuse. It will be more of a declarative approach as opposed to a class-based approach • Who do you contact if there is an urgent issue that needs resolving? Most of these libraries are open source so have no formal, structured, support offerings
If you use Angular JS, you’ll need to adopt a selection of other libraries alongside it to match the basic capabilities that Sencha would otherwise offer in one solution This adds extra complexity throughout the whole development lifecycle: • You effectively end up building and maintaining your own framework, as you are managing how all of these libraries coexist and behave together • Performance problems can sometimes occur if not implemented properly, due to the amount of libraries and resources being used by the application
Kendo UI Kendo UI can provide a good set of UI components that work on top of Angular JS, however in its documentation, Telerik cautions developers about the cross-over and duplication in some functionality and features: Kendo UI can be used seamlessly with Angular JS. The two frameworks have some overlapping features though… “ ” Telerik documentation docs.telerik.com/kendo-ui/AngularJS/introduction
Kendo UI And when you rely on libraries from different providers, compatibility issues can occur when new versions of a library are released, as this post on Telerik’s forums illustrates: Question: Response from Telerik: We are using kendo grid (version Q2 2014) with angular js (version 1.3 - used for my current project). Kendo grid is rendering the data properly but we are having issues in fetching the selected table row index and its associated data using k-on-change event… Source: telerik.com/forums/kendo-grid-with-angularjs-issue …most probably you are hitting this breaking change which was introduced in Angular 1.2.24: https://github.com/angular/angular.js/issues/9220. Because of it, if you try to access `selected` in a template, for example to pass it as argument to a function, you'll get that security error… My recommendation is to stay on Angular < 1.2.24 for the current version of Kendo. We're in the process of switching to 1.3 for the next version…
saying Angular JS may be great for websites and for the prototyping of apps, but can’t really scale well when needing to build enterprise-class business applications: Angular creates a good “wow-effect”, when you see it for the first time… but as soon as you have to implement a real application, but not another TODO-list, then it all becomes very frustrating. “ ” Egor Koshelko medium.com/@mnemon1ck Angular.js is "good enough" for majority of projects, but it is not good enough for professional web app development. When I say "professional web app" I mean the app, which is maintainable in a long run, performant in all reasonably modern browsers, has a smooth UX and is mobile-friendly. “ ” Alexey Migutsky fse.guru/2-years-with-angular Another developer writes:
saying Our goal with Angular 2 is to make the best possible set of tools for building web apps not constrained by maintaining backwards compatibility with existing APIs. “ ” Igor Minar, Angular JS team at Google angularjs.blogspot.com Backwards compatibility is also going to be an issue with Angular JS 2, due to the rewrite: So, if longevity of applications is important to you, Angular JS may not be a good choice: • Internet Explorer 8 is no longer supported by Angular JS, even though this is still (unfortunately) a widely used web browser in many enterprises today. Google’s main interests lie with Google Chrome. • Version 2 of Angular JS is not going to be backwards compatible with version 1. Applications have to be re-written.
other UI libraries Companies like Netflix make use of Angular JS on their consumer facing website, but for line of business apps you need a stable structure and rich set of components that is able to cope with displaying large datasets in an efficient manner, without impairing performance. For example: Ext JS includes a grid that buffers its rendering of data to the DOM. This means that out of a dataset of 100,000 records, about 30 – 40 rows may be rendered to the grid at a time, to optimize performance. As the user scrolls down, new rows are dynamically added, and old ones removed. Bootstrap UI is just HTML, so all data will be rendered to the DOM. This means that out of a dataset of 100,000 records, the entire dataset gets rendered to the page. This can severely impact performance, especially when there are other heavy components on the page. +
is around search and advertising related technologies, not application frameworks Majority of revenue comes from its AdWords technology If you need help with products like Angular JS, you have to use a third-party company or community forums like Stack Overflow Sencha’s core business is to offer the frameworks and tools that enable enterprise developers to produce and maintain business applications Founded in 2007. Around 120 employees globally, the large majority of which are core engineers, support, professional services and training
jQuery UI Backbone Bootstrap Interface Elements Basic Widgets x x x Compound Widgets x x Visualizations x Containers & Windows x x x Themes x x x Styles x x x View System Layout Manager x x Interactions x x x Drawing x Templating x x x Visual Effects x x x x Localization x x x x Accessibility x x x Logic & Data State Manager x x x x Data Binding x x x Modularity x x x Testing x x x Data Objects x x Data Models & Stores x x x Server i/o Server Calls/XHR x x x x Server Method Invocation x Sockets x Sencha | Comparison To Micro Frameworks
approach Embrace of open standards Continued support of IE8 in Ext JS as a first class browser High performance data package High performance, fully featured grids Wide swathe of community extensions and plugins available Common architecture across all components and classes No duplication of functionality Everything works the same way Patch and minor releases whose code has undergone system testing as a whole Single coding style Technical support, large developer community, professional documentation, trained partners worldwide
mix libraries? No common architecture Duplication of functionality Subtly different functionality Uncoordinated release cycles Varying source code styles Assemble as you go What happens when you mix and match libraries?
Management tools and capabilities for building desktop and mobile apps that run on every browser (including legacy) and every device used by the enterprise. THE SENCHA PLATFORM Web Application Life Cycle Management!
support Touch screen support Tablets and touch screen laptops Touch-based gestures and momentum scrolling Minimal effort to make existing apps touch-compatible
A lightweight component that can be created at minimal cost Can be used in Grids where multiple instances of components may need to be shown in each column’s cells
New touch-enabled charting package, Sencha Charts Separate Kitchen Sink for showcasing all the new Chart components Two charting packages initially, to help with application upgrades
binding Two-way data binding Live synchronization between Views and Models Computed values and fields Save time and reduce errors through less custom code
Translates your app’s URL into Controller Actions and Methods Support for multiple routes using a single URI Enables deep linking and browser history support
Clipboard plugin Can be used in conjunction with the spreadsheet selection model Enables copy/paste of data to and from external applications Use keyboard commands to perform copy/paste
Sencha Ext JS evolves to power UI: • Pivot Grid, Power Grid • Calendar, Gantt • Charts & Visualization • Geo Mapping • App Templates Sencha Ext JS apps will work on: • Every Browser (Modern & Legacy) • Every Platform (Operating Systems) • Every Device (Desktops, Tablets, Smart Phones)
to embrace IDEs via plugins:! • IntelliJ! • Eclipse! • Visual Studio! ! CMD UI to interface with IDEs:! • IDE plugin integrations! • SDK specific functionalities! • Sencha Space integration! ! Test Sencha apps with Siesta:! • Web based testing tool! • Perform testing on the DOM! • Simulate user interactions! • Record and generate UI test scripts! • Generates code coverage reports! • Can be automated using Selenium or PhantomJS!
Santa Clara Convention Center: April 7-9, 2015 Theme: Design, Develop, Deploy Exposure to hundreds of HTML5 and JavaScript developers from leading enterprises across the world
maintenance service available to commercial license holders, provides access to software patches and updates Technical advice for all stages of application development process, from design through to deployment Support plans provide: Free upgrade to next major release Access to Premium Forums Early access to custom bug fixes Access to online ticketing system Performance tuning Remote troubleshooting
of all experience levels Helps with overcoming learning curve Delivered onsite, public, and online Fast Track to Ext JS Fast Track to Sencha GXT Fast Track to Sencha Touch and Sencha Architect Fast Track to Ext JS and Sencha Architect Ext JS 5 Update and Migration from Ext JS 4
Apr 20th – May 1st: Fast Track to Ext JS 5 and Sencha Architect (Online Course) May 27th – May 29th: Essential Ext JS 5 Training (Zurich, Switzerland) June 8nd – June 12th: Essential Ext JS 5 Training (Amsterdam, The Netherlands)
Professional Services team stands ready to provide you and your team with hands-on expert assistance in the use of Sencha frameworks and tools Enterprise mentoring and architectural planning Embedded development expertise Code review and best practices knowledge transfer Custom application and component development
savelee
cscengineer
kenta_hi
y150saya
oracle4engineer
fullkaiten
chanyou0311
nealle
kozotaira
yurufuwahealer
tamaiyutaro
masayoshimaezawa
oprstchn
addyosmani
akihiro_kokubo
keithpitt
jonoalderson
takai
davidcarrasco
inesmontani
codingconduct
eileencodes
sergeychernyshev
