Digests » 329

sponsor

How To Use and Customize the KendoReact DatePicker

If you’ve ever had to build your own date picker component, then you know it’s no easy task. Often, the default HTML date picker simply won’t cut it. So get your calendar out and pencil this blog in for the next few minutes, because we’re going to take a deep dive into all the features and functionality of the KendoReact DatePicker—just one of the beautiful and fully accessible components that make up the KendoReact Date Inputs Library!

this week's favorite

Hide popups when the user scrolls away with React

How to write a custom hook that will ensure that sticky popups don’t ruin the UX in your React app.

How to build an advanced multipart component with Chakra UI

Chakra UI is a modular and accessible component library that has won the hearts of many developers. I personally really like its progressive disclosure of complexity for the APIs (theming, components, helper functions). Often times you’ll find yourself modifying some theme properties like colors and sticking with the components it ships with. However, you can use component styles to change individual components to your liking. This allows you to change base & default styles but also add new styles to a component and modify properties like size, variant, color scheme, and color mode behavior.

How to test a select element with React Testing Library

I recently needed to add tests for a <select> element I was developing, and I couldn't find a lot of resources on how to do this with React Testing Library, so I'll share the approach I went with.

Creating a React component with TDD

Join me in this post as I create a React component using Test Driven Development (TDD) approach.

React Router v6

Easily the single biggest reason for a new router release is the advent of React hooks. You may remember Ryan's talk introducing hooks to the world at React Conf 2018 and how a lot of the code that we were all used to writing with React's "lifecycle methods" just sort of melts away as you refactor class-based React code to hooks.