Writing while learning, so it won't be the best reference you could find out there.
ExtJS is a javascript framework that includes everything you would probably need to have a working webapp out of the box (routing,state management, etc)
Namespace
The first line of each Class is an address of sorts. This "address" is called a namespace. The formula for the full namespace is:
<AppName>.<foldername>.<ClassAndFileName>
You can find your app namespace in "/app.js"
In your sample app, "MyApp" is the AppName, "view" is the folder name, "main"
is the sub-folder name and "Main" is the Class and Filename. Based on that information, the
framework looks for a file called Main.js in the following location:
// Classic
classic/src/view/main/Main.js
// Modern
modern/src/view/main/Main.js
// Core
// "MyApp.view.main.MainController" shared between toolkits would be located at:
app/view/main/MainController.js
Let's start
Ext.Viewport.add({
xtype: 'panel',
html: 'Hello World!'
});
- Adding an object to the Viewport
- ..with 2 properties
- xtype : type of component we are creating (panel,button,grid,etc.)
- html : the content of the component
Stores
Ext JS stores are the things that house all of your data records. Stores are powerful for data processing.They can easily sort, filter, and query the data stored in them.