className a htmlFor

V HTML dáte prvku třídu atributem class. V JSX je to className:

<p className="hlavni-hvezda">Noční vlaky, 20:00</p>

Proč jiný název? JSX se mění na JavaScript a atributy na objekt: { className: "hlavni-hvezda", children: "Noční vlaky, 20:00" }. React používá názvy, které pro prvky má JavaScript, a v JavaScriptu je třída prvku prvek.className, protože class je slovo, které si JavaScript nechává pro sebe. Na stránce je z toho obyčejný atribut class a CSS v style.css funguje, jak ho znáte.

Totéž platí pro atribut for u prvku label, podle kterého se pozná, ke kterému textovému poli popisek patří. for je v JavaScriptu cyklus, a tak je v JSX htmlFor:

<label htmlFor="email">E-mail</label>
<input id="email" />

Když přesto napíšete class nebo for, stránka obvykle vypadá dobře, protože je React prohlížeči předá. Konzole ale ukáže varování:

Invalid DOM property `class`. Did you mean `className`?

Berte ho jako chybu a opravte ji: v JSX se píše className a htmlFor.