Make LinkPage.js

react-whenMeet/src/components/Button.js

-function Button({type,text}){
+function Button({type,text,onClick}){
     return(
         <button
         type = {type}
+        onClick={onClick}
         >
             {text}
         </button>

react-whenMeet/src/routes/HomeMake.js

@@ -40,7 +40,7 @@ function HomeMake() {
                 />
                 <br />
                 <Input
-                    type="text"
+                    type="password"
                     value={password}
                     onChange={onPasswordChange}
                     placeholder="관리용 Password"

react-whenMeet/src/routes/LinkPage.js

-function LinkPage(){
-    return(
-        <h1>LinkPage</h1>
-    );
-}
+import {useState, useEffect} from "react";
+import "../styles/HomeMake.css"
+import Input from "../components/Input";
+import Button from "../components/Button";
+import { useNavigate } from "react-router-dom";
 
-export default LinkPage;
+function LinkPage() {
\ No newline at end of file
+    const [link, setLink] = useState("");
+    const navigate = useNavigate();
+
+    const generateLink = () => {
+        const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+        const linkLength = 10;
+
+        let randomLink = '';
+        for (let i = 0; i < linkLength; i++) {
+            const randomIndex = Math.floor(Math.random() * characters.length);
+            randomLink += characters[randomIndex];
+        }
+        setLink(randomLink);
+    };
+
+    const copyToClipboard = () => {
+        const textField = document.createElement('textarea');
+        textField.innerText = `localhost:3000/UserTimeInfo/${link}`;
+        document.body.appendChild(textField);
+        textField.select();
+        document.execCommand('copy');
+        document.body.removeChild(textField);
+        alert('링크가 복사되었습니다.');
+    };
+
+    const handleSubmit = (event)=>{
+        event.preventDefault();
+        navigate(`/UserTimeInfo/${link}`);
+    }
+    useEffect(()=>{
+        generateLink();
+    },[])
+        return (
+            <div className="center-container">
+                <form onSubmit={handleSubmit}>
+                    <Input
+                    value={`localhost:3000/UserTimeInfo/${link}`}
+                    />
+                    <Button
+                    type= "button"
+                    onClick={copyToClipboard}
+                    text= "링크 복사"
+                    />
+                    <Button
+                    type= "submit"
+                    text = "투표 페이지로 이동"
+                    />
+                </form>
+
+            </div>
+        );
+    }
+
+    export default LinkPage;
\ No newline at end of file

react-whenMeet/src/routes/MeetingInfo.js

@@ -11,7 +11,7 @@ function MeetingInfo() {
     const [endTime, setEndTime] = useState("");
     const navigate = useNavigate();
 
-    const handleOnClick = (event) => {
+    const handleOnChange = (event) => {
         setMeetingPurpose(event.target.value);
     }
     const handleCalendar = (value) => {
@@ -25,7 +25,7 @@ function MeetingInfo() {
     }
     const handleSubmit = (event) => {
         event.preventDefault();
-        if (meetingPurpose === "") {
+        if (meetingPurpose === "" || meetingPurpose === "선택") {
             return alert("목적을 선택하세요");;
         }
         else {
@@ -38,7 +38,8 @@ function MeetingInfo() {
                 <h1>약속 일정 만들기</h1>
                 <label>
                     목적: 
-                    <select value={meetingPurpose} onClick={handleOnClick}>
+                    <select value={meetingPurpose} onChange={handleOnChange}>
+                        <option>선택</option>
                         <option>식사</option>
                         <option>공부</option>
                         <option>놀기</option>