added focus on load

.editorconfig

@@ -0,0 +1,12 @@
+[*]
+indent_style = space
+end_of_line = lf
+insert_final_newline = true
+trim_trailing_whitespace = true
+charset = utf-8
+
+[{*.css,*.scss}]
+indent_size = 4
+
+[{*.js,*.json}]
+indent_size = 2

package.json

@@ -12,7 +12,7 @@
   },
   "scripts": {
     "start": "react-scripts start",
-    "build": "react-scripts build",
+    "build": "INLINE_RUNTIME_CHUNK=false react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },

src/App.js

@@ -1,4 +1,4 @@
-import React, {useState} from 'react';
+import React, {useState, useEffect} from 'react';
 import './App.css';
 
 const parseTime = time => {
@@ -8,18 +8,37 @@ const parseTime = time => {
 };
 
 const App = () => {
-  const [hours, setHours] = useState(0)
-  const [minutes, setMinutes] = useState(0)
-  const [seconds, setSeconds] = useState(0)
+  const [hours, setHours] = useState(0);
+  const [minutes, setMinutes] = useState(0);
+  const [seconds, setSeconds] = useState(0);
 
-  const result = hours + minutes / 60 + seconds / (60 * 60)
+  useEffect(() => {
+    document.getElementById('hours').focus();
+  }, []);
+
+  const result = hours + minutes / 60 + seconds / (60 * 60);
 
   return (
     <div className="App">
       <div>
-        <input id="hours" type="text" value={hours} onChange={e => setHours(parseTime(e.target.value, 10))} />
-        <input id="minutes" type="text" value={minutes} onChange={e => setMinutes(parseTime(e.target.value, 10))} />
-        <input id="seconds" type="text" value={seconds} onChange={e => setSeconds(parseTime(e.target.value, 10))} />
+        <input
+          id="hours"
+          type="text"
+          value={hours}
+          onChange={e => setHours(parseTime(e.target.value, 10))}
+        />
+        <input
+          id="minutes"
+          type="text"
+          value={minutes}
+          onChange={e => setMinutes(parseTime(e.target.value, 10))}
+        />
+        <input
+          id="seconds"
+          type="text"
+          value={seconds}
+          onChange={e => setSeconds(parseTime(e.target.value, 10))}
+        />
       </div>
       <br />
       <div>
@@ -27,6 +46,6 @@ const App = () => {
       </div>
     </div>
   );
-}
+};
 
 export default App;