As we saw in Chapter 7, Give Me the Grid, the grid needs the use of a data store in order to display contents. The DataView component works the same way. In Chapter 4, It's All about the Data, we talked about the use of data packages (models and stores). So, let's begin using the following model:

Ext.define('Myapp.model.Users',{
  extend:'Ext.data.Model', // step 1 (extend datamodel)
  idProperty:'id',
  fields:[ // step 2 (field definition)
    {name: 'id', type: 'int'},
    {name: 'firstName', type: 'string'},
    {name: 'lastName', type: 'string'},
    {name: 'twitter_account', type: 'string'},
    {name: 'active', type: 'boolean'},
    {name: 'avatar', type: 'string'}
  ]
});

In the previous code, we have our user model definition. This code goes into the model's definition folder of our application. This model will get the data through the ajax calls that are defined in the type property of the store's proxy.

The url property will be serverside/users...