首先要做的是為使用者資訊建立一個模型，在Scripts\app\model目錄下建立一個名為User.js的檔案，然後添加以下模型定義代碼：
Membership提供者中的字段很多，在這裡隻使用了使用者編号、使用者名、電子郵件、角色、建立日期、最後登入時間和是否禁用等7個字段。這隻是一個示例，并不一定要按照這樣去做，具體可根據自己需要修改。在字段定義中，可看到，很多字段都設定了defaultValue配置項，它的作用是在建立使用者的時候，會使用該配置項的值作為預設值。這是ExtJS 4新添加的模型的功能，相當實用。
模型定義好以後，就要定義了Store了。Store除了要定義使用者的外，因為要設定使用者角色，是以還要定義使用者角色的Store。先來定義使用者的Store，因為全部操作是在Grid内完成的，因而直接使用api配置項功能定義好清單、添加、删除和編輯的位址，就可簡單的實作這些功能的送出操作了，相當的友善。其它要注意的地方好定義好reader的格式，以及writer的格式。在Scripts\app\store\目錄下建立Users.js檔案，并在檔案内添加如下代碼：
代碼中，設定了batchActions配置項為true，表示不實作批量操作，而是每當執行一個操作就送出資料。配置項autoLoad表示自動去加載資料，不需要手動去加載了。
在proxy中的api配置項，為4個操作固定好了送出位址，送出的都是Users控制器的方法。在render配置項中，固定了傳回資料的格式，資料都必須在data關鍵字内，也就是root配置項定義的值，這個可根據自己的習慣定義。而錯誤資訊則在Msg關鍵字内。而在writer中，encode設定為true的作用就是使用習慣的送出方式送出資料，而不是以JSON流的方式送出，這個具體在筆者的書中有講述。配置項root的與reader的作用是一樣的，表示資料可通過讀取data關鍵字擷取。而配置項allowSingle的作用是送出的資料是否一個個送出，在這裡設定為false，表示不允許一個個送出，也就是所有修改過的資料都會一次送出，在data關鍵字内可取到。
接着為角色定義Store，在這裡為了簡單起見，就不從伺服器擷取角色資料了，直接定義在Store裡了。在Scripts\app\store\目錄下建立Roles.js檔案，并在檔案内添加如下代碼：
現在要為使用者管理編寫控制器，在Scripts\app\controller目錄下建立Users.js檔案，并添加控制器的基本定義：
好了，現在要考慮控制器需要什麼了，因為它的視圖需要用到使用者模型和使用者及角色的Store，因而需要添加models配置項和stores配置項，代碼如下：
視圖也是必不可少的，因而添加以下代碼：
這裡要注意視圖類的名稱結構，代碼中使用了Users.View表示建立視圖時，要在\Scripts\app\view目錄下建立Users目錄，然後在建立View.js檔案。這個可根據自己需要建立，例如不想建立目錄，那麼視圖的名稱就直接使用UsersView。當項目小的時候，檔案不多，這樣命名沒有任何問題，但是如果是大項目，檔案很多，就要注意同名檔案問題，因而習慣使用目錄區分視圖是好的方法，是一個好的習慣。
因為要在主面闆的标簽頁面闆内添加視圖，因而需要引用标簽頁面闆，因而要加入refs配置項，代碼如下：
代碼中，ref配置項會生成引用的方法，例如目前代碼，可通過getUserPanel擷取面闆。而selector配置項就是面闆的選擇器了，在這裡使用它的id選擇。
現在，要考慮怎麼加載這個控制器了，并将視圖添加到面闆了。在定義控制器時，都有1個init方法，在這裡可以執行一些初始化操作，因而可在這裡将視圖添加到面闆，将init方法内的代碼修改如下：
代碼調用的getUserPanel方法，就是refs配置項定義中自動生成的方法，通過該方法擷取面闆後，将建立的使用者視圖通過add方法添加到面闆就行了。
現在切換到主面闆控制器MainPanel.js，在使用者管理的activate事件中，删除alert語句，調用getController方法加載控制器并調用控制器的init方法就行了，代碼如下：
現在，建立視圖，在Scripts\app\view目錄下先建立目錄Users，然後在該目錄下建立View.js。要使用Grid顯示使用者資訊，因而要從Grid面闆派生出視圖。定義的時候要注意視圖的類名。還有就是一定要定義别名，因為在控制器中是使用widget方法建立的視圖執行個體。如果不想定義别名，那就要修改建立執行個體的方式。具體的基本定義代碼如下：
代碼中的id可根據需要定義，在這裡是不管有沒有用，先定義。如果項目類太多，要注意避免id沖突。标題定義可有可無，因為是在标簽頁内，看自己需要。
Grid需要Store，因而先添加store配置項，使用的Store是Users，因而定義代碼如下：
列的定義，可以直接使用配置項定義，也可以在initComponent方法内定義，具體看情況，例如目前例子，要為列添加編輯元件，因而在initComponent方法内定義比較合适，代碼如下：
現在定義都是一些基礎代碼，還沒定義編輯元件，這樣有個好處，先調試好顯示，再進入下一階段，可以減少錯誤。在最後一個字段，使用了擴充CheckColumn，因而要在Ext包中将CheckColumn.js檔案複制到Ext\ux目錄下，并添加requires配置項，代碼如下：
接着要在頂部工具欄添加一個分頁工具條，代碼如下：
這裡設定了每頁顯示的記錄數為50條記錄，可根據自己情況做調整。
最後要在底部工具欄添加一段說明文字，代碼如下：
F5運作即可看到
現在還沒有資料，而且我們添加的bbar緊貼在了Grid下面，說明了标簽頁的布局有點小問題，那就在VS中切換到主面闆視圖（MainPanel.js），在添加使用者管理面闆的地方加入以
下代碼：
再重新整理一下頁面
現在，在伺服器端建立Users控制器，為Grid提供資料。在Controllers目錄建立一個名稱為UsersController的控制器。加入必要的引用後，将Index方法修改為List方法，傳回結果為JObject，代碼如下：
同時要在MyFunction中添加相應的方法，代碼如下：
現在再來運作一下，然後用admin登入後可檢視到
資料就這樣出來了哦。