Simple Sorting & Filtering

We've got some basic data displaying on the page, but we can't really do anything with it yet. Let's add some sorting and filtering. If you've ever coded this manually, you might be bracing yourself. But with ag-Grid, all we need to do is add parameters to our column definitions (the columnDefs array in our component state):

// App.js
columnDefs: [{
  headerName: "Make", field: "make", sortable: true, filter: true 
}, {
  headerName: "Model", field: "model", sortable: true, filter: true 
  },{
  headerName: "Price", field: "price", sortable: true, filter: true 
}]

All of the rest of the code in App.js stays exactly the same. Nice!

So, this is cool, but we're using hard-coded data. I don't know about you, but I almost never use data like this. I nearly always need to get it from a server asyncronously. Let's learn how to do that in the next video.