When we talk about composition, we are talking about using smaller pieces to assemble a larger cohesive unit. In React, elements are used to create components. In other words, common HTML pieces like divs, spans, forms, and so on are arranged together to create a component. In talking about composing components in React, we are […]

React elements have properties that are based on the standard DOM events. React elements are able to fire all the same events as the usual DOM elements. They are named using camelCase so don’t forget to use this convention on React Elements. So if you want to use onclick, it will actually be onClick. This […]

Now we’re going to learn about how to do conditional rendering in React. In other words, if one condition exists, then we render a specific piece of information. If a different condition exists, then we would render a different piece of information to the browser. Well, React is not a templating language so we do […]

Creating a list in the browser is a super common technique for displaying a list of data. In this tutorial, we’ll learn about how to create a list of items using React. It’s a little different from how you might approach this when using some of the other popular UI frameworks like Vue or Angular. […]

Styling your React components is an important part of creating a useful and meaningful user experience. In addition, those building blocks determine the way a product or brand feels and looks. In React, like in most things web development, there are more than a few ways to solve the challenge. We’ll look at two simple […]

JSX is an extension to the JavaScript language, and therefore it can accept any valid JavaScript expressions placed inside the curly braces. For example, 4 + 4, user.firstName, or formatName(user) are all valid JavaScript expressions. This allows you to make your JSX more dynamic. In this tutorial we’ll take a look at some additional examples […]

In this tutorial we are going to create a React Element from scratch. This will show us a little bit about why we first import React and ReactDOM as well as how a JSX expression gets converted to an Object for the Browser to use. We are making use of the Create React App, however […]