Steps to create a simple form and window in ExtJS4

simpleFormPanelExtJS4.js

 

//OnReady Ext function
      Ext.onReady(function(){
        
        //Creating a namespace
        Ext.ns("Test");

        Ext.define("Test.InformationsFormPanel",
          {
            title: 'Hello Sencha',
            height: 285,
            width: 250,
            layout: 'fit',
            //alias -- it is necessary to put widget, when we will call on xtype it not more necessary to put widget
            alias: ['widget.informationsformpanel'],
            //Our TestPanel is a form Panel by inheritance
            extend: 'Ext.form.Panel',
            //To configure our methods inside this Context: Test
            //automatically accessor methods are generated
            config: {
              
            },
            //items in your panel
            items: {
            },
            //It is executed when the widget is instantied 
            //To set up your configs, apply our configs
            constructor: function(cfg){
              this.initConfig(cfg);
              this.callParent();
            },

            /*
            The initComponent template method is an important initialization step for a Component.

            The initComponent method must contain a call to callParent in order to ensure that the parent class' initComponent method is also called.

            Look the items and create these componentes
            */
            initComponent: function(){
              this.callParent();
           }
      });

    });