Ext JS Application Development Blueprints

Ext JS Application Development Blueprints

by Colin Ramsay
Released April 2015
Publisher(s): Packt Publishing
ISBN: 9781784395308

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Develop robust and maintainable projects that exceed client expectations using Ext JS

In Detail

Ext JS is a pure JavaScript application framework for building interactive web applications. It delivers the most advanced charting and graphing capabilities of any JavaScript framework without relying on plugins, thus delivering pixel-perfect visuals on any browser on any operating system.

Ext JS Application Development Blueprints discusses ideas and tools such as MVVM, Sencha Cmd, testing, and debugging. Along the way, you will understand the importance of decision-making, flexibility, and constant reassessment of the design and code in order to provide a strong foundation for a successful product.

The writing style of this book lends itself to both quickly skimming sections and diving deep into the technology at hand. By combining the best practices with the wealth of knowledge available across the 11 chapters of this book, you'll soon be architecting successful applications for your team and clients.

What You Will Learn

  • Simplify your code by understanding how to use Ext JS view models and data binding
  • Build basic applications with the MVVM architecture
  • Architect advanced Ext JS applications based on a set of requirements
  • Understand code reuse techniques in Ext JS by identifying code that can be extracted to library classes
  • Learn advanced Ext JS topics such as responsive design and sessions in Ext JS
  • Work with testing, debugging, and performance tools to ensure that the final product is robust
  • Discover an integrated approach to building software, in which the design, tools, and code are equally important to a successful final product

