diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index bdd393f..856aac8 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -1,5 +1,5 @@
 {
-  "name": "reinvest",
+  "name": "reinvest-frontend",
   "version": "0.1.0",
   "lockfileVersion": 1,
   "requires": true,
diff --git a/frontend/src/components/Bank.js b/frontend/src/components/Bank.js
index d637c3b..45d5d8e 100644
--- a/frontend/src/components/Bank.js
+++ b/frontend/src/components/Bank.js
@@ -1,8 +1,26 @@
-import React from "react";
+import React, { Component } from "react";
 import "./assets/Bank.css";
 
-const Bank = (props) => {
-  return <h1>Bank page</h1>;
-};
-
+class Bank extends Component {
+  constructor(props) {
+    super(props);
+    this.state = { apiResponse: "" };
+  }
+  callAPI() {
+    fetch("http://localhost:9000/FETCHURL")
+      .then((res) => res.text())
+      .then((res) => this.setState()({ apiresponse: res }))
+      .catch((err) => err);
+  }
+  componentDidMount() {
+    this.callAPI();
+  }
+  render() {
+    return (
+      <div class="container">
+        <h1 class="d-flex justify-content-center m-2 p-4">Bank</h1>
+      </div>
+    );
+  }
+}
 export default Bank;
diff --git a/frontend/src/components/Browse.js b/frontend/src/components/Browse.js
index e28b322..822f691 100644
--- a/frontend/src/components/Browse.js
+++ b/frontend/src/components/Browse.js
@@ -1,8 +1,27 @@
-import React from "react";
+import React, { Component } from "react";
 import "./assets/Browse.css";
 
-const Browse = (props) => {
-  return <h1>landing page</h1>;
-};
+class Browse extends Component {
+  constructor(props) {
+    super(props);
+    this.state = { apiResponse: "" };
+  }
+  callAPI() {
+    fetch("http://localhost:9000/FETCHURL")
+      .then((res) => res.text())
+      .then((res) => this.setState()({ apiresponse: res }))
+      .catch((err) => err);
+  }
+  componentDidMount() {
+    this.callAPI();
+  }
+  render() {
+    return (
+      <div class="container">
+        <h1 class="d-flex justify-content-center m-2 p-4">Browse</h1>
+      </div>
+    );
+  }
+}
 
 export default Browse;
diff --git a/frontend/src/components/Portfolio.js b/frontend/src/components/Portfolio.js
index 1244646..e3b8eb4 100644
--- a/frontend/src/components/Portfolio.js
+++ b/frontend/src/components/Portfolio.js
@@ -1,8 +1,27 @@
-import React from "react";
+import React, { Component } from "react";
 import "./assets/Portfolio.css";
-
-const Portfolio = (props) => {
-  return <h1>homepage</h1>;
-};
+class Portfolio extends Component {
+  constructor(props) {
+    super(props);
+    this.state = { apiResponse: "" };
+  }
+  callAPI() {
+    fetch("http://localhost:9000/FETCHURL")
+      .then((res) => res.text())
+      .then((res) => this.setState()({ apiresponse: res }))
+      .catch((err) => err);
+  }
+  componentDidMount() {
+    this.callAPI();
+  }
+  render() {
+    return (
+      <div class="container">
+        <h1 class="d-flex justify-content-center m-2 p-4">Portfolio</h1>
+        <h1>{this.state.apiResponse}</h1>
+      </div>
+    );
+  }
+}
 
 export default Portfolio;
diff --git a/frontend/src/components/Profile.js b/frontend/src/components/Profile.js
index 03e750e..64fdee9 100644
--- a/frontend/src/components/Profile.js
+++ b/frontend/src/components/Profile.js
@@ -1,8 +1,26 @@
-import React from "react";
+import React, { Component } from "react";
 import "./assets/Profile.css";
-
-const Profile = (props) => {
-  return <h1>Profile page</h1>;
-};
+class Profile extends Component {
+  constructor(props) {
+    super(props);
+    this.state = { apiResponse: "" };
+  }
+  callAPI() {
+    fetch("http://localhost:9000/FETCHURL")
+      .then((res) => res.text())
+      .then((res) => this.setState()({ apiresponse: res }))
+      .catch((err) => err);
+  }
+  componentDidMount() {
+    this.callAPI();
+  }
+  render() {
+    return (
+      <div class="container">
+        <h1 class="d-flex justify-content-center m-2 p-4">Profile</h1>
+      </div>
+    );
+  }
+}
 
 export default Profile;