Accelerating the Design and Development of Data-Centric Apps using Sencha Tools By Gautam Argawal

Learn how you can accelerate the design and development of complex data-centric applications using Sencha tools including Stencils, Cmd, Architect, and Themer. We’ll demonstrate how you can design an Ext JS 6 application using Stencils, build it using Architect, and then theme it using our new Themer tool.

Transcript

1. © 2016 Sencha Inc
   Accelerating the Design and Development
   of Data-Centric Apps using Sencha Tools
   Gautam Agrawal
   Sr. Director, Product Management
   

   View Slide

2. © 2016 Sencha Inc
   Sencha Tools Goals
   • Enterprise Workflow Integration – integrate with enterprise development
   environments to provide a seamless development experience while building
   applications with Sencha SDK
   • Development Efficiency –improve developer productivity, development
   experience and minimize errors during development.
   

   View Slide

3. © 2016 Sencha Inc
   Sencha Tools
   • Sencha Cmd
   • IDE Plugins
   - Eclipse
   - Visual Studio
   - JetBrains
   • Architect
   • Themer
   • Inspector
   • Stencils
   

   View Slide

4. © 2016 Sencha Inc
   Demo
   Architect 4.0
   4
   

   View Slide

5. © 2016 Sencha Inc
   Sencha Cmd
   • Project Scaffolding
   • Code Minification & Build Generation
   • Application Tuning & Optimization
   • Image Spriting for Legacy Browsers
   • Native Packaging
   • Theme Compiler – Fashion
   

   View Slide

6. © 2016 Sencha Inc
   Sencha IDE Plugins
   • Project Creation
   • Class Template
   • Code Completion
   • Code Generation
   • Code Navigation
   • Code Inspection
   • Code Refactoring
   • Documentation Lookup
   • Sencha Cmd Integration
   

   View Slide

7. © 2016 Sencha Inc
   Sencha IDE Plugins – Supported IDEs
   IntelliJ Mars Enterprise
   WebStorm Luna Professional
   PHPStorm Ultimate
   RubyMine Community
   PyCharm
   

   View Slide

8. © 2016 Sencha Inc
   Sencha Inspector
   • Inspect Component Tree
   • Inspect Data Stores
   • Inspect Layouts
   • Inspect Events
   • Inspect MVC/MVVM
   • Inspect & Modify Theme
   • Remote Debugging for Mobile
   

   View Slide

9. © 2016 Sencha Inc
   Sencha Architect
   • Drag-n-drop visual app builder
   • Best practices code generator that
   minimizes manual coding
   • Supports custom user extensions
   • Integrates Cordova for hybrid apps
   • Support for Themer; import custom
   themes
   

   View Slide

10. © 2016 Sencha Inc
    Sencha Themer
    • Design themes in an interactive visual
    environment - no code
    • Quick configurations for global theme
    variables that cascade across all Ext
    JS components
    • Support for component Uis
    • View live style update to your Ext JS
    app – No compile, build, reload
    • Package your theme, apply to your
    app and share with ease
    10
    Supports Ext JS 6.0, 6.2 Modern
    and Classic Toolkit
    

    View Slide

11. © 2016 Sencha Inc
    Ext JS Stencils
    • Design your app using Ext JS 6 Modern
    and Classic component symbols
    • Import symbol library in most popular
    design tools
    - Adobe Illustrator
    - Sketch
    - Omnigraffle
    - Balsamique
    - Also provided as SVG/PNG assets
    

    View Slide

12. © 2016 Sencha Inc
    Q & A
    12
    

    View Slide