React Key Concepts

6. Styling React Apps

Learning Objectives

By the end of this chapter, you will be able to do the following:

– Style JSX elements via inline style assignments or with the help of CSS classes

– Set inline and class styles, both statically and dynamically or conditionally

– Build reusable components that allow for style customization

– Utilize CSS Modules to scope styles to components

– Understand the core idea behind styled-components, a third-party CSS-in-JS library

Introduction

React.js is a frontend JavaScript library. This means that it's all about building (web) user interfaces and handling user interaction.

Up to this point, this book has extensively explored how React may be used to add interactivity to a web app. State, event handling, ...