Learning Ext JS - Fourth Edition

Learning Ext JS - Fourth Edition

by Carlos A. Méndez, Crysfel Villa, Armando Gonzalez
Released July 2015
Publisher(s): Packt Publishing
ISBN: 9781784394387

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

Create powerful web applications with the new and improved Ext JS 5 library

In Detail

The new Sencha Ext JS 5 library offers hundreds of components and APIs to build robust applications and fulfills the critical needs of customers all around the world. The new version 5 is packed with new themes and the MVVM architecture that allows you to connect the model layer to the view and automatically update the model when the view is modified and vice versa.

This book covers many new features and components of Ext JS 5. At the beginning, learn the core concepts of Sencha Ext JS, components, data models, and mapping. This book also teaches you about event-driven development, forms and grids, charts and themes, and third-party plugins. Later on in the book, you'll learn the implementations of the Tree panel, the MVC pattern, and a completely new feature called MVVM. By working sequentially through each chapter and following the step-by-step guides, you will be able to create a basic application.

What You Will Learn

  • Create applications with powerful web components designed for an easy end user experience
  • Discover how Ext JS works and how to make good use of this tool
  • Understand the basics of web applications using Ext JS
  • Use the new features of version 5 in your applications
  • Build agile and responsive web applications using Ext JS
  • Understand the MVVM application model to connect the model layer to the view
  • Easily customize sizing, spacing, colors, fonts, and so on in the new touch-friendly themes

