Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

Getting Started with Ext JS Open Tooling in React and Angular Apps

370 vues

Publié le

Learn how to use our newly released Open Tooling for Ext JS (ExtGen and ExtBuild) with your React and Angular applications (as ExtReactGen and ExtAngularGen).

See how easy it is to integrate our fully supported component library into your React or Angular apps, as well as:
- What ExtReact and ExtAngular is, and how it relates to Ext JS components, theming environment and layout system
- Discover where everything lives (git, npm, etc.)

Publié dans : Logiciels
  • Soyez le premier à commenter

Getting Started with Ext JS Open Tooling in React and Angular Apps

  1. 1. Sencha ©2018 Getting Started with Ext JS Open Tooling in Your React & Angular Apps Marc Gusmano marc.gusmano@sencha.com
  2. 2. Sencha ©2018 Webinar intro Learn how to use our newly released Open Tooling for Ext JS (ExtGen and ExtBuild) with your React and Angular applications (as ExtReactGen and ExtAngularGen). You will see how easy it is to integrate our fully supported component library into your React or Angular apps, as well as: • What ExtReact and ExtAngular is, and how it relates to Ext JS components, theming environment and layout system • Discover where everything lives (git, npm, etc.) • See a live demonstration Getting Started with Ext JS Open Tooling in Your React & Angular Apps
  3. 3. Sencha ©2018 Ext JS 6.6 – Review of Key Highlights ● Ext JS npm packages ● New Open Tooling - ExtGen, ExtBuild ● New modern components ● New beautiful Graphite theme ● Localization support for modern apps ● Dynamic Material Theme Styling ● Advanced Ext JS routing ● Enhanced gauges components Most Comprehensive JavaScript Framework now with Open Tooling
  4. 4. Sencha ©2018 Ext JS 6.6 npm Packages ● Ext JS Framework, components and themes available as npm Packages ● Better manage versioning with npm based dependency management ● Sencha hosted private npm repository to give you access to latest releases ● Automated activations to easily convert from trial to production framework Better Maintainable Apps with Dependency Management Theme Packages Premium Packages Core Packages Classic Toolkit Modern Toolkit
  5. 5. Sencha ©2018 Ext JS 6.6 Open Tooling - ExtGen ● Generate your first app with just one command ● Use any of four new app templates to create desktop, mobile or cross-platform apps ● Interactive mode to guide you through application creation mode ● Watch immediately changes to code in live running app Generate your first app within minutes
  6. 6. Sencha ©2018 A version of ext-gen for each framework ● ext-gen ● Ext JS Framework applications (Ext JS 6.6 and Ext JS CE) ● https://github.com/sencha/ext-gen ● ext-react-gen ● React Framework applications (React 16x) ● https://github.com/sencha/ext-react ● ext-angular-gen ● Angular Framework applications (Angular 7x) ● https://github.com/sencha/ext-angular
  7. 7. Sencha ©2018 ext-gen – login and install ● npm login --registry=https://npm.sencha.com/ --scope=@sencha ● npm install -g @sencha/ext-gen ● npm install -g @sencha/ext-react-gen (install for ext-angular-gen will be discussed soon…)
  8. 8. Sencha ©2018 Running ext-gen Shorthand: ext
  9. 9. Sencha ©2018 ext-gen --help
  10. 10. Sencha ©2018 ExtGen sample application
  11. 11. Sencha ©2018 Running ext-react-gen Shorthand: xrg
  12. 12. Sencha ©2018 ext-react-gen --help
  13. 13. Sencha ©2018 ExtReact sample application
  14. 14. Sencha ©2018 ext-angular-gen – early-adopter npm Shorthand: xng ● npm login --registry=https://sencha.myget.org/F/early-adopter/npm/ --scope=@sencha ● npm install -g @sencha/ext-angular-gen (contact Sencha Sales for an ID and password for early adopter access)
  15. 15. Sencha ©2018 Running ext-angular-gen Shorthand: xrg
  16. 16. Sencha ©2018 ExtAngular sample application
  17. 17. Sencha ©2018 • 115+ UI Components • Themer • Cmd • Ext JS component bridges • Typescript transpiler • Webpack: Build ExtAngular
  18. 18. Sencha ©2018 Questions? Marc Gusmano marc.gusmano@sencha.com https://www.sencha.com/products/extjs/evaluate/
  19. 19. Sencha ©2018 Thank You! Blog https://www.sencha.com/blog/ Free Trials – All Products https://www.sencha.com/products/evaluate/ Ext JS 6.6 with Open Tooling Free Trial https://www.sencha.com/products/extjs/evaluate/opentooling/ Support Portal https://www.sencha.com/support/

×