Help me to change into ExtJS4 with PHP and MySQL. I use my previous "ExtJS3" -> what will I need to change for example as below...

structure-files -> rootapp

--phpfile (form.php and grid.php)
--jsfile (form.js and grid.js)

-form.html
-grid.html

-----------------------------
form.php
-----------------------------

PHP Code:
<?php 
// Database Configuration 
$db_name = "extphpmysql";  
$db_host = "localhost";  
$db_username = "root"; 
$db_password = "passwd";  
 
// Database Connection 
$connection = mysql_connect($db_host, $db_username, $db_password); 
 
if(!$connection) 
{ 
    echo "{ 
        'success': false, 
        'msg': 'Could not connect to database.' 
    }"; 
} 
 
mysql_select_db($db_name); 
 
// Fetching Form Values 
$fullname = $_POST['fullname']; 
$subject = $_POST['subject']; 
$email = $_POST['email']; 
$message = $_POST['message']; 
 
// Storing data in database 
$sql = "INSERT INTO `extphpmysql`.`users` (`fullname`, `subject`, `email`, `message`)  
        VALUES ('$fullname', '$subject', '$email', '$message');"; 
         
$result = mysql_query($sql); 
 
// Generating appropriate server response 
if(!$result) 
{ 
    echo "{ 
        'success': false, 
        'msg': 'An error occured, please try again later.' 
    }"; 
} 
else 
{ 
    echo "{ 
        'success': true, 
        'msg': 'Form submission complete.' 
    }"; 
} 
 
// Closing Database Connection 
mysql_close($connection); 
?>
--------------------
grid.php
--------------------

PHP Code:
<?php 
// Database Configuration 
$db_name = "extphpmysql";  
$db_host = "localhost";  
$db_username = "root"; 
$db_password = "passwd";  
 
// Database Connection 
$connection = mysql_connect($db_host, $db_username, $db_password); 
 
if(!$connection) 
{ 
    echo "{ 
        'success': false, 
        'msg': 'Could not connect to database.' 
    }"; 
} 
 
mysql_select_db($db_name); 
 
// Fetchin data from database 
$sql = "SELECT * FROM `users`"; 
 
$result = mysql_query($sql);         
$return = array(); 
 
for ($i=0; $row = mysql_fetch_array($result); $i++)  
{ 
    $return[$i]['fullname'] = $row['fullname']; 
    $return[$i]['subject'] = $row['subject']; 
    $return[$i]['email'] = $row['email']; 
    $return[$i]['message'] = $row['message']; 
} 
 
echo json_encode($return); 
 
// Closing Database Connection 
mysql_close($connection); 
?>
---------------
form.js
---------------

HTML Code:
Ext.onReady(function(){     
                      
    Ext.QuickTips.init(); 
 
    var simple = new Ext.FormPanel 
    ({ 
        bodyStyle : "padding: 10px;", 
        buttonAlign: 'center', 
        defaults: {anchor: '100%'}, 
        defaultType: 'textfield', 
        frame : true, 
        labelAlign : "top", 
        method: 'post',         
        renderTo: document.body, 
        style: 'margin: 30px auto', 
        title: 'Form Ext JS 3 and PHP MySQl', 
        url: 'phpfile/form.php', 
        width: 300, 
        collapsible: true, 
         
        items :  
        [{     
            name : "fullname", 
            fieldLabel : "Full Name", 
            allowBlank: false 
        },{ 
            name : "subject", 
            fieldLabel : "Subject" 
        },{ 
            name : "email", 
            fieldLabel : "E-Mail", 
            vtype : "email" 
        },{ 
            xtype : "textarea", 
            name : "message", 
            fieldLabel : "Message", 
            height : 80, 
        }], 
         
        buttons: 
        [{ 
            text: 'Reset', 
            handler: function() 
            { 
                simple.getForm().reset(); 
            } 
        },{ 
            text: 'Submit', 
            handler: function() 
            { 
                simple.getForm().submit 
                ({ 
                    success: function(form, action) { 
                       Ext.Msg.alert('Success', action.result.msg); 
                    }, 
             
                    failure: function(form, action) { 
                       Ext.Msg.alert('Failure', "An error occured, please try again later."); 
                    } 
                }); 
            } 
 
        }] 
 
    }); 
     
});
---------------
grid.js
---------------

HTML Code:
Ext.onReady(function(){     
                      
    var grid = new Ext.grid.GridPanel 
    ({ 
         title: 'Grid Panel Ext JS 3 and PHP MySQl', 
        renderTo: document.body, 
        width: 600, 
        height: 300, 
        frame: true, 
        autoExpandColumn: 'message', 
        style: 'margin: 30px auto', 
         
        store: new Ext.data.JsonStore({ 
            // store configs 
            autoLoad: true, 
            url: 'phpfile/grid.php', 
             
            // reader configs 
            //root: 'feedback', 
            fields: [{name: 'name', mapping: 'fullname'}, 'email', 'subject', 'message'] 
        }), 
         
        colModel: new Ext.grid.ColumnModel({ 
            defaults: { 
                width: 120, 
                sortable: true 
            }, 
            columns: [ 
                {header: 'Name', dataIndex: 'name'}, 
                {header: 'Email', dataIndex: 'email'}, 
                {header: 'Subject', dataIndex: 'subject'}, 
                {header: 'Message', dataIndex: 'message', id: 'message'} 
            ] 
        }) 
    }) 
     
});
---------------
form.html
---------------

HTML Code:
<html> 
<head> 
    <title>Form Ext JS 3 and PHP MySql</title> 
     
    <!-- Ext JS --> 
    <link rel="stylesheet" type="text/css" href="../ext-3.4.0/resources/css/ext-all.css"/> 
    <script type="text/javascript" src="../ext-3.4.0/adapter/ext/ext-base.js"></script> 
    <script type="text/javascript" src="../ext-3.4.0/ext-all-debug.js"></script> 
     
    <!-- Custom Code -->  
    <script type="text/javascript" src="jsfile/form.js"></script> 
 
</head> 
 
<body> 
 
<a href="http://localhost/ext-php-mysql/grid.html">View inserted data</a> 
 
</body> 
</html>
--------------------
grid.html
--------------------
HTML Code:
<html> 
<head> 
    <title>Grid Panel Ext JS 3 and PHP MySql</title> 
     
    <!-- Ext JS --> 
    <link rel="stylesheet" type="text/css" href="../ext-3.4.0/resources/css/ext-all.css"/> 
    <script type="text/javascript" src="../ext-3.4.0/adapter/ext/ext-base.js"></script> 
    <script type="text/javascript" src="../ext-3.4.0/ext-all-debug.js"></script> 
     
    <!-- Custom Code -->  
    <script type="text/javascript" src="jsfile/grid.js"></script>
 
</head> 
 
<body> 
 
<a href="http://localhost/ext-php-mysql/form.html">Insert Data in this Grid</a> 
 
</body> 
</html>