This article walks you through an end-to-end example of creating a custom context menu in a React app that is written in TypeScript. We’ll use new features of React like hooks and functional components. You won’t…

The example below describes how to use a multiple select in a React project written in TypeScript. You will learn to get the selected values as well as display them on the screen. Everything will be…

This article shows you how to correctly use Bootstrap 5 in a Next.js project. By the end of this article, we will be able to: Use all CSS classes provided by Bootstrap 5 whereever you want….

This article shows you a couple of different ways to use Bootstrap 5 (the latest version of Bootstrap) and Bootstrap icons in a React project. Using Bootstrap Official Packages 1. To use Bootstrap 5, you can…

This article is about the onMouseOver and onMouseOut events in a React project written in TypeScript. We’ll go through the fundamentals of these events then examine a complete example of using them in practice. Overview The…

The end-to-end example below shows you how to handle image events in a React app that uses TypeScript. There are 2 events that we are going to work with: onLoad: This event occurs when an image…

The onClick event occurs when an element is clicked. This element can be a button, a div element, an image, etc. This article walks you through a couple of different examples of handling the onClick event…

This article walks you through the basics and a few practical examples of handling keyboard events in a React app that is written in TypeScript. We’ll use modern React features including hooks and functional components. You…

This article walks you through an end-to-end example of handling dynamic checkboxes in a React application written in TypeScript. We’ll use hooks and functional components, not class components as well as old-fashioned stuff. The Example Overview…

This article walks you through a complete example of making a password strength checker in React and TypeScript. We will build it from scratch and will NOT use any third-party packages. In addition, we will use…

This article shows you a few ways to comment out a single line or a block of code in React and JSX. Using Keyboard Shortcuts If you are using VS Code (Visual Studio Code) to develop…

When using inline styles in a React project that is written in TypeScript, you may encounter some annoying problems. For example, the code below: will result in an error like this: Similar errors can also occur…