ExtJS 5.1 - Base

Fiddle that includes all the cache fly libraries (external references) to load the ExtJS 5.1 framework using the neptune theme.

by DSoa

HTML

<script src="https://extjs.cachefly.net/ext/gpl/5.1.0/build/ext-all-debug.js"></script>
<script src="https://extjs.cachefly.net/ext/gpl/5.1.0/packages/ext-theme-neptune/build/ext-theme-neptune.js"></script>
<link rel="stylesheet" href="https://extjs.cachefly.net/ext/gpl/5.1.0/packages/ext-theme-neptune/build/resources/ext-theme-neptune-all-debug.css">
<script src="https://extjs.cachefly.net/ext/gpl/5.1.0/packages/sencha-charts/build/sencha-charts-debug.js"></script>
<link rel="stylesheet" href="https://extjs.cachefly.net/ext/gpl/5.1.0/packages/sencha-charts/build/neptune/resources/sencha-charts-all-debug.css">

JavaScript

Ext.onReady(function () {
    Ext.define('Foo', {
        extend: 'Ext.data.Model',
        fields: ['foo']
    });
    Ext.define('FooStore', {
    	extend: 'Ext.data.Store',
        model: 'Foo',
        data: [
               /*
            { foo: 'foo1' },
            { foo: 'foo2' }
            */
        ]		
    });
    var fooStore = Ext.create('FooStore', {});
    
    Ext.create('Ext.panel.Panel', {
        renderTo: Ext.getBody(),
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        items: [
            {
                xtype: 'grid',
                title: 'Foo Grid',
                store: fooStore,
                layout: 'auto',
                //height: 200,
                viewConfig: {
                	emptyText: 'No foos found',
                	deferEmptyText: false
                },
                columns: [
                    { text: 'Foo', dataIndex: 'foo', flex: 1 }
                ]
            }
        ]
    });
});