Add React and TS to webpacker; add react-rails gem

app/javascript/components/Hello.tsx

@@ -0,0 +1,19 @@
+import * as React from "react";
+
+interface IProps {
+  name: string;
+}
+
+class Hello extends React.Component<IProps> {
+  render () {
+    const {name} = this.props;
+
+    return (
+      <React.Fragment>
+        <span>Hello {name}!</span>
+      </React.Fragment>
+    );
+  }
+}
+
+export default Hello;

app/javascript/packs/application.js

@@ -17,3 +17,7 @@ require("../stylesheets/application")
 //
 // const images = require.context('../images', true)
 // const imagePath = (name) => images(name, true)
+// Support component names relative to this directory:
+var componentRequireContext = require.context("components", true);
+var ReactRailsUJS = require("react_ujs");
+ReactRailsUJS.useContext(componentRequireContext);

app/javascript/packs/server_rendering.js

@@ -0,0 +1,5 @@
+// By default, this pack is loaded for server-side rendering.
+// It must expose react_ujs as `ReactRailsUJS` and prepare a require context.
+var componentRequireContext = require.context("components", true);
+var ReactRailsUJS = require("react_ujs");
+ReactRailsUJS.useContext(componentRequireContext);

app/views/boards/show.html.erb

@@ -1,2 +1,6 @@
 <h1><%= @board.name %></h1>
 <p><%= @board.description %></p>
+
+<%=
+  react_component('Hello', { name: 'TypeScript on React on Rails' })
+%>