component code writing CQ.Ext or ExtJS ?

I am trying to write a custom component something like 

Ext.require([ 'Ext.form.field.File', 'Ext.form.Panel', 'Ext.window.MessageBox' ]); Ext.onReady(function(){ var msg = function(title, msg) { Ext.Msg.show({ title: title, msg: msg, minWidth: 200, modal: true, icon: Ext.Msg.INFO, buttons: Ext.Msg.OK }); }; Ext.create('Ext.form.Panel', { renderTo: 'fi-form', width: 500, frame: true, title: 'File Upload Form', bodyPadding: '10 10 0', defaults: { anchor: '100%', allowBlank: false, msgTarget: 'side', labelWidth: 50 }, items: [{ xtype: 'textfield', fieldLabel: 'Name' },{ xtype: 'filefield', id: 'form-file', emptyText: 'Select an image', fieldLabel: 'Photo', name: 'photo-path', buttonText: '', buttonConfig: { iconCls: 'upload-icon' } }], buttons: [{ text: 'Save', handler: function(){ var form = this.up('form').getForm(); if(form.isValid()){ msg('Success'); } } },{ text: 'Reset', handler: function() { this.up('form').getForm().reset(); } }] }); });

How could I write this in CQ js file.

Do I need to import EXTJS library files ? or Can I do using CQ.EXT ?

Thank you,

Sri