From 0a88dfb547c42e95393be9d01cc426f8d0a70139 Mon Sep 17 00:00:00 2001
From: june <wnsgmlb501@naver.com>
Date: Tue, 20 May 2025 23:19:42 +0900
Subject: [PATCH] done

---
 src/App.js                                   |  2 +-
 src/components/StaffProfile/StaffProfile.jsx | 10 +++++++---
 src/components/UserProfile/UserProfile.jsx   | 18 ++++++++++++++++--
 src/page/HomePage.jsx                        |  8 +++-----
 src/page/StaffPage.jsx                       | 11 +++++++++--
 5 files changed, 36 insertions(+), 13 deletions(-)

diff --git a/src/App.js b/src/App.js
index c0acf5b..43bf294 100644
--- a/src/App.js
+++ b/src/App.js
@@ -4,7 +4,7 @@ import StaffPage from "./page/StaffPage";
 /* 여기에 Page들을 import 한 후 하나 씩 확인!! */
 
 const App = () => {
-  return <div></div>;
+  return <StaffPage/>;
 };
 
 export default App;
diff --git a/src/components/StaffProfile/StaffProfile.jsx b/src/components/StaffProfile/StaffProfile.jsx
index 88825d9..2fd7b17 100644
--- a/src/components/StaffProfile/StaffProfile.jsx
+++ b/src/components/StaffProfile/StaffProfile.jsx
@@ -1,8 +1,12 @@
-import React from "react";
 import "./StaffProfile.css";
 
-const StaffProfile = () => {
-  return <div></div>;
+const StaffProfile = ({ name, part }) => {
+  return (
+    <div className="staff-card">
+      <p> 이름: {name}</p>
+      <p>파트: {part}</p>
+    </div>
+  );
 };
 
 export default StaffProfile;
diff --git a/src/components/UserProfile/UserProfile.jsx b/src/components/UserProfile/UserProfile.jsx
index e5ef1e1..78aa2ea 100644
--- a/src/components/UserProfile/UserProfile.jsx
+++ b/src/components/UserProfile/UserProfile.jsx
@@ -1,7 +1,21 @@
-import React from "react";
 import "./UserProfile.css";
 import lionImage from "./lion.jpeg";
 
-const UserProfile = () => {};
+
+const UserProfile = ({ name, age, major }) => {
+  return (
+    <div className="profile-card">
+      <img src={lionImage} className="profile-img"/>
+      <div className="profile-top">
+      <div className="profile-info">
+        
+        <p>이름: {name}</p>
+        <p>나이: {age}</p>
+        <p>학과: {major}</p>
+        </div>
+      </div>
+    </div>
+  );
+};
 
 export default UserProfile;
diff --git a/src/page/HomePage.jsx b/src/page/HomePage.jsx
index 1501d38..bd11245 100644
--- a/src/page/HomePage.jsx
+++ b/src/page/HomePage.jsx
@@ -1,11 +1,9 @@
-import UserProfile from "../components/UserProfile/UserProfile";
+import UserProfile from "../components/UserProfile/UserProfile.jsx";
 
 const HomePage = () => {
   return (
-    <div>
-      <UserProfile />
-    </div>
+      <UserProfile name ="박준희" age="25" major="컴퓨터공학과"/>
   );
 };
 
-export default HomePage;
+export default HomePage;
\ No newline at end of file
diff --git a/src/page/StaffPage.jsx b/src/page/StaffPage.jsx
index 54e68bc..5cf4f42 100644
--- a/src/page/StaffPage.jsx
+++ b/src/page/StaffPage.jsx
@@ -1,4 +1,5 @@
 import React from "react";
+import StaffProfile from "../components/StaffProfile/StaffProfile.jsx";
 
 const StaffPage = () => {
   const staffs = [
@@ -8,7 +9,13 @@ const StaffPage = () => {
     { name: "Yerin", part: "FE_홍보" },
   ];
 
-  return <div></div>;
+  return (
+    <div className="staff-card-list">
+      {staffs.map((staff, index) => (
+        <StaffProfile key={index} name={staff.name} part={staff.part} />
+      ))}
+    </div>
+  );
 };
 
-export default StaffPage;
+export default StaffPage;
\ No newline at end of file