Creating controlled and uncontrolled input fields

It is necessary to implement two types of input fields in React: controlled and uncontrolled. When clicking on the form, the values of these fields should be output to the console.

import React from "react";

export default function App() {
    const handleSubmit = () => {
        console.log("controlled input value: ");
        console.log("uncontrolled input value: ");
    };

    return (
        <form onClick={handleSubmit}> 
            <input
                placeholder="controlled field"
            />
            <input placeholder="uncontrolled field" />
            <button>Submit a credit application</button>
        </form>
    );
}