Functions are first-class citizens in JavaScript. That's why you will early on hear about callback functions in JavaScript, which are a super powerful asset when writing JavaScript code. Here I want to give you a brief introduction to them. Callback functions are usually passed as argument to functions: In this case, our printText function takes…

When you have learned about JavaScript promises for the first time, you learned about the promise's methods then and catch. While the former's callback function is called whenever a JavaScript promise resolves successfully, the latter is used for error handling: Eventually you have learned about async/await in JavaScript as alternative to a…

There are two error handling scenarios in JavaScript. Either an error is thrown from a third-party (e.g. library, database, API) or you want to throw an error yourself. While you have the error at your hands for the former, for the latter you need to new it yourself: Sometimes you want to throw custom errors though. I learned that you can create…

Today I came across a question in my Newsletter regarding computed properties in React. I didn't know about the term computed properties before, because such a term doesn't really exist in React, but it exists in other frameworks like Vue. Maybe I would call it computed values , computed state , or derived state (not from props though) in…

It doesn't happen often, but sometimes you have to update state from props in React. In this brief walkthrough, I want to show you a use case where you would want to derive state from props and how to do it for the initial props and updated props. Keep in mind that this concept should only be used rarely though, because often there is no need…

After learning how to pass props in React , the next thing you will learn is often state in React . Managing JavaScript primitives such as strings, booleans, and integers in React State are the basics for state management in React. But what about more complex data structures such as JavaScript arrays? There are many questions popping up for React…

Gatsby is an open-source framework based on React that helps build websites and apps. It allows you to build your website and apps using React and then generates HTML, CSS, and JS when you build for production. One of the many advantages of using Gatsby is that it allows accessing data through a query language called GraphQL. GraphQL is a query…

It's a common task in React to update an item in a list. Here I want to show you briefly how this works. Every time you want to modify something in React, for example a list where you want to change an item, you have to use React's state management . We will be using React's useState Hook here, for the sake of keeping the first example simple…

It's a common task in React to add an item to a list. Here I want to show you briefly how this works. Every time you want to modify something in React, for example a list where you want to add an item, you have to use React's state management . We will be using React's useState Hook, to keep this first example simple, however, you can also use…