diff --git a/src/App.js b/src/App.js
index 5f4cdf8..141606d 100644
--- a/src/App.js
+++ b/src/App.js
@@ -4,17 +4,16 @@ import timelineData from './data/timeline.json';
import Timeline from './components/Timeline';
+
class App extends Component {
render() {
- console.log(timelineData);
-
- // Customize the code below
return (
- Application title
+ {timelineData["person"]}s Timeline
+
);
diff --git a/src/components/Timeline.js b/src/components/Timeline.js
index 624d4ec..063e088 100644
--- a/src/components/Timeline.js
+++ b/src/components/Timeline.js
@@ -2,9 +2,21 @@ import React from 'react';
import './Timeline.css';
import TimelineEvent from './TimelineEvent';
-const Timeline = () => {
- // Fill in your code here
- return;
+
+const timelineEventComponents = (events) => {
+ return events.map((post, i) => {
+ return (
+
+ )
+ })
+}
+
+const Timeline = (props) => {
+ return (
+
+ { timelineEventComponents(props.events) }
+
+ );
}
-export default Timeline;
+export default Timeline;
\ No newline at end of file
diff --git a/src/components/TimelineEvent.js b/src/components/TimelineEvent.js
index 9079165..590c242 100644
--- a/src/components/TimelineEvent.js
+++ b/src/components/TimelineEvent.js
@@ -2,9 +2,16 @@ import React from 'react';
import './TimelineEvent.css';
import Timestamp from './Timestamp';
-const TimelineEvent = () => {
- // Fill in your code here
- return;
+const TimelineEvent = (props) => {
+ return (
+
+
+ {props.person}
+ {props.status}
+
+
+
+ );
}
-export default TimelineEvent;
+export default TimelineEvent;
\ No newline at end of file