02.06 React State - font color switch (functional components)

App preview:

Project files:
An image of project file structure

---

src/App.js

import React, { useState } from "react";
import "./App.css"

function App(){
  const [color, setColor] = useState('red');

  return (
    <div className="app" style={{color: color}} >
      <h1>Text color is {color}.</h1>
      <button onClick={() => setColor("blue")} >Blue</button>
      <button onClick={() => setColor("red")}>Red</button>
    </div>
  );
}

export default App;

---

src/App.css

.app{
    background-color: lightskyblue;
    padding: 20px 10px;
}