TypeORM: Add Columns with Array Data Type
When using TypeORM, it’s possible to define columns with the array data type. If you want to add a column that stores arrays of numbers, you can define it like so: In case you need a…
React: Using inline styles with the calc() function
This short and straightforward article shows you how to use the CSS calc() function when using inline styles in React. Overview The calc() function calculates the value for a property (addition, subtraction, multiplication, and division operations):…
React: Create an Animated Side Navigation from Scratch
Introduction In modern web apps built for both desktops and mobile devices, side navigation menus are often used for their convenience. These side navigation menus can be opened or closed by the user, thus saving space…
Using Range Sliders in React: Tutorial & Example
This succinct, practical article shows you how to implement and customize range sliders in React. Everything will be made from scratch without using any third-party libraries. I won’t waste your time and bore you with little-meaning…
Dart: Get Host, Path, and Query Params from a URL
In Dart, you can extract useful information from a given URL string by following the steps below: 1. Construct a Uri object from your URL string: 2. Now, you can get what you want through various…
Using GetX to make GET/POST requests in Flutter
GetX is a massively functional and open-source Flutter library that is the most popular these days, with over 10,000 likes on pub.dev. Although GetX provides a wide range of features, each feature is contained in a…
React: Create a Reusable Switch/Toggle Component
In web and mobile apps, a switch or a toggle lets users choose between a pair of opposing states, like ON and OFF, LIGHT and DARK, ACTIVE and INACTIVE, using a different appearance to indicate each…
React: Removing Items from a List (Full Example)
When developing web apps with React, there are innumerable cases where we have to render a list of things, such as a list of users, a list of tasks, a list of products, etc. In these…
React: Programmatically Scroll to Bottom/Top of a Div
This concise and practical article shows you how to programmatically scroll to the bottom or to the top of a scrollable div element in React. The TL;DR Here is the process that we will go through:…
React: Update Arrays and Objects with the useState Hook
This practical and straight-to-the-point article shows you how to update objects and arrays in the state in React correctly. We’ll use the useState hook and functional components. Without any further ado, let’s get started. The TLDR…
React: Changing Button Text on Click
The example below shows you how to change the text of a button after it gets clicked in React. We’ll use the useState hook to get the job done. App Preview The Code Explanation 1. Store…
React Router: 3 Ways to Disable/Inactivate a Link
This succinct, practical article shows you 3 different ways to disable/inactivate a Link in a React application that uses React Router 6 (the latest version). We will explore the fundamentals and then apply them in a…
