Display of entered text from input fields

It is necessary to display on the interface the values that the user enters into two fields — one of them should be implemented as a controlled component, and the other as uncontrolled. When clicking the 'Submit' button, the current data from both inputs should be displayed somewhere on the page.

 export default function App() {
    return {
    <div className="App">
    </form>
    <input placeholder="compiled" />
    <input placeholder="uncompiled" />
    <button>Submit</button>
    </form>
    </div>
};

Hint: for the controlled input, you should store its value in the component's state and update it via an onChange handler, while for the uncontrolled input, use a ref or directly access the DOM element.