Beginning React

Managing Styles

Perhaps you have noticed that we have an import statement concerning a CSS file in the App component module:

import React, { Component } from 'react';import './App.css';import Catalog from './Catalog';

This may seem a bit strange, since import statements should only work for JavaScript code. However, thanks to the development environment provided by create-react-app, we can use the same syntax, even for CSS files. This allows us to use the classes and other CSS definitions defined in App.css in our component, keeping component-specific styles close to the component definition itself. For example, if we want our Catalog component to have the title in red, we can proceed as shown next.