Using ag-Grid with React: Styling

Hey everyone! JavaScript teacher Sam Julien here. Welcome to this next section in my series on using ag-Grid with React! This section is all about styling: row styling, cell styling, grid size, using custom icons, and printing the grid.

This section uses the same ag-grid-react-thinkster repository as the others. We'll be using a project called aggr-styling for all of the videos. You'll find the starting point code in the starting-points folder and the finished code in the finished-code folder.

To get started, you can open the repository in your editor, open a terminal in that folder, and run:

cd 06-styling/starting-points/aggr-styling/
npm install
npm start

Let's dive in!

Helpful Links

• ag-Grid docs: Row Styles
• ag-Grid docs: Cell Styles
• ag-Grid docs: Grid Width & Height
• ag-Grid docs: Grid Icons
• ag-Grid docs: Printing