ASP.NET Core 3 and React

Styling using CSS class references

We could style our app in the traditional way by defining CSS classes in a CSS file and referencing these within our components. In fact, this is what CRA did with the App component. We have removed a lot of the content in App.tsx, but if we look at the JSX, we'll see a reference to a CSS class called App:

<div className="App">  <Header />  <HomePage /></div>

We'll also see a file called App.css, which has been imported into App.tsx:

import './App.css';

If we look in App.css, we'll see the App CSS class, along with lots of others that are now redundant because we've replaced a lot of the content in the App component:

.App {  text-align: center;}

Why is a className attribute used to reference CSS classes? Shouldn't ...