From 63207565f298687afbdd0ef093c60ea82330a9fe Mon Sep 17 00:00:00 2001
From: Mijin Sim <80371353+azure-553@users.noreply.github.com>
Date: Thu, 4 Jan 2024 20:49:09 +0900
Subject: [PATCH] =?UTF-8?q?fix=20:=20=EB=AA=A8=EB=93=A0=20=ED=8C=8C?=
 =?UTF-8?q?=EC=9D=BC=EC=9D=98=20=EA=B5=AC=EC=A1=B0,=20=ED=8F=B4=EB=8D=94?=
 =?UTF-8?q?=EB=AA=85=20=EC=BD=94=EB=93=9C=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.js                                    |   7 +-
 src/Component/Announcement/an.jsx             |  12 ---
 src/Component/Project/pj.jsx                  |  20 -----
 src/Component/Project/style.js                |  51 -------------
 src/Component/Sign/Signpage.jsx               |  36 ---------
 src/Component/router/index.jsx                |  34 ---------
 src/Project/Project.jsx                       |  64 ----------------
 src/api/index.js                              |  32 ++++++++
 src/{ => assets/font}/Inter.ttf               | Bin
 src/axios/index.js                            |  33 --------
 src/common/GlobalStyle.jsx                    |   2 +-
 .../Blog/Blogpage.jsx                         |   0
 src/{Component => components}/Blog/style.js   |   0
 .../CreateBoard/CreateBoardpage.jsx           |   0
 .../CreateBoard/style.js                      |   0
 .../Login/Loginpage.jsx                       |   0
 src/{Component => components}/Login/style.js  |   0
 .../Mainpage/Mainpg.jsx                       |   0
 .../Mainpage/style.js                         |   0
 src/{Component => components}/Member/mb.jsx   |   0
 src/{Component => components}/Member/style.js |   0
 src/components/Notice/index.jsx               |  12 +++
 .../style1.js => components/Notice/style.js}  |   0
 src/components/Project/Project.jsx            |  71 ++++++++++++++++++
 src/{ => components}/Project/style.js         |   0
 src/components/Sign/Signpage.jsx              |  36 +++++++++
 src/{Component => components}/Sign/style.js   |   0
 src/{Component => components}/Team/Teampg.jsx |   0
 src/{Component => components}/Team/style.js   |   0
 .../imgslider/imgslider.jsx                   |   0
 .../imgslider/style.js                        |   0
 src/{Component => components}/navbar.js       |   0
 src/components/router/index.jsx               |  33 ++++++++
 src/index.js                                  |  13 ++--
 src/pages/Blog/Blog.jsx                       |   2 +-
 src/pages/CreateBoard.js                      |   4 +-
 src/pages/Login/Login.jsx                     |   9 +--
 src/pages/Mainpage/Mainpage.jsx               |   4 +-
 src/pages/Notfound.jsx                        |  12 +--
 src/pages/ReadBoard.js                        |   4 +-
 src/pages/Sign/Sign.jsx                       |   8 +-
 41 files changed, 214 insertions(+), 285 deletions(-)
 delete mode 100644 src/Component/Announcement/an.jsx
 delete mode 100644 src/Component/Project/pj.jsx
 delete mode 100644 src/Component/Project/style.js
 delete mode 100644 src/Component/Sign/Signpage.jsx
 delete mode 100644 src/Component/router/index.jsx
 delete mode 100644 src/Project/Project.jsx
 create mode 100644 src/api/index.js
 rename src/{ => assets/font}/Inter.ttf (100%)
 delete mode 100644 src/axios/index.js
 rename src/{Component => components}/Blog/Blogpage.jsx (100%)
 rename src/{Component => components}/Blog/style.js (100%)
 rename src/{Component => components}/CreateBoard/CreateBoardpage.jsx (100%)
 rename src/{Component => components}/CreateBoard/style.js (100%)
 rename src/{Component => components}/Login/Loginpage.jsx (100%)
 rename src/{Component => components}/Login/style.js (100%)
 rename src/{Component => components}/Mainpage/Mainpg.jsx (100%)
 rename src/{Component => components}/Mainpage/style.js (100%)
 rename src/{Component => components}/Member/mb.jsx (100%)
 rename src/{Component => components}/Member/style.js (100%)
 create mode 100644 src/components/Notice/index.jsx
 rename src/{Component/Announcement/style1.js => components/Notice/style.js} (100%)
 create mode 100644 src/components/Project/Project.jsx
 rename src/{ => components}/Project/style.js (100%)
 create mode 100644 src/components/Sign/Signpage.jsx
 rename src/{Component => components}/Sign/style.js (100%)
 rename src/{Component => components}/Team/Teampg.jsx (100%)
 rename src/{Component => components}/Team/style.js (100%)
 rename src/{Component => components}/imgslider/imgslider.jsx (100%)
 rename src/{Component => components}/imgslider/style.js (100%)
 rename src/{Component => components}/navbar.js (100%)
 create mode 100644 src/components/router/index.jsx

