Modal component 실험 중

client/src/components/ScheduleModal.js

+const ScheduleModal = () => {
+    return (
+        <div className="modal" id="scheduleModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="scheduleModalLabel" aria-hidden="true">
+            <div className="modal-dialog modal-dialog-centered modal-dialog-scrollable">
+                <div className="modal-content">
+                    <div className="modal-header">
+                        <h5 className="modal-title" id="scheduleModalLabel">Modal title</h5>
+                        <button type="button" className="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                    </div>
+                    <div className="modal-body">
+                        ...
+                    </div>
+                </div>
+            </div>
+        </div>
+    )
+}
+
+export default ScheduleModal
\ No newline at end of file

client/src/pages/SchedulePage.js

 import Menu from "../components/Menu/Menu.js";
 import HomeBtn from "../components/Buttons/HomeBtn.js";
 import EditBtn from "../components/Buttons/EditBtn.js";
+import ScheduleModal from "../components/ScheduleModal.js";
 
 const SchedulePage = () => {
     return (
         <>
             <Menu />
             <HomeBtn />
+            <button type="button" className="btn btn-primary" data-bs-toggle="modal" data-bs-target="#scheduleModal">
+                Launch demo modal
+                <ScheduleModal />
+            </button>
             <EditBtn pathname="schedule/edit" />
         </>
     )