collect data from React Form

Form.jsx

import { useState } from "react";

const SignUp = () => {
  const [values, setValues] = useState();

  const onChange = (event) => {
    setValues({
      ...values,
      [event.target.name]: event.target.value
    });
  };

  return (
    <div>
      <h1>SignUp</h1>

      <form
        onSubmit={(event) => {
          event.preventDefault();
          console.log(values);
        }}
      >
        <label htmlFor="username">Username:</label>
        <input
          required
          type="text"
          name="username"
          placeholder="username"
          onChange={onChange}
        />
        <label htmlFor="email">Username:</label>
        <input
          required
          type="text"
          name="email"
          placeholder="email"
          onChange={onChange}
        />
        <button type="submit">Submit</button>
      </form>
    </div>
  );
};

export default function App() {
  return (
    <div className="App">
      <SignUp />
    </div>
  );
}