Table of contents

  1. Ext JS Application Development Blueprints
    1. Table of Contents
    2. Ext JS Application Development Blueprints
    3. Credits
    4. About the Author
    5. About the Reviewers
    6. www.PacktPub.com
      1. Support files, eBooks, discount offers, and more
        1. Why subscribe?
        2. Free access for Packt account holders
    7. Preface
      1. What this book covers
      2. What you need for this book
      3. Who this book is for
      4. Conventions
      5. Reader feedback
      6. Customer support
        1. Downloading the example code
        2. Errata
        3. Piracy
        4. Questions
    8. 1. Introduction
      1. Humble beginnings
        1. Growing up
        2. The shoulders of giants
      2. What is application architecture?
        1. Requirement analysis
        2. Data design
        3. Code design
        4. Technology evaluation
        5. Code standards and practices
        6. Documentation
      3. Ext JS
        1. The world that was
        2. State of the art
        3. Mostly very cool
        4. Supporting cast
      4. Getting ready
        1. The specification
        2. A good match
        3. How we work
      5. In safe hands
        1. If you build it, they will come
        2. Managing your time
        3. You can buy fashion, but you can't buy style
      6. Summary
    9. 2. MVC and MVVM
      1. Diary of always
      2. Bringing MVC to the Web
      3. Ext JS and MVC
        1. Examples of Ext JS MVC
      4. How does it help your application
      5. MVC and the illusion of choice
      6. Introducing MVVM
        1. How does Ext JS use MVVM?
        2. Getting our MVVM started
        3. Are we better off?
        4. A brief interlude regarding stores
        5. Inter-communication
        6. The main event
        7. Event domains
      7. An event domain example
        1. Using custom events
      8. Summary
    10. 3. Application Structure
      1. Ideas for structure
      2. Getting to know your application
        1. /overrides
        2. /.sencha
        3. bootstrap.js, bootstrap.json, and bootstrap.css
        4. /packages
        5. /resources and SASS
        6. index.html
        7. /build and build.xml
        8. app.js
        9. app.json
      3. Cultivating your code
        1. I'm a lumberjack – let's go log in
        2. Money can't buy class
          1. Singletons
        3. Mixins
      4. The solution to pollution
        1. A global solution to a local problem
      5. Summary – mind your own beeswax
    11. 4. Sencha Cmd
      1. What is Sencha Cmd?
      2. Why is it important?
        1. The act of creation
      3. Setting up your application
      4. The generation game
      5. Develop in style
        1. Here to serve – a website
        2. The Bootstrap process
      6. Care for the environment
        1. The final product
      7. Before the build
      8. Code complete
        1. An application for Ant
        2. Version numbers
        3. From release to production
      9. The best of the rest
        1. Packages
        2. Themes
        3. Compilations
      10. Summary
    12. 5. Practical – a CMS Application
      1. A content-managed system
      2. The requirements
        1. Accepting the challenge
      3. Starting at the bottom
      4. Work your way up
        1. The devil is in the detail
      5. Where the wild things are
        1. Spiky and hairy
      6. The real deal
        1. A short interlude on data binding
      7. Creating a structure
      8. Data-driven design
        1. A model store
      9. A room with a view
        1. The tree panel and searching
        2. Pages in detail
        3. The magical page view model
        4. This data is now in session
        5. The glue controlling all
          1. Selecting a page
          2. Adding a page
          3. Deleting a page
          4. Saving a page
      10. Summary
    13. 6. Practical – Monitoring Dashboard
      1. Application design
      2. Requirements
        1. Message received and understood
      3. Data structure
        1. Live charts
        2. Historical logs
        3. Log statistics
        4. Model behavior
      4. The view from the top
      5. Flexibility and pragmatism
      6. Does this hurt?
      7. Onwards and upwards
      8. Data first
      9. Storing the data
      10. With a view to a controller
      11. The main view controller
        1. Rootin-Tootin
        2. Back to business
        3. Route to nowhere
      12. The dashboard
        1. Constant evaluation
      13. The dashboard view model
      14. The dashboard view controller
      15. Web logs subpage
      16. A view on the Web
      17. Controlling the Web
      18. More and more subpages
      19. Summary
    14. 7. Practical – an E-mail Client
      1. Form factors
      2. Application design
      3. I require to admire
        1. Technically speaking
      4. Responding to the situation
      5. Input required
      6. A view to a thrill
        1. Mainly harmless
        2. Full steam ahead
        3. Threading our way
        4. Send me a message
        5. Stay composed
        6. Design overview
      7. Application state
        1. Home screen/initial load
        2. New thread
        3. Show thread
        4. New message/reply
        5. Routing overview
      8. A binding agreement
      9. An eventful application
        1. Events and you
      10. Coding – it's been a long time
      11. It's under control
      12. Login view
      13. Main force
        1. Main ViewModel
        2. Main ViewController
      14. The head of the family
        1. Header ViewModel
        2. Header ViewController
      15. Unravel the thread
        1. Thread ViewModel
        2. Thread ViewController
      16. I am the best message
        1. Messages ViewModel
        2. Messages ViewController
      17. A composed finish
      18. Deciding on a theme
      19. Summary
    15. 8. Practical – Questionnaire Component
      1. Application design – my way
      2. Data structure
        1. Consider carefully
      3. Data flow
        1. A binding trick
        2. A difference of opinion
        3. A means to an end
      4. Sketchy sketching
      5. Get set
      6. The data layer
      7. The payload
      8. The wizard component
        1. Do it yourself
        2. Wizardly tools
      9. One step forward
      10. Making progress
      11. Step by step
      12. Questionnaire command and control
      13. The wizard model
      14. A delightful host
      15. Mixin the night away
      16. Summary
    16. 9. A Shopping Application
      1. About the app
        1. The product window
        2. The shopping cart
        3. Login and registration
        4. User account
        5. Design overview
      2. Back to Ext JS
      3. The data layer
        1. Information contemplation
      4. Component interaction
        1. In control
      5. The simplicity of view models
      6. Code, code, and more code
        1. What's in store?
      7. Interface in your face
        1. One step ahead
        2. Under the main control
      8. Categorically speaking
      9. Product placement
      10. A basket case
      11. The account window
      12. Summary
    17. 10. Debugging and Performance
      1. In-browser debugging
        1. Stepping in
        2. Breaking point
        3. Black box and cut to the chase
      2. Breaking and busting
        1. Caught in the act
      3. Performance in Ext JS
        1. Network performance
          1. Make fewer requests
          2. Perceived performance
          3. Load less
          4. Optimistic updating
      4. Quick on the draw
        1. Overuse of panels
        2. Overnesting
        3. Deferred rendering
      5. Analyzing performance
      6. Summary
    18. 11. Application Testing
      1. Total testing
        1. Unit testing
        2. Assert yourself
        3. Integration testing
          1. Integration and differentiation
      2. Testing tool time with Jasmine
        1. Jasmine – installation and configuration
        2. Make it happen
      3. Testing with robots
        1. Up and running with CasperJS
      4. Testability
        1. Should I or shouldn't I?
      5. Faking it with mocks
      6. Continuous coverage
      7. Summary
    19. Index

Product information

  • Title: Ext JS Application Development Blueprints
  • Author(s): Colin Ramsay
  • Release date: April 2015
  • Publisher(s): Packt Publishing
  • ISBN: 9781784395308