unyu.js

import React, { useState } from 'react';
import ReactDOM from 'react-dom/client';


function BelajarForm() {
  const [nama, setNama] = useState("John Doe")
  const [message, setMessage] = useState("");

  const handleSubmit = (e) => {
    e.preventDefault();
    if (nama !== "") {
      console.log("Nama saya adalah " + nama)
    } else {
      setMessage("Ups.. harus di isi cui!")
    }
    
  }

  return (
    <form onSubmit={handleSubmit}>
      <label>Masukan nama:</label>
      <input 
        type="text"
        value={nama}
        onChange={(e) => setNama(e.target.value)}
      />
      <small>{message}</small>
      <p>Nama saya: {nama}</p>
      <button type='submit'>Save</button>
    </form>
  )
}
const root = ReactDOM.createRoot(
  document.getElementById('root')
);

root.render(<BelajarForm />);