diff --git a/package-lock.json b/package-lock.json
index a7829ee..2f5ef07 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2846,6 +2846,11 @@
       "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
       "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
     },
+    "bootstrap": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.1.1.tgz",
+      "integrity": "sha512-SpiDSOcbg4J/PjVSt4ny5eY6j74VbVSjROY4Fb/WIUXBV9cnb5luyR4KnPvNoXuGnBK1T+nJIWqRsvU3yP8Mcg=="
+    },
     "brace-expansion": {
       "version": "1.1.11",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
diff --git a/package.json b/package.json
index f1e41cc..20f42fa 100644
--- a/package.json
+++ b/package.json
@@ -6,6 +6,7 @@
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.3.2",
     "@testing-library/user-event": "^7.1.2",
+    "bootstrap": "^4.1.1",
     "moment": "^2.24.0",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
diff --git a/src/App.js b/src/App.js
index 76d86d2..1d14b53 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,8 +1,7 @@
-import React from 'react';
-import logo from './logo.svg';
-import './App.css';
-import timelineData from './data/timeline.json';
-import Timeline from './components/Timeline';
+import React from "react";
+import "./App.css";
+import timelineData from "./data/timeline.json";
+import Timeline from "./components/Timeline";
 
 function App() {
   console.log(timelineData);
@@ -11,10 +10,11 @@ function App() {
   return (
     <div className="App">
       <header className="App-header">
-        <h1 className="App-title">Application title</h1>
-      </header>
+        <h1 className="App-title"> Ada LoveLace Social Media Feed! </h1>{" "}
+      </header>{" "}
       <main className="App-main">
-      </main>
+        <Timeline events={timelineData.events} />
+      </main>{" "}
     </div>
   );
 }
diff --git a/src/components/Timeline.js b/src/components/Timeline.js
index 463eb3e..6b1bdf9 100644
--- a/src/components/Timeline.js
+++ b/src/components/Timeline.js
@@ -1,10 +1,23 @@
-import React from 'react';
-import './Timeline.css';
-import TimelineEvent from './TimelineEvent';
+import React from "react";
+import "./Timeline.css";
+import TimelineEvent from "./TimelineEvent";
 
-const Timeline = () => {
-  
-  return;
-}
+const Timeline = (props) => {
+  return (
+    <div>
+      {props.events.map((event) => {
+        return (
+          <TimelineEvent
+            className="timeline"
+            person={event.person}
+            status={event.status}
+            timeStamp={event.timeStamp}
+          />
+        );
+      })}
+      ;
+    </div>
+  );
+};
 
-export default Timeline;
\ No newline at end of file
+export default Timeline;
diff --git a/src/components/TimelineEvent.jsx b/src/components/TimelineEvent.jsx
new file mode 100644
index 0000000..977c626
--- /dev/null
+++ b/src/components/TimelineEvent.jsx
@@ -0,0 +1,18 @@
+import React from "react";
+import "./TimelineEvent.css";
+import Timestamp from "./Timestamp";
+import { render } from "@testing-library/react";
+
+const TimelineEvent = (props) => {
+  return (
+    <div className="timeline-event">
+      <h3 className="event-time">
+        <Timestamp time={props.timeStamp} />
+      </h3>
+      <h3 className="event-person">{props.person}</h3>
+      <p className="event-status">{props.status}</p>
+    </div>
+  );
+};
+
+export default TimelineEvent;
diff --git a/src/index.js b/src/index.js
index 87d1be5..fd17691 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,12 +1,13 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import './index.css';
-import App from './App';
-import * as serviceWorker from './serviceWorker';
+import React from "react";
+import ReactDOM from "react-dom";
+import "./index.css";
+import App from "./App";
+import * as serviceWorker from "./serviceWorker";
+import "bootstrap/dist/css/bootstrap.css";
 
-ReactDOM.render(<App />, document.getElementById('root'));
+ReactDOM.render( < App / > , document.getElementById("root"));
 
 // If you want your app to work offline and load faster, you can change
 // unregister() to register() below. Note this comes with some pitfalls.
 // Learn more about service workers: https://bit.ly/CRA-PWA
-serviceWorker.unregister();
+serviceWorker.unregister();
\ No newline at end of file