This practical, succinct article shows you how to load and render data from a local JSON file in React. Without any further ado, let’s get started. Importing Local JSON Files In a React project created with…

This short and straightforward article shows you how to get the location (X and Y coordinates) of a tap in Flutter. The TLDR What you need to do is to wrap your entire screen (or a…

This practical article shows you how to create a word counter in React (in addition, we’re going to add a character counter, since it doesn’t take much effort). A Quick Note There is a common pitfall…

This succinct, practical article shows you how to check the internet connection in React by using hooks. No third-party libraries are required. What Is The Point? In Javascript, there is an object called navigator that can…

When developing apps with Flutter, there might be cases where you want to show a context menu when your user long press on an element. The location of the context menu will be near the press…

The complete example below shows you how to find out if the caps lock is currently ON when you are typing something into an input field in a React application. This will be useful in many…

This practical walks you through the steps to implement an image carousel (slider) in React. We’ll make it from the ground up without any third-party NPM packages. No more ramble; let’s get our hands dirty. Prerequisites:…

In Flutter, you can encode a local or network image (or another kind of file) to a base64 string like this: You can decode a base64 string to an image file like this: In case you…

This article walks you through a complete example of creating a responsive top navigation menu in React. We’ll build everything from the ground up with only native features of React and pure CSS. Neither NPM packages…

When building web apps, there will come a time when you need to display some long text. A smart design in this case is to display only part of the text and add a Show More…

Before your React app is ready and capable of rendering its components, there is a period of time when only your HTML and CSS are working. If the internet speed of your user is fast then…

This hands-on, low-word, code-rich article walks you through a complete example of creating a fullscreen search overlay in React. We’ll build everything from the ground up with hooks and pure CSS. No third-party packages are required….