ExtJS 5 Introduction

8796fd43a3429bc3893c39e8b3376813?s=47 noroot
August 16, 2014

ExtJS 5 Introduction

ExtJS 5 Introduction for Gorky Ruby user Group

8796fd43a3429bc3893c39e8b3376813?s=128

noroot

August 16, 2014
Tweet

Transcript

  1. ExtJS 5 javascript UI framework

  2. What is ExtJS ? - Full featured client* Javascript framework

    - Become Industry standard - 60% of Fortune 100 uses it - Supports ALL browsers ?
  3. History of ExtJS

  4. Core concepts Core concepts

  5. Accessibility AIRA ( http://www.w3.org/WAI/intro/aria ) Section 508 ( http://www.section508.gov/ )

  6. Class system Dot notation (“.”) MyApp.util.Base64 MyApp.util.Base64 => /MyApp/util/Base64.js

  7. Components

  8. Data package

  9. Data package: Examples Associations: https://gist.github.com/noroot/7764926571bd466fc400 Validation: https://gist.github.com/noroot/212d8b8251bcdac0d27b

  10. Drag and Drop

  11. Events Event Normalization for touch devices

  12. Layouts and containers

  13. Localization Json storage for strings Supports RTL (Right to left

    languages)
  14. Memory management Memory leaks

  15. Theming

  16. Drawing library

  17. Application structure MVVM (M+VC) based application Sencha CMD (console based

    framework management tool) sencha generate app -ext MyApp ./app cd app sencha app watch
  18. Application structure ViewControllers Models Storages (or Stores) Routes

  19. ViewController

  20. ViewModel ViewModel example: https://gist.github.com/noroot/f094258eaa80e26a5ae3

  21. Routes

  22. Store AJAX REST LocalStorage JSON

  23. Store JSON example

  24. Application development order 1) Describe Layout and components 2) Define

    Models structure 3) Define Storages for models 4) Define Models bindings for models structure 5) Define behaviors for components and models
  25. MVVM MVVM - Model-View-ViewModel

  26. Examples Dashboard http://dev.sencha.com/ext/5.0.1/examples/index.html REST Grid: http://dev.sencha.com/ext/5.0.1/examples/restful/restful.html Organizer: http://dev.sencha.com/ext/5.0.1/examples/organizer/organizer.html Themes: http://dev.sencha.com/ext/5.0.1/examples/themes/index.html

    WebDesktop: http://dev.sencha.com/ext/5.0.1/examples/desktop/index.html Executive Dashboard: http://dev.sencha.com/ext/5.0.1/examples/executive- dashboard/index.html#!kpi/clicks Trees: http://dev.sencha.com/ext/5.0.1/examples/tree/locking-treegrid.html Soap: http://docs.sencha.com/extjs/5.0/enterprise/soap.html
  27. Communities and collaboration Official site http://www.sencha.com/ Market: https://market.sencha.com/ Seek for

    answers: http://www.sencha.com/forum/index.php Lack of russian community
  28. Credits Dmitriy Rodichev twitter: @noroot github.com/noroot Enterprise is fine, people

    are fucked.