Sencha Ext JS 7.7 is Here – Discover What’s New and Exciting – LEARN MORE

https://staging.sencha.com/blog/video-series-build-an-ext-js-application-using-modern-toolkit-part-2/
Table of Contents Hide
  1. What Are Dynamic UIs?
  2. What Are JS Frameworks’ Fundamentals For Dynamic UIs?
  3. How Do You Build Dynamic UIs with JavaScript Frameworks?
  4. What Are the Best Practices for Performance Optimization?
  5. JS Frameworks: Conclusion
  6. JS Frameworks: FAQs
  7. What’s your reaction?
  8. What Are Dynamic UIs?
  9. What Are JS Frameworks’ Fundamentals For Dynamic UIs?
  10. How Do You Build Dynamic UIs with JavaScript Frameworks?
  11. What Are the Best Practices for Performance Optimization?
  12. JS Frameworks: Conclusion
  13. JS Frameworks: FAQs
  14. What’s your reaction?

Video Series: Build an Ext JS Application Using Modern Toolkit – Part 2

October 23, 2018 1 Views
I am happy to share with you the second part of my video series describing the process of creating an application from scratch using the Modern Toolkit. In these episodes we will continue developing an application handling data about all matches played at FIFA World Cups. We will enhance the look and feel of a Grid component in the application and add new ones such as List, Pivot Grid and Charts. You will also learn how to aggregate and load data in a store based on data from another store, and define the architecture of an application targeting different devices. Here are five more episodes - as a reminder you can view episodes 1-5 here or on our YouTube channel:

Episode 6: List Component

In this episode we add a List component to display data about FIFA matches in a phone version of our application.

Episode 7: Advanced Grid Features

In this episode we enhance our Grid component: insert HTML code into Grid cells, aggregate values from different fields in one cell, bind CSS class to a row based on the field values, add RowNumberer column.

Episode 8: Improving List Component

In this episode we enhance our List Component: extend the template corresponding to a listed item, and add CSS styles to DOM elements used in the template.

Episode 9: Pivot Grid Component

In this episode we add a Pivot Grid component to our application to aggregate and analyze data about FIFA matches: find countries that won and lost the biggest number of games at FIFA World Cups. We calculate flat data about matches based on the data from the original dataset, load this data into the Pivot Grid component and discuss its configuration properties: matrix, left axes, top axes and aggregate.

Episode 10: Chart Component

In this episode we add a Chart Component to our application to visualize count of wins and losses at FIFA World Cups for every country. We calculate aggregated data, load it to the Chart Component and discuss its configuration properties: type, axes and series.
Here is the source code for the application that we are building: https://github.com/olga-petrova/FifaAppPart2 Stay tuned, more episodes are coming soon!

New to Ext JS?

We encourage you to view our interactive examples, check out our full resource library including additional videos, whitepapers and more, and download a free 30-day trial of Ext JS with open tooling.

Leave a Reply

Your email address will not be published. Required fields are marked *

Table of Contents Hide
  1. What Are Dynamic UIs?
  2. What Are JS Frameworks’ Fundamentals For Dynamic UIs?
  3. How Do You Build Dynamic UIs with JavaScript Frameworks?
  4. What Are the Best Practices for Performance Optimization?
  5. JS Frameworks: Conclusion
  6. JS Frameworks: FAQs
  7. What’s your reaction?
  8. What Are Dynamic UIs?
  9. What Are JS Frameworks’ Fundamentals For Dynamic UIs?
  10. How Do You Build Dynamic UIs with JavaScript Frameworks?
  11. What Are the Best Practices for Performance Optimization?
  12. JS Frameworks: Conclusion
  13. JS Frameworks: FAQs
  14. What’s your reaction?
Ready to get started?

Create an account now!

Latest Content
Highlights of Virtual JS Days 2024

Highlights of Virtual JS Days 2024 From February 20-22, 2024, we held the third Virtual…

From the GM’s Desk 2023: An Exciting Year for Sencha & Ext JS 7.7

We are past the midpoint of 2023 and we are very proud of what we…

Sencha MVP Spotlight: Animap - The Historical Research Tool with Andy Allord

Welcome to our Developer Spotlight Series, where we showcase the remarkable talents and achievements of…

See More

Leave a Reply

Your email address will not be published. Required fields are marked *

coming soon

Something Awesome Is

COMING SOON!