Chapter 9. Project: Menu component


This chapter covers

  • Understanding the project structure and scaffolding
  • Building the Menu component without JSX
  • Building the Menu component in JSX

The next three chapters will walk you through several projects, gradually building on the concepts you’ve learned in chapters 18. These projects will also reinforce the material by repeating some of the techniques and ideas that are most important in React. The first project is minimal, but don’t skip it.

Imagine that you’re working on a unified visual framework that will be used in all of your company’s apps. Having the same look and feel in various apps is important. Think about how Twitter Bootstrap for many Twitter apps and Google’s Material UI[1] are used across many properties that belong to Google: AdWords, Analytics, Search, Drive, Docs, and so on.

1Twitter Bootstrap: React components that implement Twitter Bootstrap: Google Material Design: React Components that implement Material Design:

9.1. Project structure and scaffolding

9.2. Building the menu without JSX

9.3. Building the menu in JSX

9.4. Homework

9.5. Summary