Maps of Unicode characters, creating and shuffling a deck, and more — Do you want to know how to render a card with React Hooks or how to shuffle a deck of playing cards? In a previous article, we looked at how to render a playing card from a single suite with React Hooks. Next, we can extend that and show any…

How to render a List with Elm — In this article, we get back to Elm. Do you remember it? It is the pure functional language used to build web applications. In a previous post, we looked at how to render a list in React. Now, we check how to do the same rendering in Elm. Let’s start. Using an Inline Function …

Maps, composite keys, default parameters, and more — In a previous article, we looked at how to search for elements in a large array. There we conclude that is faster to access such elements in an associated map instead of searching for them in the list. When checking to see if an element is present in a large…

Using a generic key name, composite key, and more — In a previous article, we looked at how to remove duplicates from an array. This time we start from that code and try to encapsulate it into a generic utility. Let’s first remember the solution we are going to use. Consider the following list of books. const arr = […

Controlled input, onInput event, e.target.innerHTML, and more — In HTML, elements can be editable. By doing so the web page can be transformed into a rich text editor. Set the contenteditable attribute on an HTML element to make it editable. Basically, this page in Medium is a content editable element.

Debounce, throttle, useCallback hook, and more — In a previous post, we looked at how to create a hook providing both the current value and the debounced value for a text input. This time we will just debounce or throttle the input callback received by a component. Let’s start by creating a simple component managing a search…

Default button type, default form method, pressing Enter in inputs, and more — There are some default behaviors that happen when using an HTML form that is worth discussing. This way you will avoid surprises. Let’s start. 1. The Default Type of a Button is Submit Just putting the <button> tag into a page without specifying its type is the same as creating a button with the type submit. <button>Click</button> <button type="submit">Click</button>