What's New in AG Grid 30

AG Grid 30 is a milestone version which delivers many improvements and highly-requested new features in cell rendering, editing and export to Excel: 1. Cell data types with automatic type inference 2. Built-in cell editors 3. Group footer rows when using ... more

Reducing Angular Library Contributions to the Main Bundle

In this guest post by Nicolas Gehlert, origianlly published here, learn the best way to include AG Grid in your own shared Angular library that will not result in AG Grid being included in the main bundle, as long as it is only used in lazy loaded routes. ... more

What's New in AG Grid 28.2

AG Grid 28.2 is a minor version which adds support for SolidJS, enhances chart functionality and allows to customize the integrated chart UI. There are also many improvements in performance and stability. As this is a minor version, there are no breaking ... more

Vuestic UI app with AG Grid Tutorial

Author: CTO Epicmax Yauheni Prakopchyk Original: Epicmax Blog Vuestic is a growing vue UI framework with high customizability and SSR support. It’s a good choice for modern responsive application. In this article you will learn to create an application ... more

Using React Hook Form with AG Grid

This post contributed to the AG Grid blog by Funmilayo Olaiya. Forms are commonly used on various online websites, web applications, mobile apps, and the like for information input and collection, data validation, and other core tasks. Creating or using ... more

Add new rows using a pinned row at the top of the grid

In this post, we'll show you how to enable users to add new data rows using a pinned row at the top of the grid. This way new rows can be added right inside the grid without using separate UI just for adding new rows. We've built a sample to illustrate ... more

Using Playwright to Test AG Grid React Apps

This article contributed to the AG Grid blog by Cameron Pavey Playwright is a testing tool created and maintained by Microsoft geared primarily toward end-to-end (E2E) tests. It boasts several features that make it a compelling choice for teams considering ... more

Using AG Grid in Electron Applications

This post contributed to the AG Grid blog by Arek Nawo Electron is a cross-platform framework for building native desktop applications with web technologies. It’s built on top of Node.js and the Chromium browser, allowing you to use all of the latest ... more

Using React-Bootstrap and AG Grid

This post contributed to the AG Grid blog by Arek Nawo Bootstrap is one of the most popular CSS frameworks, so it’s no surprise that many libraries integrate it with the top JavaScript UI frameworks. One such library is React-Bootstrap. React-Bootstrap ... more

How to Optimize a React Application Using Hooks and AG Grid

This post contributed to the AG Grid blog by Cameron Pavey. React describes itself as a “JavaScript library for building user interfaces.” Its internal workings are quite complex, but there are essentially two main pieces: React itself and the React ... more

Typescript Generics

In this article, we will show you how to make the most of Typescript Generics in AG Grid v28. We will demonstrate the great developer experience it unlocks with the help of code examples. AG Grid Generic Types TData - Row Data Type TValue - Cell Value ... more

Why Use a Third-Party Data Grid Component?

This post contributed to the AG Grid blog by Melissa McEwen When it comes to implementing a data grid component in a web application, one of the toughest decisions is which component to use. You can build the data grid component yourself or choose to ... more

Angular Kenya Meetup

Stephen Cooper presented at the Angular Kenya Meetup on June 23 2022. Explaining lessons learned from building components that are used by other people when they have template type checking enabled. Stephen implemented many of the techniques he describes ... more

JS Nation and React Summit June 2022 Overview

June was a busy month for the AG Grid team as we were sponsoring JS Nation and React Summit. JS Nation JS Nation is a multi-framework conference and since AG Grid's Data Grid supports Vue, Angular, Javascript as well as React, it was a good match for ... more

How to evaluate a Javascript Data Grid

What do we do when hunting for a new component to meet a specific need? How do we answer the question "What is the best Data Grid?" For a specific framework, we could 'Ask Google': "What is the best React Data Grid?" and in response, ... more

Geekle React Global Summit 2022 Overview

The Geekle React Global Online Summit took place in April 2022, AG Grid helped sponsor the conference. The free live stream of the event can be viewed on YouTube. And the free streamed events for all their conferences can be viewed on their YouTube channel, ... more

Styling React Data Grid With Custom CSS Styles

Blog post contributed to the AG Grid blog by Cameron Pavey. Standard tables are not typically adequate when working with lots of data in complex web applications, which is where data grids come in. Data grids are similar to tables in that they present ... more

AG Grid on The Angular Plus Show Podcast

Stephen Cooper was guest on The Angular Plus show podcast which was released on 8th July 2022. Stephen is a lead developer in Angular at AG Grid and joined the company because he had used AG Grid in the past and created various extension wrappers for ... more

Upcoming changes to AG Grid Angular in v28

In this post, we want to give you notice of the changes that are coming to our Angular wrappers in v28 and actions that you can take now to make the upgrade as smooth as possible. In v28 of AG Grid, we are enabling the Ivy distribution format which brings ... more

Using AG Grid React UI with Remix.run

This post contributed to the AG Grid blog by Arek Nawo. Remix is a new full-stack JavaScript framework based on React Router that aims to combine a fast and resilient user experience (UX) with a high-quality development experience (DX) through progressive ... more

Using AG Grid React UI with Remix.run

This post contributed to the AG Grid blog by Arek Nawo. Remix is a new full-stack JavaScript framework based on React Router that aims to combine a fast and resilient user experience (UX) with a high-quality development experience (DX) through progressive ... more

Maximise your productivity with AG Grid Documentation

At AG Grid we put a lot of effort into our documentation as we understand that good documentation helps developers achieve their goals. In this post I want to highlight some features of our documentation that can greatly improve you productivity. Framework ... more

Code Tetris in 200 Lines of Code using React

Tiny Tetris in React When I learn a new programming language, one of my favourite things to do is write a simple Tetris game in it. I've written Tetris in C, C++ and Java, and most lately I've written Tetris using JavaScript and React. I was amazed when ... more

Why AG Grid's React Rendering Matters

7 years ago the first version of AG Grid was released, initially for AngularJS, but then following on to support Angular, React and Vue. The reason the AG Grid project was started was there was nothing out there with the breadth of features and depth ... more

Minimising Application Bundle Size

In this post, we are going to demonstrate how you can minimise your application bundle size when working with AG Grid. This can be important if you want to improve your page load times, especially over slower networks. We will also detail the simplest ... more

What's New in AG Grid 27

AG Grid 27 is a major step forward in developer productivity, functionality and accessibility and a stepping stone for further product improvements. As a major version, it allows us to introduce improvements that require breaking changes but that deliver ... more

Free Online Training Courses for React and Angular with AG Grid

Our documentation covers the full Grid API with many examples. In addition each concept and example has code for React, Angular, Vue and JavaScript. We also have an up to date Getting Started Guide for each framework - just click on the framework icon ... more

Building CRUD operations in AG Grid with Sequelize & Angular

In this post we'll show how to implement CRUD operations in AG Grid, Angular and Sequelize. You'll see how easy it is to integrate AG Grid, a Node.js server with Express, Sequelize and a PostgreSQL database.‌ What is Sequelize? According to the Sequelize ... more

Cypress Plugin for AG Grid

Kerry McKeever created a Cypress plugin for helping automate AG Grid. The plugin is open source and available on Github. Introduction Kerry created the Cypress Plugin for helping the teams he works with incorporate Cypress automation in their development ... more

Using React Testing Library with AG Grid

Having written a Podcast Player using AG Grid, we should really add some tests. This post shows how to use Jest and the React Testing Library with AG Grid. All the code to support this blog post is available on Github in the React Data Grid Podcast Project, ... more