diff --git a/src/App.js b/src/App.js
index 407b1a7..3c58a7b 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,7 +1,6 @@
-import React from 'react';
-import { BrowserRouter } from 'react-router-dom';
-import Routers from './Component/router';
-import './App.css';
+import React from "react";
+import { BrowserRouter } from "react-router-dom";
+import Routers from "./components/router";
 
 function App() {
   return (
diff --git a/src/Component/Announcement/an.jsx b/src/Component/Announcement/an.jsx
deleted file mode 100644
index b1bd8dc..0000000
--- a/src/Component/Announcement/an.jsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import React, { useState } from 'react';
-import * as S from "./style1";
-
-const App = () => {
-  return (
-    <S.ProjectContainer id="공지사항">
-        <S.Projects>DevCoop 공지사항</S.Projects>
-    </S.ProjectContainer>
-  );
-};
-
-export default App;
diff --git a/src/Component/Project/pj.jsx b/src/Component/Project/pj.jsx
deleted file mode 100644
index 332558e..0000000
--- a/src/Component/Project/pj.jsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import React from "react";
-import * as S from "./style";
-import Aripay from "../../image/AriPay.svg";
-
-const TeamSection = () => {
-  return (
-    <S.ProjectContainer id="프로젝트">
-      <S.Project>저희의 프로젝트에요.</S.Project>
-      <S.AripaySVG>
-        <a href="http://pay.bsm-aripay.kr/" target="_blank">
-          <img src={Aripay} alt="AriPay 이미지" />
-          <div className="overlay-button"></div>
-        </a>
-      </S.AripaySVG>
-
-    </S.ProjectContainer>
-  );
-};
-
-export default TeamSection;
diff --git a/src/Component/Project/style.js b/src/Component/Project/style.js
deleted file mode 100644
index c90ff2d..0000000
--- a/src/Component/Project/style.js
+++ /dev/null
@@ -1,51 +0,0 @@
-import styled from "styled-components";
-
-export const ProjectContainer = styled.div`
-  padding: 100px 0;
-  background: #fff;
-  text-align: right;
-  position: relative;
-`;
-
-export const PJ = styled.div`
-  color: #000;
-  font-family: Inter;
-  font-size: 40px;
-  font-style: normal;
-  font-weight: 700;
-  line-height: 30px;
-  margin-right: 360px;
-  text-align: left;
-`;
-
-export const Project = styled(PJ)`
-  margin-top: 100px;
-  position: relative;
-  left: 290px;
-  text-align: left;
-`;
-
-export const AripaySVG = styled.div`
-  position: relative;
-  top: 0;
-  transform: translateX(-50%);
-  transform: scale(0.8);
-  width: 1400px;
-  height: auto;
-  preserveAspectRatio: none;
-  overflow: hidden;
-  .overlay-button {
-    position: absolute;
-    top: 270px;
-    left: 960px;
-    width: 340px;
-    height: 100px;
-    background-color: transparent;
-    
-    cursor: pointer;
-    z-index: 2;
-  }
-  img {
-    z-index: 1;
-  }
-}`
diff --git a/src/Component/Sign/Signpage.jsx b/src/Component/Sign/Signpage.jsx
deleted file mode 100644
index 37a3fa2..0000000
--- a/src/Component/Sign/Signpage.jsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import React from "react";
-import * as S from "./style";
-import chick from "../../assets/DevCoopL.svg";
-import NavBar from "../navbar";
-
-function Sign() {
-  return (
-    <S.Body>
-    <NavBar />
-    <S.LoginWrapper>
-      <S.ChickenImage src={chick} alt="chicken image" />
-      <S.H2>Dev Coop</S.H2>
-      <form method="post" id="Login-form">
-        <S.Input type="text" name="userName" placeholder="이메일" />
-        <br />
-        <S.Input type="password" name="userPassword" placeholder="비밀번호" />
-        <br />
-        <S.Input
-          type="password check"
-          name="userPasswordcheck"
-          placeholder="비밀번호 확인"
-        />
-        <br />
-        <br />
-        <S.LoginButton type="submit" id="login" value="회원가입" />
-        <br></br>
-      </form>
-      <S.Text>
-        이미 계정이 있다면?<S.StyledLink to="/Login">로그인</S.StyledLink>
-      </S.Text>
-    </S.LoginWrapper>
-    </S.Body>
-  );
-}
-
-export default Sign;
diff --git a/src/Component/router/index.jsx b/src/Component/router/index.jsx
deleted file mode 100644
index 80925a2..0000000
--- a/src/Component/router/index.jsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from 'react';
-import { Routes, Route } from 'react-router-dom';
-import Main from '../../pages/Mainpage/Mainpage';
-import Login from '../../pages/Login/Login';
-import Sign from '../../pages/Sign/Sign';
-
-import NotFound from '../../pages/Notfound';
-
-import Blog from '../../pages/Blog/Blog';
-import ReadBoard from '../../pages/ReadBoard';
-import CreateBoard from '../../pages/CreateBoard';
-import Paging from '../../pages/Paging';
-import Project from '../../Project/Project';
-// import Modal from "./pages/modal";
-
-const Routers = () => {
-  return (
-    <Routes>
-      <Route path="/" element={<Main />} />
-      <Route path="/main" element={<Main />} />
-      <Route path="/*" element={<NotFound />} />
-      <Route path="/Blog" element={<Blog />} />
-      <Route path="/CreateBoard" element={<CreateBoard />} />
-      <Route path="/CreateBoard/:id" element={<CreateBoard />} />
-      <Route path="/Paging" element={<Paging />} />
-      <Route path="/Login" element={<Login />} />
-      <Route path="/Sign" element={<Sign />} />
-      <Route path="/Project" element={<Project />} />
-      <Route path="/ReadBoard/:id" element={<ReadBoard />} />
-    </Routes>
-  );
-};
-
-export default Routers;
diff --git a/src/Project/Project.jsx b/src/Project/Project.jsx
deleted file mode 100644
index e1af5fc..0000000
--- a/src/Project/Project.jsx
+++ /dev/null
@@ -1,64 +0,0 @@
-import '../App.css';
-import project1 from "../P1.png"
-import project2 from "../P2.png"
-import project3 from "../P3.png"
-import ari from "../AriPayL_ver2.svg"
-import { Link } from "react-router-dom";
-import React from 'react';
-import NavBar from '../Component/navbar';
-import ari2 from "../image/AriPay2.svg";
-import * as S from "./style";
-
-function Project() {
-  return ( 
-  <><NavBar /><div class="pro1-wrap">
-      <div class="ar2"><img id="ariii" src={ari} alt="ari image"></img></div>
-      <div class="headline-text">
-        <p>
-          <p class="head">실물상품권을 학생증으로</p>
-          <p id="head1">아리페이</p>
-        </p>
-      </div>
-      <div class="pro1-text">
-        <p><p class="text1">편리한 잔액 조회</p>
-          알이와 편하게 잔액을 조회해 보세요.<br></br>
-          남은 돈은 알이가 보관해 두니<br></br>
-          5000원의 강박을 지킬 필요 없어요.</p>
-      </div>
-      <div class="pro1-image">
-        <img id="pro1" src={project1} alt="project1 image"></img>
-      </div>
-
-      <div class="pro2-text">
-        <p><p class="text2">어디에서든 가능한 로그 조회</p>
-          언제, 어디서든 아리페이에 들어와<br></br>
-          빠른 사용 내역을 확인 해보세요.<br></br>
-          내가 언제, 얼마나 사용했는 지 알 수 있어요.</p>
-      </div>
-      <div class="pro2-image">
-        <img id="pro2" src={project2} alt="project2 image"></img>
-      </div>
-      <div class="pro3-text">
-        <p><p class="text3">쉽고 빠른 결제</p>
-          학생증 하나만 제시해 주세요.<br></br>
-          카드나 현급을 꺼낼 필요도, 상품권을 낼 필요도 없어요.<br></br>
-          더욱이, 학번 이름을 부를 필요도요!</p>
-      </div>
-      <div class="pro3-image">
-        <img id="pro3" src={project3} alt="project3 image"></img>
-      </div>
-
-
-      <S.AripaySVG>
-        <a href="http://pay.bsm-aripay.kr/" target="_blank">
-          <img src={ari2} alt="AriPay 이미지" />
-          <div className="overlay-button"></div>
-        </a>
-      </S.AripaySVG>
-
-
-    </div></>
-  );
-}
-
-export default Project;
\ No newline at end of file
diff --git a/src/api/index.js b/src/api/index.js
new file mode 100644
index 0000000..2db5b54
--- /dev/null
+++ b/src/api/index.js
@@ -0,0 +1,32 @@
+import axios from "axios";
+
+export const axiosInstance = axios.create({
+  baseURL: `http://localhost:5000/api`,
+  headers: {
+    "Content-Type": "application/json",
+  },
+  withCredentials: true, // 이렇게 설정하면 요청시에 자동으로 쿠키가 포함됩니다.
+});
+
+// Response interceptor: Handle token renewals.
+axiosInstance.interceptors.response.use(
+  function (response) {
+    return response;
+  },
+  async function (error) {
+    if (error.response && error.response.status === 403) {
+      const { access, refresh } = error.response.data;
+
+      // If a new access or refresh token is provided, just retry the request.
+      if (access || refresh) {
+        return axiosInstance.request(error.config);
+      }
+
+      // If no tokens are provided, it's likely an authentication error.
+    }
+
+    return Promise.reject(error);
+  }
+);
+
+export default axiosInstance;
diff --git a/src/Inter.ttf b/src/assets/font/Inter.ttf
similarity index 100%
rename from src/Inter.ttf
rename to src/assets/font/Inter.ttf
diff --git a/src/axios/index.js b/src/axios/index.js
deleted file mode 100644
index 3913b9b..0000000
--- a/src/axios/index.js
+++ /dev/null
@@ -1,33 +0,0 @@
-import axios from "axios";
-
-export const axiosInstance = axios.create({
-    baseURL: `http://localhost:5000/api`,
-    headers: {
-        "Content-Type": "application/json",
-    },
-    withCredentials: true  // 이렇게 설정하면 요청시에 자동으로 쿠키가 포함됩니다.
-});
-
-// Response interceptor: Handle token renewals.
-axiosInstance.interceptors.response.use(
-    function (response) {
-        return response;
-    },
-    async function (error) {
-        if (error.response && error.response.status === 403) {
-            const { access, refresh } = error.response.data;
-
-            // If a new access or refresh token is provided, just retry the request.
-            if (access || refresh) {
-                return axiosInstance.request(error.config);
-            }
-
-            // If no tokens are provided, it's likely an authentication error.
-        }
-
-        return Promise.reject(error);
-    }
-);
-
-
-export default axiosInstance;
\ No newline at end of file
diff --git a/src/common/GlobalStyle.jsx b/src/common/GlobalStyle.jsx
index 4652d02..a895419 100644
--- a/src/common/GlobalStyle.jsx
+++ b/src/common/GlobalStyle.jsx
@@ -2,7 +2,7 @@ import { createGlobalStyle } from "styled-components";
 
 export const GlobalStyle = createGlobalStyle`
   body {
-    backgroundcolor: #000
+    background-color: #000
   }
 
   li,ol {
diff --git a/src/Component/Blog/Blogpage.jsx b/src/components/Blog/Blogpage.jsx
similarity index 100%
rename from src/Component/Blog/Blogpage.jsx
rename to src/components/Blog/Blogpage.jsx
diff --git a/src/Component/Blog/style.js b/src/components/Blog/style.js
similarity index 100%
rename from src/Component/Blog/style.js
rename to src/components/Blog/style.js
diff --git a/src/Component/CreateBoard/CreateBoardpage.jsx b/src/components/CreateBoard/CreateBoardpage.jsx
similarity index 100%
rename from src/Component/CreateBoard/CreateBoardpage.jsx
rename to src/components/CreateBoard/CreateBoardpage.jsx
diff --git a/src/Component/CreateBoard/style.js b/src/components/CreateBoard/style.js
similarity index 100%
rename from src/Component/CreateBoard/style.js
rename to src/components/CreateBoard/style.js
diff --git a/src/Component/Login/Loginpage.jsx b/src/components/Login/Loginpage.jsx
similarity index 100%
rename from src/Component/Login/Loginpage.jsx
rename to src/components/Login/Loginpage.jsx
diff --git a/src/Component/Login/style.js b/src/components/Login/style.js
similarity index 100%
rename from src/Component/Login/style.js
rename to src/components/Login/style.js
diff --git a/src/Component/Mainpage/Mainpg.jsx b/src/components/Mainpage/Mainpg.jsx
similarity index 100%
rename from src/Component/Mainpage/Mainpg.jsx
rename to src/components/Mainpage/Mainpg.jsx
diff --git a/src/Component/Mainpage/style.js b/src/components/Mainpage/style.js
similarity index 100%
rename from src/Component/Mainpage/style.js
rename to src/components/Mainpage/style.js
diff --git a/src/Component/Member/mb.jsx b/src/components/Member/mb.jsx
similarity index 100%
rename from src/Component/Member/mb.jsx
rename to src/components/Member/mb.jsx
diff --git a/src/Component/Member/style.js b/src/components/Member/style.js
similarity index 100%
rename from src/Component/Member/style.js
rename to src/components/Member/style.js
diff --git a/src/components/Notice/index.jsx b/src/components/Notice/index.jsx
new file mode 100644
index 0000000..456410b
--- /dev/null
+++ b/src/components/Notice/index.jsx
@@ -0,0 +1,12 @@
+import React from "react";
+import * as S from "./style";
+
+const Notice = () => {
+  return (
+    <S.ProjectContainer id="공지사항">
+      <S.Projects>DevCoop 공지사항</S.Projects>
+    </S.ProjectContainer>
+  );
+};
+
+export default Notice;
diff --git a/src/Component/Announcement/style1.js b/src/components/Notice/style.js
similarity index 100%
rename from src/Component/Announcement/style1.js
rename to src/components/Notice/style.js
diff --git a/src/components/Project/Project.jsx b/src/components/Project/Project.jsx
new file mode 100644
index 0000000..4844d9f
--- /dev/null
+++ b/src/components/Project/Project.jsx
@@ -0,0 +1,71 @@
+// import "../App.css";
+// import project1 from "../P1.png";
+// import project2 from "../P2.png";
+// import project3 from "../P3.png";
+// import ari from "../AriPayL_ver2.svg";
+import React from "react";
+import NavBar from "../navbar";
+// import ari2 from "../image/AriPay2.svg";
+import * as S from "./style";
+
+function Project() {
+  return (
+    <>
+      <NavBar />
+      <div class="pro1-wrap">
+        <div class="ar2">
+          {/* <img id="ariii" src={ari} alt="ari image"></img> */}
+        </div>
+        <div class="headline-text">
+          <p>
+            <p class="head">실물상품권을 학생증으로</p>
+            <p id="head1">아리페이</p>
+          </p>
+        </div>
+        <div class="pro1-text">
+          <p>
+            <p class="text1">편리한 잔액 조회</p>
+            알이와 편하게 잔액을 조회해 보세요.<br></br>
+            남은 돈은 알이가 보관해 두니<br></br>
+            5000원의 강박을 지킬 필요 없어요.
+          </p>
+        </div>
+        <div class="pro1-image">
+          {/* <img id="pro1" src={project1} alt="project1 image"></img> */}
+        </div>
+
+        <div class="pro2-text">
+          <p>
+            <p class="text2">어디에서든 가능한 로그 조회</p>
+            언제, 어디서든 아리페이에 들어와<br></br>
+            빠른 사용 내역을 확인 해보세요.<br></br>
+            내가 언제, 얼마나 사용했는 지 알 수 있어요.
+          </p>
+        </div>
+        <div class="pro2-image">
+          {/* <img id="pro2" src={project2} alt="project2 image"></img> */}
+        </div>
+        <div class="pro3-text">
+          <p>
+            <p class="text3">쉽고 빠른 결제</p>
+            학생증 하나만 제시해 주세요.<br></br>
+            카드나 현급을 꺼낼 필요도, 상품권을 낼 필요도 없어요.<br></br>
+            더욱이, 학번 이름을 부를 필요도요!
+          </p>
+        </div>
+        <div class="pro3-image">
+          {/* <img id="pro3" src={project3} alt="project3 image"></img> */}
+        </div>
+
+        <S.AripaySVG>
+          <a href="http://pay.bsm-aripay.kr/" target="_blank">
+            {/* <img src={ari2} alt="AriPay 이미지" /> */}
+            <div className="overlay-button"></div>
+          </a>
+        </S.AripaySVG>
+      </div>
+    </>
+  );
+}
+
+export default Project;
diff --git a/src/Project/style.js b/src/components/Project/style.js
similarity index 100%
rename from src/Project/style.js
rename to src/components/Project/style.js
diff --git a/src/components/Sign/Signpage.jsx b/src/components/Sign/Signpage.jsx
new file mode 100644
index 0000000..11ff28d
--- /dev/null
+++ b/src/components/Sign/Signpage.jsx
@@ -0,0 +1,36 @@
+import React from "react";
+import * as S from "./style";
+import chick from "../../assets/DevCoopL.svg";
+import NavBar from "../navbar";
+
+function Sign() {
+  return (
+    <S.Body>
+      <NavBar />
+      <S.LoginWrapper>
+        <S.ChickenImage src={chick} alt="chicken image" />
+        <S.H2>Dev Coop</S.H2>
+        <form method="post" id="Login-form">
+          <S.Input type="text" name="userName" placeholder="이메일" />
+          <br />
+          <S.Input type="password" name="userPassword" placeholder="비밀번호" />
+          <br />
+          <S.Input
+            type="password check"
+            name="userPasswordcheck"
+            placeholder="비밀번호 확인"
+          />
+          <br />
+          <br />
+          <S.LoginButton type="submit" id="login" value="회원가입" />
+          <br></br>
+        </form>
+        <S.Text>
+          이미 계정이 있다면?<S.StyledLink to="/Login">로그인</S.StyledLink>
+        </S.Text>
+      </S.LoginWrapper>
+    </S.Body>
+  );
+}
+
+export default Sign;
diff --git a/src/Component/Sign/style.js b/src/components/Sign/style.js
similarity index 100%
rename from src/Component/Sign/style.js
rename to src/components/Sign/style.js
diff --git a/src/Component/Team/Teampg.jsx b/src/components/Team/Teampg.jsx
similarity index 100%
rename from src/Component/Team/Teampg.jsx
rename to src/components/Team/Teampg.jsx
diff --git a/src/Component/Team/style.js b/src/components/Team/style.js
similarity index 100%
rename from src/Component/Team/style.js
rename to src/components/Team/style.js
diff --git a/src/Component/imgslider/imgslider.jsx b/src/components/imgslider/imgslider.jsx
similarity index 100%
rename from src/Component/imgslider/imgslider.jsx
rename to src/components/imgslider/imgslider.jsx
diff --git a/src/Component/imgslider/style.js b/src/components/imgslider/style.js
similarity index 100%
rename from src/Component/imgslider/style.js
rename to src/components/imgslider/style.js
diff --git a/src/Component/navbar.js b/src/components/navbar.js
similarity index 100%
rename from src/Component/navbar.js
rename to src/components/navbar.js
diff --git a/src/components/router/index.jsx b/src/components/router/index.jsx
new file mode 100644
index 0000000..9c2931b
--- /dev/null
+++ b/src/components/router/index.jsx
@@ -0,0 +1,33 @@
+import React from "react";
+import { Routes, Route } from "react-router-dom";
+import Main from "../../pages/Mainpage/Mainpage";
+import Login from "../../pages/Login/Login";
+import Sign from "../../pages/Sign/Sign";
+
+import NotFound from "../../pages/Notfound";
+
+import Blog from "../../pages/Blog/Blog";
+import ReadBoard from "../../pages/ReadBoard";
+import CreateBoard from "../../pages/CreateBoard";
+import Paging from "../../pages/Paging";
+import Project from "../Project/Project";
+
+const Routers = () => {
+  return (
+    <Routes>
+      <Route path="/" element={<Main />} />
+      <Route path="/main" element={<Main />} />
+      <Route path="/*" element={<NotFound />} />
+      <Route path="/blog" element={<Blog />} />
+      <Route path="/createboard" element={<CreateBoard />} />
+      <Route path="/createboard/:id" element={<CreateBoard />} />
+      <Route path="/paging" element={<Paging />} />
+      <Route path="/login" element={<Login />} />
+      <Route path="/sign" element={<Sign />} />
+      <Route path="/project" element={<Project />} />
+      <Route path="/readboard/:id" element={<ReadBoard />} />
+    </Routes>
+  );
+};
+
+export default Routers;
diff --git a/src/index.js b/src/index.js
index d563c0f..73c7844 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,10 +1,11 @@
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import './index.css';
-import App from './App';
-import reportWebVitals from './reportWebVitals';
+import React from "react";
+import ReactDOM from "react-dom/client";
+import "./index.css";
+import App from "./App";
+import reportWebVitals from "./reportWebVitals";
+
+const root = ReactDOM.createRoot(document.getElementById("root"));
 
-const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(
   <React.StrictMode>
     <App />
diff --git a/src/pages/Blog/Blog.jsx b/src/pages/Blog/Blog.jsx
index 2cc839a..a370c81 100644
--- a/src/pages/Blog/Blog.jsx
+++ b/src/pages/Blog/Blog.jsx
@@ -1,5 +1,5 @@
 import React from "react";
-import Blogpg from "../../Component/Blog/Blogpage";
+import Blogpg from "../../components/Blog/Blogpage";
 
 export default function Mainpage() {
   return (
diff --git a/src/pages/CreateBoard.js b/src/pages/CreateBoard.js
index 7adb980..782a1f0 100644
--- a/src/pages/CreateBoard.js
+++ b/src/pages/CreateBoard.js
@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import "../Styles/CreateBoard.css";
 import Modal from "react-modal";
 import checkpopup from "../assets/mini_image.png";
-import Navbar from "../Component/navbar";
+import Navbar from "../components/navbar";
 import { useNavigate, useParams } from "react-router-dom";
 
 import { axiosInstance } from "../util/axios";
@@ -19,7 +19,7 @@ function CreateBoard() {
   const getBoard = async () => {
     try {
       const res = await axiosInstance.get(
-        `http://10.129.57.6:5000/api/blog/${id}`,
+        `http://10.129.57.6:5000/api/blog/${id}`
       );
       setTitle(res.data.title);
       setDetail(res.data.detail);
diff --git a/src/pages/Login/Login.jsx b/src/pages/Login/Login.jsx
index 93b637e..732a5ac 100644
--- a/src/pages/Login/Login.jsx
+++ b/src/pages/Login/Login.jsx
@@ -1,11 +1,10 @@
-import React from 'react'
-import Loginpg from '../../Component/Login/Loginpage'
+import React from "react";
+import Loginpg from "../../components/Login/Loginpage";
 
 export default function Mainpage() {
-  
   return (
     <>
-    <Loginpg/>
+      <Loginpg />
     </>
-  )
+  );
 }
