displaying 'geek's-experience' in dashboard, by new Component-Experience

frontend/src/components/dashboard/Experience.js

@@ -0,0 +1,39 @@
+import React, { Component } from "react";
+import { connect } from "react-redux";
+import { withRouter } from "react-router-dom";
+import PropTypes from "prop-types";
+
+class Experience extends Component {
+  render() {
+    const experience = this.props.experience.map(exp => (
+      <tr key={exp._id}>
+        <td>{exp.company}</td>
+        <td>{exp.title}</td>
+        <td>
+          {exp.from} - {exp.to}
+        </td>
+        <td>
+          <button className="btn btn-danger"> Delete </button>
+        </td>
+      </tr>
+    ));
+    return (
+      <div>
+        <h4 className="mb-4"> Your Experience Details</h4>
+
+        <table className="table">
+          <thead>
+            <tr>
+              <th>Company</th>
+              <th>Title</th>
+              <th>Years</th>
+            </tr>
+            {experience}
+          </thead>
+        </table>
+      </div>
+    );
+  }
+}
+
+export default connect(null)(withRouter(Experience));

frontend/src/components/dashboard/dashboard.js

@@ -5,6 +5,7 @@ import { Link } from "react-router-dom";
 import { getCurrentProfile, deleteAccount } from "../../actions/profileActions";
 import Spinner from "../common/Spinner";
 import ProfileActions from "./ProfileActions";
+import Experience from "./Experience";
 
 class Dashboard extends Component {
   componentDidMount() {
@@ -33,8 +34,7 @@ class Dashboard extends Component {
               Welcome <Link to={`/profile/${profile.handle}`}>{user.name}</Link>
             </p>
             <ProfileActions />
-            {/* todo- exp and eductn */}
-
+            <Experience experience={profile.experience} />
             <div style={{ marginBottom: "60px" }} />
             <button
               onClick={this.onDeleteClick.bind(this)}