Cycle 1

browser/Components/main.js

@@ -0,0 +1,39 @@
+import React, { Component } from 'react';
+import axios from 'axios';
+
+class Main extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      students: []
+    };
+  }
+  async componentDidMount() {
+    let { data } = await axios.get('/student');
+    this.setState({ students: data });
+  }
+
+  render() {
+    return (
+      <div>
+        <h1>Students</h1>
+        <table>
+          <tbody>
+            <tr>
+              <th>Name</th>
+            </tr>
+            {this.state.students.map(student => {
+              return (
+                <tr key={student.id}>
+                  <td>{student.fullName}</td>
+                </tr>
+              );
+            })}
+          </tbody>
+        </table>
+      </div>
+    );
+  }
+}
+
+export default Main;

browser/index.js

@@ -1 +1,5 @@
-console.log('Hello Webpack!');
+import React, { Component } from 'react';
+import ReactDOM from 'react-dom';
+import Main from './Components/main';
+
+ReactDOM.render(<Main />, document.getElementById('app'));