JSFiddle - React, Tailwind, and code Playground

by molecule

HTML

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

JavaScript

Ext.define('MyApp.view.EditWindowBase', {
    extend: 'Ext.window.Window',
    layout: 'fit',
    autShow: true,
    initComponent: function() {
        this.items = [
            {
                xtype: 'form',
                items: this.fields,
            }
        ];
        this.buttons = [
            { text: 'OK' },
            { text: 'Cancel' }
        ];          
        this.callParent(arguments);
    }
});
Ext.define('MyApp.view.EditStudent', {
    extend: 'MyApp.view.EditWindowBase',
    title: 'Edit Student',
    fields: [
        {xtype: 'textfield', name: 'name',        fieldLabel: 'Name'},
        {xtype: 'textfield', name: 'description', fieldLabel: 'Description'}

    ]   
});
Ext.define('MyApp.view.EditTeacher', {
    extend: 'MyApp.view.EditWindowBase',
    title: 'Edit Student',
    fields: [
        {xtype: 'textfield', name: 'name',        fieldLabel: 'Name'},
        {xtype: 'textfield', name: 'description', fieldLabel: 'Description'},
        {xtype: 'textfield', name: 'school', fieldLabel: 'School Name'},
        {xtype: 'textfield', name: 'salary', fieldLabel: 'Salary'}

    ]   
});
Ext.create("MyApp.view.EditStudent").show();

setTimeout(function(){
    
Ext.create("MyApp.view.EditTeacher").show();
}, 3000);