JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://zvirtualscenes.googlecode.com/svn-history/r468/trunk/Plugins/HttpAPI/htdocs/sencha/touch/sencha-touch-all-compat.js"></script>
<link rel="stylesheet" href="http://extjs.cachefly.net/touch/sencha-touch-2.0.0/resources/css/sencha-touch.css">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>  
<body>
    <div id="el" style="width: 250px; height: 400px; border: 1px solid red; float: left"></div>
    
        <div id="el2" style="margin-left:40px;width: 250px; height: 400px; border: 1px solid green; float: left">Empty!</div>
</body>
</html>

JavaScript

Ext.application({
    name: 'myApp',
    launch: function() {


        var listdata = Ext.create('Ext.data.Store', {
           fields : ['title'],
           data   : [ {title: 'Alpha'}, {title: 'Bravo'},{title: 'Alpha'}, {title: 'Bravo'},{title: 'Alpha'}, {title: 'Bravo'}, {title: 'Bravo'}, {title: 'Bravo'},{title: 'Alpha'}, {title: 'Bravo'},{title: 'Alpha'}, {title: 'Bravo'}, {title: 'Bravo'}, {title: 'Bravo'},{title: 'Alpha'}, {title: 'Bravo'},{title: 'Alpha'}, {title: 'Bravo'},{title: 'Alpha'}, {title: 'Bravo'}, {title: 'Charly'} ]
        });


        var test1 = Ext.create('Ext.List', {
           title: 'Test1',
           itemTpl: '{title}',
           store: listdata
        });


        Ext.create('Ext.tab.Panel', {
            renderTo: 'el',
            height   : '100%',
            items      : [test1],                
        });
        
        var test2 = Ext.create('Ext.List', {
            // title: 'Test2',
           itemTpl: '{title}',
           store: listdata
        });


        Ext.create('Ext.tab.Panel', {
            renderTo: 'el2',
            height   : '100%',
            items      : [test2],                
        });        

    }
});