페이지라우트-설정

client/src/app/auth/forgot-password/page.tsx

@@ -0,0 +1,13 @@
+type Props = {};
+import { nameOfApp } from "@/const/brand";
+import { Metadata } from "next";
+
+export const metaData: Metadata = {
+  title: `${nameOfApp} | 비밀번호 재설정`,
+};
+
+const ForgotPasswordPage = (props: Props) => {
+  return <div>비밀번호 재설정 페이지</div>;
+};
+
+export default ForgotPasswordPage;

client/src/app/auth/signup/page.tsx

@@ -0,0 +1,109 @@
+"use client";
+import Avatar from "@mui/material/Avatar";
+import Button from "@mui/material/Button";
+import CssBaseline from "@mui/material/CssBaseline";
+import TextField from "@mui/material/TextField";
+import FormControlLabel from "@mui/material/FormControlLabel";
+import Checkbox from "@mui/material/Checkbox";
+
+import Grid from "@mui/material/Grid";
+import Box from "@mui/material/Box";
+import LockOutlinedIcon from "@mui/icons-material/LockOutlined";
+import Typography from "@mui/material/Typography";
+import Container from "@mui/material/Container";
+import { SIGNIN } from "@/const/clientPath";
+import Link from "next/link";
+
+export default function SignUpPage() {
+  return (
+    <Container component="main" maxWidth="xs">
+      <CssBaseline />
+      <Box
+        sx={{
+          marginTop: 8,
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "center",
+        }}
+      >
+        <Avatar sx={{ m: 1, bgcolor: "secondary.main" }}>
+          <LockOutlinedIcon />
+        </Avatar>
+        <Typography variant="h1">Sign up</Typography>
+        <Box component="form" noValidate sx={{ mt: 3 }}>
+          <Grid container spacing={2}>
+            <Grid item xs={12}>
+              <TextField
+                required
+                fullWidth
+                id="email"
+                label="이메일"
+                name="email"
+                autoComplete="email"
+              />
+            </Grid>
+            <Grid item xs={12}>
+              <TextField
+                required
+                fullWidth
+                name="password"
+                label="비밀번호"
+                type="password"
+                id="password"
+                autoComplete="new-password"
+              />
+            </Grid>
+            <Grid item xs={12} sm={6}>
+              <TextField
+                name="userId"
+                required
+                fullWidth
+                id="userId"
+                label="유저 아이디"
+                autoFocus
+              />
+            </Grid>
+            <Grid item xs={12} sm={6}>
+              <TextField
+                required
+                fullWidth
+                id="nickname"
+                label="닉네임"
+                name="nickname"
+              />
+            </Grid>
+            <Grid item xs={12}>
+              <FormControlLabel
+                control={<Checkbox value="allowExtraEmails" color="primary" />}
+                label="유용한 정보를 받아볼게요."
+              />
+            </Grid>
+          </Grid>
+          <Button
+            type="submit"
+            fullWidth
+            variant="contained"
+            sx={{ mt: 3, mb: 2 }}
+          >
+            회원가입
+          </Button>
+          <Grid container justifyContent="flex-end">
+            <Grid item>
+              <Link href={SIGNIN}>
+                <Typography variant="label">
+                  Already have an account?{" "}
+                  <Typography
+                    variant="label"
+                    sx={{ color: "primary", fontWeight: "bold" }}
+                  >
+                    Sign in
+                  </Typography>
+                </Typography>
+              </Link>
+            </Grid>
+          </Grid>
+        </Box>
+      </Box>
+    </Container>
+  );
+}

client/src/app/post/[userId]/[postId]/page.tsx

@@ -0,0 +1,16 @@
+const PostDetailPage = ({
+  params,
+}: {
+  params: { userId: string; postId: string };
+}) => {
+  const parsedUserId = params.userId.slice(1, params.userId.length);
+  const parsedPostId = params.postId.slice(1, params.postId.length);
+  return (
+    <div>
+      userId:{parsedUserId}
+      <br /> postId:{parsedPostId}
+    </div>
+  );
+};
+
+export default PostDetailPage;

client/src/app/post/page.tsx

@@ -0,0 +1,5 @@
+const page = () => {
+  return <div>모든 포스트를 보는 페이지</div>;
+};
+
+export default page;

client/src/app/user/[userId]/page.tsx

@@ -0,0 +1,5 @@
+const page = ({ params }: { params: { userId: string } }) => {
+  return <div>{params.userId}님의 page 입니다</div>;
+};
+
+export default page;

client/src/app/user/page.tsx

@@ -0,0 +1,8 @@
+
+const MyPage = () => {
+  return (
+    <div>page</div>
+  )
+}
+
+export default MyPage

client/src/app/wiki/page.tsx

@@ -0,0 +1,5 @@
+const WikiPage = () => {
+  return <div>위키 메인페이지</div>;
+};
+
+export default WikiPage;

client/src/components/NavigationBar.tsx

@@ -11,12 +11,13 @@ import SearchIcon from "~/assets/icons/SearchIcon.svg";
 import PostIcon from "~/assets/icons/PostIcon.svg";
 import BeverageIcon from "~/assets/icons/BeverageIcon.svg";
 import MyIcon from "~/assets/icons/MyIcon.svg";
+import HOME, { MY_PROFILE, WIKI } from "@/const/clientPath";
 
 const NavbarData = [
   {
     iconComponent: <img src={HomeIcon.src} />,
     label: "홈",
-    href: "/",
+    href: HOME,
   },
   {
     iconComponent: <img src={SearchIcon.src} />,
@@ -29,10 +30,12 @@ const NavbarData = [
   {
     iconComponent: <img src={BeverageIcon.src} />,
     label: "술과사전",
+    href: WIKI,
   },
   {
     iconComponent: <img src={MyIcon.src} />,
     label: "내 정보",
+    href: MY_PROFILE,
   },
 ];
 

client/src/const/clientPath.ts

@@ -1,9 +1,23 @@
 const HOME = "/" as const;
-
-export const SIGNIN = "/user/login" as const;
-
-export const SIGNUP = "/user/signup" as const;
-
-export const FORGOTPASSWORD = "/user/forgot-password" as const;
+/**
+ * 로그인 페이지 라우트
+ */
+export const SIGNIN = "/auth/login" as const;
+/**
+ * 회원가입 페이지 라우트
+ */
+export const SIGNUP = "/auth/signup" as const;
+/**
+ * 비밀번호 재설정페이지 라우트
+ */
+export const FORGOTPASSWORD = "/auth/forgot-password" as const;
+/**
+ * 로그인 했을 경우만 접근 가능한 마이페이지
+ */
+export const MY_PROFILE = "/user" as const
+/**
+ * 술과사전 페이지 라우트
+ */
+export const WIKI = "/wiki" as const
 
 export default HOME;