How To Build a Real-Time Updating Data Grid in React

There are plenty of examples out there of building a data grid using static data, but what about live streaming data? This blog post explains how you can create a real-time grid that uses the KendoReact Data Grid. Check it out.

Applying SOLID principles in React

As the software industry grows and makes mistakes, the best practices and good software design principles emerge and conceptualize to avoid repeating the same mistakes in the future. The world of object-oriented programming (OOP) in particular is a goldmine of such best practices, and SOLID is unquestionably one of the more influential ones.

Learn how to build, test and deploy a bookstore app

This guide will cover in detail the steps to create a working example bookstore single page application using the latest React 18 and run it using the Vite. It also includes details on how to add a custom state management solution and routing using the wouter library.

React Hooks: The Deep Cuts

Hooks are reusable functions. They allow you to use state and other features (e.g. lifecycle methods and so on) without writing a class. Hook functions let us “hook into” the React state lifecycle using functional components, allowing us to manipulate the state of our functional components without needing to convert them to class components.

Migrating from Styleguidist to Storybook

By transitioning from Styleguidist to Storybook, we were able to offer a faster and more user-friendly development environment for React components along with better alignment to developer and designer workflows. In this post we’ll take a deep dive into how and why we migrated to Storybook.

Actionless and Stateless Reducers in React

I think useReducer is pretty great and underutilized, and conversely useState overutilized. useReducer usually comes in to play when state updating logic gets unwieldy. So unwieldy and spread out over many components that it needs to be consolidated, with the state updates mapped out in a single function; a reducer. Usually reducers are half state-machines with long a switch statement with a case for each action type (or many if/elses, same thing). Maybe your reducer is particularly gnarly and has few nested conditions, oh boy.

No more endless back-and-forth on tracking plans

Objectiv is ready-to-use infrastructure for advanced product analytics. Set up validated event tracking for React apps, based on a generic event structure. Built together with 50+ companies to cover many modeling use cases. Open-source with developer tooling: inline documentation & linting in IDE/console, client/server side validation and end-to-end testing tools for the tracking instrumentation.