Book Image

Ext JS 4 First Look

By : Loiane Groner
Book Image

Ext JS 4 First Look

By: Loiane Groner

Overview of this book

<p>Ext JS 4 is a JavaScript framework that provides resources to build Rich Internet Applications with great performance. Ext JS 4 has been packed with many new features and it is difficult to master, even for seasoned experts in Ext JS 3.<br /><br />Ext JS 4 First Look teaches you the main functional areas of Ext JS 4 that have significant new features, explains the new features and how to use them, while highlighting the differences between Ext JS 4 and the previous versions.<br /><br />This book will give you the knowledge to make the required changes to Ext JS 3 application to build a complete Ext JS 4 application.<br /><br />This book provides examples of how to load Ext JS components by demand, charts, grid, tree, forms and panels, new data model, themes and mvc architecture.<br /><br />Ext JS 4 First Look provides full examples and illustrations to help you easily learn the new features of Ext JS 4.</p>
Table of Contents (14 chapters)

Migrating/creating an app using the MVC architecture


Now that we are done implementing a sample app in the old way, we will implement the same application, using the MVC architecture.

One of the benefits of using the MVC architecture is the re-use of code; you will have to learn how to create an app using MVC only once, because all the other projects will follow the same steps.

Project directory structure

First, let's see how the project's directory structure looks, when we finish implementing it:

Every project you create, using the MVC architecture, will have this same structure. So, this is how MVC projects are organized:

  • index.html: This is the HTML page of your application.

  • app.js: This is the JS file that will wrap the application code.

  • extjs sdk: We need the Ext JS SDK folder because we are implementing a project with Ext JS.

  • data folder: As we are not doing any integration with the server-side language/framework, we are loading JSON files from this folder. However, this is not a...