add react and typescript

app/javascript/packs/application.ts

@@ -3,11 +3,13 @@
 // a relevant structure within app/javascript and only use these pack files to reference
 // that code so it'll be compiled.
 
-import Rails from "@rails/ujs"
-import Turbolinks from "turbolinks"
-import * as ActiveStorage from "@rails/activestorage"
-import "channels"
+// import Rails from "@rails/ujs"
+// import Turbolinks from "turbolinks"
+// import * as ActiveStorage from "@rails/activestorage"
+// import "channels"
 
-Rails.start()
-Turbolinks.start()
-ActiveStorage.start()
+// Rails.start()
+// Turbolinks.start()
+// ActiveStorage.start()
+
+import './src/index'

app/javascript/packs/src/App.tsx

@@ -0,0 +1,19 @@
+import React from "react"
+import {
+  BrowserRouter as Router,
+  Switch,
+  Route,
+} from "react-router-dom";
+
+export const App = () => (
+  <Router>
+    <Switch>
+      <Route path="/about">
+      <div>About!</div>
+      </Route>
+      <Route path="/">
+        <div>Hello World!</div>
+      </Route>
+    </Switch>
+  </Router>
+)

app/javascript/packs/src/index.tsx

@@ -0,0 +1,13 @@
+import React from 'react'
+import ReactDOM from 'react-dom'
+import { App } from './App'
+
+document.addEventListener('DOMContentLoaded', () => {
+  ReactDOM.render(
+    <React.StrictMode>
+      <App />
+    </React.StrictMode>
+    ,
+    document.getElementById('root'),
+  )
+})