React: Load and Display Data from Local JSON Files

August 13, 2022 A Goodman

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…

Flutter: Get the Position of a Tap (X & Y coordinates)

August 12, 2022 A Goodman

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…

How to Create a Word Counter in React (with Hooks)

August 12, 2022 A Goodman

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…

React: How to Check Internet Connection (Online/Offline)

August 12, 2022 A Goodman

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…

Flutter: Showing a Context Menu on Long Press

August 11, 2022 A Goodman

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…

React: How to Detect Caps Lock is On

August 11, 2022 A Goodman

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…

React: How to Create an Image Carousel from Scratch

August 11, 2022 A Goodman

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:…

Flutter: Turn an Image into a Base64 String and Vice Versa

August 10, 2022 Snowball

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…

React: How to Create a Responsive Navbar from Scratch

August 10, 2022 A Goodman

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…

How to Create a Read More/Less Button in React

August 10, 2022 A Goodman

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…

Display Custom Loading Screen when React Isn’t Ready

August 9, 2022 A Goodman

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…

React: Create a Fullscreen Search Overlay from Scratch

August 9, 2022 A Goodman

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….

1 4 5 6 7 8 81