JSFiddle - React, Tailwind, and code Playground

by basmaat

HTML

<link rel="stylesheet" href="http://dev.sencha.com/deploy/ext-4.0.2a/resources/css/ext-all-gray.css">
<h1> Hello world </>

JavaScript

Photo: Ext.regModel('Photo', {
    fields:[
        {name:'id'},
        {name:'title'},
    ]
}),
        
        
        
onlineStore: new Ext.data.Store({
    model: 'Photo',
    proxy: {
        type: 'scripttag',
        url: 'http://query.yahooapis.com/v1/public/yql?format=json&q=' +
            escape(
                'select * from flickr.photos.search where text="hello" limit 10'
            ),
        reader: new Ext.data.JsonReader({
            root: 'query.results.photo'
        })
    }
}),

Ext.define('User', {
    extend: 'Ext.data.Model',
    fields: [ 'name', 'email', 'phone' ]
});

var userStore = Ext.create('Ext.data.Store', {
    model: 'User',
    data: [
        { name: 'Lisa', email: '[email protected]', phone: '555-111-1224' },
        { name: 'Bart', email: '[email protected]', phone: '555-222-1234' },
        { name: 'Homer', email: '[email protected]', phone: '555-222-1244' },
        { name: 'Marge', email: '[email protected]', phone: '555-222-1254' }
    ]
});
        
Ext.create('Ext.grid.Panel', {
    renderTo: Ext.getBody(),
    store: userStore,
    width: 400,
    height: 200,
    title: 'Application Users',
    columns: [
        {
            text: 'Name',
            width: 100,
            sortable: false,
            hideable: false,
            dataIndex: 'name'
        },
        {
            text: 'Email Address',
            width: 150,
            dataIndex: 'email',
            hidden: true
        },
        {
            text: 'Phone Number',
            flex: 1,
            dataIndex: 'phone'
        }
    ]
});