diff --git a/src/pages/Mainpage/Mainpage.jsx b/src/pages/Mainpage/Mainpage.jsx
index 0d68dba..9661a37 100644
--- a/src/pages/Mainpage/Mainpage.jsx
+++ b/src/pages/Mainpage/Mainpage.jsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import Main from '../../Component/Mainpage/Mainpg';
+import React from "react";
+import Main from "../../components/Mainpage/Mainpg";
 
 export default function Mainpage() {
   return (
diff --git a/src/pages/Notfound.jsx b/src/pages/Notfound.jsx
index 79e7d2b..605597b 100644
--- a/src/pages/Notfound.jsx
+++ b/src/pages/Notfound.jsx
@@ -1,11 +1,7 @@
-import React from 'react';
+import React from "react";
 
 const Notfound = () => {
-    return (
-        <div>
-            404 Error
-        </div>
-    );
+  return <div>404 Error</div>;
 };
-  
-export default Notfound;
\ No newline at end of file
+
+export default Notfound;
diff --git a/src/pages/ReadBoard.js b/src/pages/ReadBoard.js
index ff6ad4c..4990b35 100644
--- a/src/pages/ReadBoard.js
+++ b/src/pages/ReadBoard.js
@@ -4,7 +4,7 @@ import { useNavigate, useParams } from "react-router-dom";
 import "../Styles/ReadBoard.css";
 import Modal from "react-modal";
 import checkpopup from "../assets/mini_image.png";
-import Navbar from "../Component/navbar";
+import Navbar from "../components/navbar";
 
 function ReadBoard() {
   const { id } = useParams();
@@ -36,7 +36,7 @@ function ReadBoard() {
   const getBoard = async () => {
     try {
       const res = await axiosInstance.get(
-        `http://10.129.57.6:5000/api/blog/${id}`,
+        `http://10.129.57.6:5000/api/blog/${id}`
       );
       setBoard(res.data);
     } catch (err) {
diff --git a/src/pages/Sign/Sign.jsx b/src/pages/Sign/Sign.jsx
index 8f82b65..8b05efc 100644
--- a/src/pages/Sign/Sign.jsx
+++ b/src/pages/Sign/Sign.jsx
@@ -1,10 +1,10 @@
-import React from 'react'
-import Sign from '../../Component/Sign/Signpage'
+import React from "react";
+import Sign from "../../components/Sign/Signpage";
 
 export default function Mainpage() {
   return (
     <>
-    <Sign/>
+      <Sign />
     </>
-  )
+  );
 }