create a simple checkbox using useState, input and onChange

src/App.js

@@ -1,6 +1,6 @@
-import './App.css';
+import "./App.css";
 
-function App({name}) {
+function App({ name }) {
   return (
     <div className="App">
       <h1>Hello,{name}</h1>

src/index.js

@@ -1,30 +1,26 @@
-import React, {useState} from 'react'; //useState is a function, this is why i use { }
-import ReactDOM from 'react-dom';
-import './index.css';
+import React, { useState } from "react"; //useState is a function, this is why i use { }
+import ReactDOM from "react-dom";
+import "./index.css";
 
 function App() {
-  //state function
-const [status, setStatus] = useState("open");//a function to change the state
-
-//state variable
-/* const [status] = useState("open") //the current state
-console.log(status) // open */
-
-//what is useState?
-/* const result = useState;
-console.log(result) // a array with 2 itens - 0:undefined 1:()=> - a fuction */
+  const [check, setCheck] = useState(false);
   return (
-      <>
-      <h1>the door is:{status}</h1>
-      <button onClick={()=> setStatus("close")}>Close</button>
-      </>
+    <div>
+      <input
+        type="checkbox"
+        value={check}
+        onChange={() => {
+          setCheck((check) => !check);
+        }}
+      />
+      <p>{check ? "checked" : "no checked"}</p>
+    </div>
   );
 }
 
 ReactDOM.render(
   <React.StrictMode>
-    <App name="jess"/>
+    <App name="jess" />
   </React.StrictMode>,
-  document.getElementById('root')
+  document.getElementById("root")
 );
-