Interfaz gráfica que permite a los usuarios interactuar con un sistema mediante elementos visuales.
Incluye ventanas, botones y menús, en lugar de usar solo comandos de texto. Más intuitiva que la CLI para usuarios no técnicos.
// Crear GUI con React function Aplicacion() { const [contador, setContador] = useState(0); return ( <div className="min-h-screen bg-gray-100 p-8"> {/* Ventana/Card */} <div className="bg-white rounded-lg shadow-lg p-6 max-w-md mx-auto"> <h1 className="text-2xl font-bold mb-4">Mi Aplicación</h1> {/* Formulario */} <input type="text" className="border rounded px-3 py-2 w-full mb-4" placeholder="Escribe algo..." /> {/* Botones */} <div className="flex gap-2"> <button className="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600" onClick={() => setContador(c => c + 1)} > Incrementar ({contador}) </button> <button className="bg-gray-200 px-4 py-2 rounded"> Cancelar </button> </div> </div> </div> ); }