Table of contents

  1. Learning Ext JS Fourth Edition
    1. Table of Contents
    2. Learning Ext JS Fourth Edition
    3. Credits
    4. About the Authors
    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. An Introduction to Ext JS 5
      1. Considering Ext JS for your next project
      2. Getting started with Ext JS
        1. Downloading Ext JS
        2. Setting up and installing Ext JS 5
          1. Sencha Cmd
        3. Why so many files and folders?
          1. Folders that changed in version 5 from previous versions
        4. Looking at the whole picture
      3. Our first program
        1. Writing the Ext JS code
        2. Adding interaction to the program
      4. Tools and editors
        1. XAMPP or WAMP
        2. Aptana
        3. Sencha Architect
      5. What's new in Ext JS 5?
      6. Summary
    9. 2. The Core Concepts
      1. The class system
        1. Naming conventions
        2. Writing your first class
        3. Simple inheritance
        4. Preprocessors and postprocessors
        5. Mixing many classes (the use of mixins)
          1. An explanation of mixins
          2. Using the mixinConfig property
        6. Configurations
        7. Statics methods and properties
          1. Explanation
        8. The Singleton class
        9. Aliases
      2. Loading classes on demand
        1. Enabling the loader
      3. Working with the DOM
        1. Getting elements
        2. Query – how do we find them?
        3. DOM manipulation – how do we change it?
      4. Summary
    10. 3. Components and Layouts
      1. The component life cycle
        1. The initialization phase
        2. The rendering phase
        3. The destruction phase
        4. The lifecycle in action
      2. About containers
        1. Types of containers
        2. The viewport
        3. The panel
          1. Panels versus containers
        4. The Window component
      3. The layout system
        1. The Border layout
        2. The Fit layout
        3. The Card layout
        4. The Accordion layout
        5. The Anchor layout
      4. More layouts
      5. Comments about using layouts
      6. Summary
    11. 4. It's All about the Data
      1. Ajax
        1. Passing parameters to Ajax request
        2. Setting timeout to Ajax request calls
      2. Models
        1. Mappings
        2. Validators
        3. Custom field types
        4. Relationships
          1. One-to-many associations
          2. One-to-one associations
      3. Working with the store
        1. Adding new elements
        2. Looping through the records/models in the store
        3. Retrieving the records in the store
          1. By index position
          2. First and last records
          3. By range
          4. By ID
        4. Removing records
      4. Retrieving remote data
        1. Ajax proxy
        2. Readers
          1. XML reader
      5. Sending data
      6. Summary
    12. 5. Buttons and Toolbars
      1. Event-driven development
      2. Creating a simple button
        1. Setting icons on buttons
        2. Icon alignment on buttons
        3. Handling button events
      3. Segmented buttons
      4. Adding menus
      5. Toolbars
        1. Toolbar button groups
      6. The breadcrumb bar
        1. Handling selections in the breadcrumb bar
      7. The main menu for our application
      8. Summary
    13. 6. Doing It with Forms
      1. The form component
        1. The anatomy of the fields
      2. The available fields
        1. The TextField class
        2. The number field
        3. The ComboBox field
        4. The Tag field
        5. The Date field
        6. The Checkbox and the CheckboxGroup fields
        7. The Radio and RadioGroup buttons
      3. The field container
      4. Triggers
      5. Submitting the data
      6. Summary
    14. 7. Give Me the Grid
      1. The data connection (models and stores)
      2. A basic grid
      3. Columns
        1. The column row number
        2. The number column
        3. The template column
        4. The date column
        5. The Boolean column
        6. The check column
        7. The action column
      4. Column renderers
      5. The Widget column
      6. Selection models
      7. Grid listeners
      8. Features
        1. Ext.grid.feature.Grouping
        2. Ext.grid.feature.GroupingSummary
        3. Ext.grid.feature.RowBody
        4. Ext.grid.feature.Summary
      9. Plugins
        1. Ext.grid.plugin.CellEditing
        2. Ext.grid.plugin.RowEditing
      10. Grid paging
      11. Infinite scrolling
      12. Summary
    15. 8. DataViews and Templates
      1. The data connection (model and store)
      2. A basic DataView
      3. Handling events in DataView
      4. Templates
        1. Ext.Template
        2. Ext.XTemplate
      5. A more complex DataView component
      6. Summary
    16. 9. The Tree Panel
      1. A basic tree panel
      2. The TreeStore
      3. Tree nodes
      4. Adding and removing nodes
      5. The check tree
      6. The tree grid panel
      7. Summary
    17. 10. Architecture
      1. The MVC and MVVM patterns
        1. Model-View-Controller (MVC)
        2. Model-View-ViewModel (MVVM)
      2. Creating our first application
        1. The views
        2. The controller
          1. Listening to events
          2. Opening modules
      3. Creating a module
        1. ViewController
        2. ViewModel
        3. Binding and data binding
      4. Router – implementing and using
      5. Summary
    18. 11. The Look and Feel
      1. Setting up our environment
      2. The packages folder
      3. Variables
      4. Advanced theming
        1. Changing the component's style
        2. Adding new gradients
        3. Styling the tabs
        4. Adding custom fonts to our theme
      5. Different styles for the same component
      6. Supporting legacy browsers
      7. Summary
    19. 12. Responsive Configurations and Tablet Support
      1. Overview
        1. New themes
        2. Neptune touch and Crisp touch
      2. Implementing responsiveness to the application
        1. Creating responsiveness
        2. Investigating the output
        3. Checking all panels
      3. Summary
    20. 13. From Drawing to Charting
      1. Basic drawing
      2. Adding interaction
      3. Charts
        1. Legend
        2. Axis
        3. Series
        4. Themes
      4. Series examples
        1. Bar charts (building our first chart)
        2. Pie charts
      5. More charts
      6. Introducing chart themes
      7. Enhancing our application with charts
      8. Summary
    21. 14. Finishing the Application
      1. Preparing for deployment
        1. The app.json file
      2. The Sencha command
        1. Customizing the build.xml file
        2. Compressing the code
        3. Packaging and deploying
      3. Testing the application
      4. Summary
    22. 15. What's Next?
      1. Forums
      2. Resources
      3. Third-party plugins (commercial)
      4. Third-party plugins (free)
      5. The future
      6. Final thoughts
      7. Summary
    23. Index

Product information

  • Title: Learning Ext JS - Fourth Edition
  • Author(s): Carlos A. Méndez, Crysfel Villa, Armando Gonzalez
  • Release date: July 2015
  • Publisher(s): Packt Publishing
  • ISBN: 9781784394387