[add]: DetailManageStudent.jsx 구현을 위한 경로, api 추가

frontend/src/App.jsx

@@ -6,6 +6,7 @@ import Assignment from "./pages/generation/Assignment";
 import Deposit from "./pages/generation/Deposit";
 import Intro from "./Intro";
 import Admin from "./pages/admin/Admin";
+import DetailManageStudent from "./pages/admin/DetailManageStudent.jsx";
 import ManageStudent from "./pages/admin/ManageStudent.jsx";
 import ManageTask from "./pages/admin/ManageTask.jsx";
 import AttendanceCode from "./pages/admin/AttendanceCode";
@@ -68,6 +69,14 @@ function App() {
             </RequireAdmin>
           }
         />
+        <Route
+          path="/managestudent/detail/:studentId"
+          element={
+            <RequireAdmin>
+              <DetailManageStudent />
+            </RequireAdmin>
+          }
+        />
         <Route
           path="/managetask"
           element={

frontend/src/api/students.js

@@ -6,3 +6,13 @@ export const getStudentsByName = async (name) => {
   });
   return res.data; // [{ id: ..., name: ... }]
 };
+
+export const getStudentDetail = async (studentId) => {
+  try {
+    const res = await api.get(`/admin/managestudent/${studentId}`);
+    return res.data;
+  } catch (error) {
+    console.error("학생 상세 정보 불러오기 실패:", error);
+    throw error;
+  }
+};

frontend/src/pages/admin/DetailManageStudent.jsx

@@ -0,0 +1,47 @@
+import { useParams } from "react-router-dom";
+import { useEffect, useState } from "react";
+import Header from "../../components/Header";
+import style from "./DetailManageStudent.module.css";
+import { getStudentDetail } from "../../api/students";
+
+const DetailManageStudent = () => {
+  const { studentId } = useParams();
+  const [student, setStudent] = useState(null);
+
+  useEffect(() => {
+    const fetchStudent = async () => {
+      try {
+        const data = await getStudentDetail(studentId);
+        setStudent(data);
+      } catch (err) {
+        console.error("학생 상세 정보 불러오기 실패:", err);
+      }
+    };
+
+    fetchStudent();
+  }, [studentId]);
+
+  if (!student) return <div>loading...</div>;
+
+  return (
+    <div className={style.managestudent_wrapper}>
+      <Header />
+      <div className={style.under_header}>
+        <div className={style.student_card}>
+          <h2>{student.name}</h2>
+          <p>잔여 보증금: {student.deposit}원</p>
+          <p>보증금 방어권: {student.defence}</p>
+        </div>
+
+        <div className={style.assignment_list}>
+          {student.assignmentTitles.map((title, idx) => (
+            <button key={idx} className={style.assignment_button}>
+              {title}
+            </button>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+};
+export default DetailManageStudent;

frontend/src/pages/admin/DetailManageStudent.module.css

@@ -0,0 +1,11 @@
+.managestudent_wrapper {
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  align-items: center;
+}
+.under_header {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}

frontend/src/pages/admin/ManageStudent.jsx

@@ -1,4 +1,5 @@
 import { useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
 import { getStudentsByName } from "../../api/students";
 import Header from "../../components/Header";
 import InputBlock from "../../components/InputBlock";
@@ -8,6 +9,7 @@ const ManageStudent = () => {
   const [studentName, setStudentName] = useState([""]);
   const [page, setPage] = useState(1);
   const [students, setStudents] = useState([]); // 서버 데이터 저장
+  const navigate = useNavigate();
 
   const studentsPerPage = 6;
 
@@ -54,7 +56,11 @@ const ManageStudent = () => {
         />
         <div className={style.student_list}>
           {paginatedStudents.map((student, index) => (
-            <button key={student.id || index} className={style.student_button}>
+            <button
+              key={student.id || index}
+              className={style.student_button}
+              onClick={() => navigate(`/managestudent/detail/${student.id}`)}
+            >
               {student.name} <span>&gt;</span>
             </button>
           ))}

frontend/src/pages/admin/ManageStudent.module.css

@@ -25,6 +25,9 @@
   text-align: left;
   font-size: 16px;
   width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
 }
 .student_button:hover {
   border: 1px solid #39ff14;