수저어어엉어어어어ㅓㅇ~~~~~~~~~~~~~~

client/src/App.js

@@ -21,8 +21,8 @@ function App() {
         <Route exact path="/login" component={LoginPage} />
         <Route path="/profile/:id/update" component={InfoUpdatePage} />
         <Route path="/profile/:id" component={ProfilePage} />
+        <Route path="/room/:roomId/main" component={InitRoomPage} />
         <Route path="/room/:roomId/:channelId" component={RoomPage} />
-        <Route path="/room/:roomId" component={InitRoomPage} />
         <Route path="/room/Invite" component={InvitePage} />
       </Switch>
       {/* </AuthProvider> */}

client/src/components/Home/JoinRoom.js

@@ -39,7 +39,7 @@ const JoinRoom = () => {
     if (success) {
         // console.log('success', success)
         alert('룸참여가 완료되었습니다!')
-        window.location.href=`/room/${roomId}/1`
+        window.location.href=`/room/${roomId}/main`
     }
 
     return (

client/src/components/Home/RoomSingle.js

@@ -45,7 +45,7 @@ const RoomSingle = () => {
       {room &&
         room.map((el) => (
           <Link
-            to={`/room/${el.roomId}/${channelId}`}
+            to={`/room/${el.roomId}/main`}
             className="text-decoration-none text-dark"
           >
             <div

client/src/components/Room/ChannelSingle.js

@@ -8,7 +8,7 @@ const ChannelSingle = (props) => {
       <div className="overflow-auto" style={{ height: "610px" }}>
         {props.channel.map((el) => (
           <div className="mb-3">
-            <Link to={`${roomId}/${el.channelName}`}>
+            <Link to={`/room/${roomId}/${el.channelName}`}>
               <div
                 className="m-3 p-1 row"
                 style={{ backgroundColor: "#E0CEE8" }}

client/src/components/Room/InitRoom.js

@@ -15,7 +15,6 @@ const InitRoom = () => {
   const [error, setError] = useState("");
 
   async function getRoom(roomId) {
-        console.log(roomId)
     try {
       const data = await roomApi.getRoom([roomId]);
       setRoom(data[0]);
@@ -23,16 +22,16 @@ const InitRoom = () => {
       catchErrors(error, setError);
     }
   }
-    console.log(room)
 
   useEffect(() => {
-        console.log('roomId확인', roomId)
     getRoom(roomId);
   }, [roomId]);
 
   return (
     <div>
-            <div style={{ backgroundColor: "#262626", width: "auto", height: "2px" }} />
+      <div
+        style={{ backgroundColor: "#262626", width: "auto", height: "2px" }}
+      />
       <form className="flex-row align-items-center justify-content-center m-5">
         <div className="d-flex justify-content-center">
           <img
@@ -44,17 +43,35 @@ const InitRoom = () => {
             }}
           />
         </div>
-                <div className="d-flex justify-content-center mt-3">
-                    <div>
         <div className="row">
-                            <h6 className="col" style={{ text: 'center' }}> 방이름 </h6>
-                            <h4 className="col"> {room.name} </h4>
-                        </div>
-                        <div className="row">
-                            <h6 className="col"> 방코드 </h6>
-                            <h4 className="col"> {room.id} </h4>
-                        </div>
+          <div className="col-3"></div>
+          <div className="col-6 my-5">
+            <h2
+              className="mb-3"
+              style={{ fontSize: "13px", fontWeight: "bold" }}
+            >
+              방 이름
+            </h2>
+            <h2
+              className="mb-4 mt-2"
+              style={{ fontSize: "25px", fontWeight: "bold" }}
+            >
+              {room.name}
+            </h2>
+            <h2
+              className="mb-3 mt-2"
+              style={{ fontSize: "13px", fontWeight: "bold" }}
+            >
+              방 코드
+            </h2>
+            <h2
+              className="mb-3 mt-2"
+              style={{ fontSize: "25px", fontWeight: "bold" }}
+            >
+              {room.id}
+            </h2>
           </div>
+          <div className="col"></div>
         </div>
       </form>
     </div>

server/index.js

@@ -23,21 +23,21 @@ sequelize
       roomNumber : ["1234567abc","abc7654321"],
     });
 
-    await Room.create({
-      id: "1234567abc",
-      name: "room",
-      owner: 8888,
-      member: [8888],
-      profileimg: "defaultimg",
-    });
+    // await Room.create({
+    //   id: "1234567abc",
+    //   name: "room",
+    //   owner: 8888,
+    //   member: [8888],
+    //   profileimg: "defaultimg",
+    // });
 
-    await Room.create({
-      id: "abc7654321",
-      name: "room1",
-      owner: 9999,
-      member: [9999],
-      profileimg: "defaultimg",
-    });
+    // await Room.create({
+    //   id: "abc7654321",
+    //   name: "room1",
+    //   owner: 9999,
+    //   member: [9999],
+    //   profileimg: "defaultimg",
+    // });
 
     app.listen(appConfig.port, () => {
       console.log(`Server is running on port ${appConfig.port}`);