Code: Social Profiles Component

15Dkatz · Oct 19, 2022 · 2d4d453 · 2d4d453
1 parent da51e48
commit 2d4d453
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 0 deletions.
diff --git a/portfolio/src/App.js b/portfolio/src/App.js
@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
 import Projects from './Projects';
+import SocialProfiles from './SocialProfiles';
 
 class App extends Component {
   state = { displayBio: false };
@@ -30,6 +31,8 @@ class App extends Component {
         }
         <hr />
         <Projects />
+        <hr />
+        <SocialProfiles />
       </div>
     ); 
   }

diff --git a/portfolio/src/SocialProfiles.js b/portfolio/src/SocialProfiles.js
@@ -0,0 +1,35 @@
+import React, { Component } from 'react';
+import SOCIAL_PROFILES from './data/socialProfiles';
+
+class SocialProfile extends Component {
+  render() {
+    const { link, image } = this.props.socialProfile;
+
+    return (
+      <span>
+        <a href={link}>
+          <img src={image} alt='social-profile' style={{ width: 35, height: 35, margin: 10 }} />
+        </a>
+      </span>
+    )
+  }
+}
+
+class SocialProfiles extends Component {
+  render() {
+    return (
+      <div>
+        <h2>Connect with me!</h2>
+        <div>
+          {
+            SOCIAL_PROFILES.map(SOCIAL_PROFILE => {
+              return <SocialProfile key={SOCIAL_PROFILE.id} socialProfile={SOCIAL_PROFILE} />;
+            })
+          }
+        </div>
+      </div>
+    )
+  }
+}
+
+export default SocialProfiles;