Chapter 7. Styles

When it comes to UI development, form and function go hand in hand. A well-styled UI is important for a successful app.

You have already seen that React makes it easy to add styles by importing CSS and using the className keyword in components. In this chapter, you will add more style rules to enhance the design of your application.

By the end of the chapter, Code Café will have a UI that looks good on both mobile devices and desktop browsers and that has some polished features (Figure 7.1, “Hover effect”). This will set the stage for the order functionality you will begin adding in the next chapter.

Figure 7.1. Hover effect

But first, you will take care of some housekeeping and learn about some core style concepts.

Create ...

Get React Programming: The Big Nerd Ranch Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.