+
+ {/* Header */}
+
+
+
+ {/* Main */}
+
+
+
+ {/* Footer */}
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission1/src/layouts/ProtectedLayout.tsx b/week05/Plat/mission1/src/layouts/ProtectedLayout.tsx
new file mode 100644
index 0000000..f471295
--- /dev/null
+++ b/week05/Plat/mission1/src/layouts/ProtectedLayout.tsx
@@ -0,0 +1,16 @@
+import { useAuth } from "../context/AuthContext"
+import { Navigate, Outlet } from "react-router-dom";
+
+const ProtectedLayout = () => {
+ const { accessToken } = useAuth();
+
+ if(!accessToken){
+ return
+
+ MyApp
+
+
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission1/src/pages/LoginPage.tsx b/week05/Plat/mission1/src/pages/LoginPage.tsx
new file mode 100644
index 0000000..8bcd38f
--- /dev/null
+++ b/week05/Plat/mission1/src/pages/LoginPage.tsx
@@ -0,0 +1,61 @@
+import { useAuth } from "../context/AuthContext";
+import { useForm } from "../hooks/useForm";
+import { validateSignin, type UserSignInformation } from "../utils/validate";
+import { Link } from "react-router-dom";
+
+export default function LoginPage() {
+ const { login } = useAuth();
+ const { values, errors, touched, getInputProps } =
+ useForm
+
+ {/* 타이틀 */}
+
+ Welcome
++ Please choose an option below +
+ + {/* 버튼 영역 */} +
+
+ Login
+
+
+
+ Sign Up
+
+
+
+ My Page
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission1/src/pages/Mypage.tsx b/week05/Plat/mission1/src/pages/Mypage.tsx
new file mode 100644
index 0000000..44b498b
--- /dev/null
+++ b/week05/Plat/mission1/src/pages/Mypage.tsx
@@ -0,0 +1,76 @@
+import { useEffect, useState } from "react";
+import { getMyInfo } from "../apis/auth";
+import { type ResponseMyInfoDto } from "../types/auth";
+import { useAuth } from "../context/AuthContext";
+import { useNavigate } from "react-router-dom";
+
+const MyPage = () => {
+ const [data, setData] = useState
+ Sign up |
+ My
+
+
+
+ {errors?.email && touched?.email && (
+
+ {errors.email}
+ )} + + {errors?.password && touched?.password && ( +{errors.password}
+ )} + +
+
+ );
+ }
+
+ return (
+
+
+ Loading...
+
+
+ );
+};
+
+export default MyPage;
\ No newline at end of file
diff --git a/week05/Plat/mission1/src/pages/NotFoundPage.tsx b/week05/Plat/mission1/src/pages/NotFoundPage.tsx
new file mode 100644
index 0000000..36bbb32
--- /dev/null
+++ b/week05/Plat/mission1/src/pages/NotFoundPage.tsx
@@ -0,0 +1,25 @@
+import { Link } from "react-router-dom";
+
+export default function NotFoundPage() {
+ return (
+
+
+
+
+
+
+ {data.data?.name?.charAt(0).toUpperCase()}
+
+
+ My Page
+Your profile information
+
+
+
+
+
+
+
+ Nickname
++ {data.data?.name} +
+
+ Email
+
+ + {data.data?.email} +
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission1/src/pages/SignupPage.tsx b/week05/Plat/mission1/src/pages/SignupPage.tsx
new file mode 100644
index 0000000..c302b7d
--- /dev/null
+++ b/week05/Plat/mission1/src/pages/SignupPage.tsx
@@ -0,0 +1,120 @@
+import { z } from 'zod';
+import { useForm, type SubmitHandler } from 'react-hook-form';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { postSignup } from '../apis/auth';
+import { Link } from 'react-router-dom';
+
+const schema = z.object({
+ email: z
+ .string()
+ .email({ message: 'Invalid email address' }),
+
+ password: z
+ .string()
+ .min(8, { message: 'Password must be at least 8 characters' })
+ .max(20, { message: 'Password must be at most 20 characters' }),
+
+ passwordCheck: z
+ .string()
+ .min(8, { message: 'Password must be at least 8 characters' })
+ .max(20, { message: 'Password must be at most 20 characters' }),
+
+ name: z
+ .string()
+ .min(1, { message: 'Name is required' }),
+})
+.refine((data) => data.password === data.passwordCheck, {
+ message: "Passwords do not match",
+ path: ['passwordCheck'],
+});
+
+type FormFields = z.infer404
+ ++ 페이지를 찾을 수 없습니다 +
+ ++ 요청하신 페이지가 존재하지 않거나 잘못된 경로입니다. +
+ + + 홈으로 돌아가기 + +
+
+ );
+}
+
+export default SignupPage;
\ No newline at end of file
diff --git a/week05/Plat/mission1/src/types/auth.ts b/week05/Plat/mission1/src/types/auth.ts
new file mode 100644
index 0000000..9fc47d7
--- /dev/null
+++ b/week05/Plat/mission1/src/types/auth.ts
@@ -0,0 +1,44 @@
+import type { CommonResponse } from "./common";
+
+//Signup
+export type RequestSignupDto = {
+ name: string;
+ email: string;
+ bio?: string;
+ avatar?: string;
+ password: string;
+};
+
+export type ResponseSignupDto = CommonResponse<{
+ id: number;
+ name: string;
+ email: string;
+ bio: string | null;
+ avatar: string | null;
+ createAt: Date;
+ updateAt: Date;
+}>;
+
+//Login
+export type RequestSigninDto = {
+ email: string;
+ password: string;
+}
+
+export type ResponseSigninDto = CommonResponse<{
+ id: number;
+ name: string;
+ accessToken: string;
+ refreshToken: string;
+}>
+
+// My Data Join
+export type ResponseMyInfoDto = CommonResponse<{
+ id: number;
+ name: string;
+ email: string;
+ bio: string | null;
+ avatar: string | null;
+ createAt: Date;
+ updateAt: Date;
+}>
\ No newline at end of file
diff --git a/week05/Plat/mission1/src/types/common.ts b/week05/Plat/mission1/src/types/common.ts
new file mode 100644
index 0000000..aa8a9fd
--- /dev/null
+++ b/week05/Plat/mission1/src/types/common.ts
@@ -0,0 +1,6 @@
+export type CommonResponse
+ Sign in |
+ My
+
+
+
+ {errors.email && (
+
+ {errors.email.message}
+ )}
+
+ {errors.password && (
+ {errors.password.message}
+ )}
+
+ {errors.passwordCheck && (
+ {errors.passwordCheck.message}
+ )}
+
+ {errors.name && (
+ {errors.name.message}
+ )}
+
+
+
+ {/* Header */}
+
+
+
+ {/* Main */}
+
+
+
+ {/* Footer */}
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission2/src/layouts/ProtectedLayout.tsx b/week05/Plat/mission2/src/layouts/ProtectedLayout.tsx
new file mode 100644
index 0000000..f471295
--- /dev/null
+++ b/week05/Plat/mission2/src/layouts/ProtectedLayout.tsx
@@ -0,0 +1,16 @@
+import { useAuth } from "../context/AuthContext"
+import { Navigate, Outlet } from "react-router-dom";
+
+const ProtectedLayout = () => {
+ const { accessToken } = useAuth();
+
+ if(!accessToken){
+ return
+
+ MyApp
+
+
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission2/src/pages/LoginPage.tsx b/week05/Plat/mission2/src/pages/LoginPage.tsx
new file mode 100644
index 0000000..8bcd38f
--- /dev/null
+++ b/week05/Plat/mission2/src/pages/LoginPage.tsx
@@ -0,0 +1,61 @@
+import { useAuth } from "../context/AuthContext";
+import { useForm } from "../hooks/useForm";
+import { validateSignin, type UserSignInformation } from "../utils/validate";
+import { Link } from "react-router-dom";
+
+export default function LoginPage() {
+ const { login } = useAuth();
+ const { values, errors, touched, getInputProps } =
+ useForm
+
+ {/* 타이틀 */}
+
+ Welcome
++ Please choose an option below +
+ + {/* 버튼 영역 */} +
+
+ Login
+
+
+
+ Sign Up
+
+
+
+ My Page
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission2/src/pages/Mypage.tsx b/week05/Plat/mission2/src/pages/Mypage.tsx
new file mode 100644
index 0000000..44b498b
--- /dev/null
+++ b/week05/Plat/mission2/src/pages/Mypage.tsx
@@ -0,0 +1,76 @@
+import { useEffect, useState } from "react";
+import { getMyInfo } from "../apis/auth";
+import { type ResponseMyInfoDto } from "../types/auth";
+import { useAuth } from "../context/AuthContext";
+import { useNavigate } from "react-router-dom";
+
+const MyPage = () => {
+ const [data, setData] = useState
+ Sign up |
+ My
+
+
+
+ {errors?.email && touched?.email && (
+
+ {errors.email}
+ )} + + {errors?.password && touched?.password && ( +{errors.password}
+ )} + +
+
+ );
+ }
+
+ return (
+
+
+ Loading...
+
+
+ );
+};
+
+export default MyPage;
\ No newline at end of file
diff --git a/week05/Plat/mission2/src/pages/NotFoundPage.tsx b/week05/Plat/mission2/src/pages/NotFoundPage.tsx
new file mode 100644
index 0000000..36bbb32
--- /dev/null
+++ b/week05/Plat/mission2/src/pages/NotFoundPage.tsx
@@ -0,0 +1,25 @@
+import { Link } from "react-router-dom";
+
+export default function NotFoundPage() {
+ return (
+
+
+
+
+
+
+ {data.data?.name?.charAt(0).toUpperCase()}
+
+
+ My Page
+Your profile information
+
+
+
+
+
+
+
+ Nickname
++ {data.data?.name} +
+
+ Email
+
+ + {data.data?.email} +
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission2/src/pages/SignupPage.tsx b/week05/Plat/mission2/src/pages/SignupPage.tsx
new file mode 100644
index 0000000..c302b7d
--- /dev/null
+++ b/week05/Plat/mission2/src/pages/SignupPage.tsx
@@ -0,0 +1,120 @@
+import { z } from 'zod';
+import { useForm, type SubmitHandler } from 'react-hook-form';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { postSignup } from '../apis/auth';
+import { Link } from 'react-router-dom';
+
+const schema = z.object({
+ email: z
+ .string()
+ .email({ message: 'Invalid email address' }),
+
+ password: z
+ .string()
+ .min(8, { message: 'Password must be at least 8 characters' })
+ .max(20, { message: 'Password must be at most 20 characters' }),
+
+ passwordCheck: z
+ .string()
+ .min(8, { message: 'Password must be at least 8 characters' })
+ .max(20, { message: 'Password must be at most 20 characters' }),
+
+ name: z
+ .string()
+ .min(1, { message: 'Name is required' }),
+})
+.refine((data) => data.password === data.passwordCheck, {
+ message: "Passwords do not match",
+ path: ['passwordCheck'],
+});
+
+type FormFields = z.infer404
+ ++ 페이지를 찾을 수 없습니다 +
+ ++ 요청하신 페이지가 존재하지 않거나 잘못된 경로입니다. +
+ + + 홈으로 돌아가기 + +
+
+ );
+}
+
+export default SignupPage;
\ No newline at end of file
diff --git a/week05/Plat/mission2/src/types/auth.ts b/week05/Plat/mission2/src/types/auth.ts
new file mode 100644
index 0000000..9fc47d7
--- /dev/null
+++ b/week05/Plat/mission2/src/types/auth.ts
@@ -0,0 +1,44 @@
+import type { CommonResponse } from "./common";
+
+//Signup
+export type RequestSignupDto = {
+ name: string;
+ email: string;
+ bio?: string;
+ avatar?: string;
+ password: string;
+};
+
+export type ResponseSignupDto = CommonResponse<{
+ id: number;
+ name: string;
+ email: string;
+ bio: string | null;
+ avatar: string | null;
+ createAt: Date;
+ updateAt: Date;
+}>;
+
+//Login
+export type RequestSigninDto = {
+ email: string;
+ password: string;
+}
+
+export type ResponseSigninDto = CommonResponse<{
+ id: number;
+ name: string;
+ accessToken: string;
+ refreshToken: string;
+}>
+
+// My Data Join
+export type ResponseMyInfoDto = CommonResponse<{
+ id: number;
+ name: string;
+ email: string;
+ bio: string | null;
+ avatar: string | null;
+ createAt: Date;
+ updateAt: Date;
+}>
\ No newline at end of file
diff --git a/week05/Plat/mission2/src/types/common.ts b/week05/Plat/mission2/src/types/common.ts
new file mode 100644
index 0000000..aa8a9fd
--- /dev/null
+++ b/week05/Plat/mission2/src/types/common.ts
@@ -0,0 +1,6 @@
+export type CommonResponse
+ Sign in |
+ My
+
+
+
+ {errors.email && (
+
+ {errors.email.message}
+ )}
+
+ {errors.password && (
+ {errors.password.message}
+ )}
+
+ {errors.passwordCheck && (
+ {errors.passwordCheck.message}
+ )}
+
+ {errors.name && (
+ {errors.name.message}
+ )}
+
+
+
+ {/* Header */}
+
+
+
+ {/* Main */}
+
+
+
+ {/* Footer */}
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission3/src/layouts/ProtectedLayout.tsx b/week05/Plat/mission3/src/layouts/ProtectedLayout.tsx
new file mode 100644
index 0000000..f471295
--- /dev/null
+++ b/week05/Plat/mission3/src/layouts/ProtectedLayout.tsx
@@ -0,0 +1,16 @@
+import { useAuth } from "../context/AuthContext"
+import { Navigate, Outlet } from "react-router-dom";
+
+const ProtectedLayout = () => {
+ const { accessToken } = useAuth();
+
+ if(!accessToken){
+ return
+
+ MyApp
+
+
+
+
+
+
+
+ )
+}
+
+export default GoogleLoginRedirectPage
diff --git a/week05/Plat/mission3/src/pages/HomePage.tsx b/week05/Plat/mission3/src/pages/HomePage.tsx
new file mode 100644
index 0000000..5de7b21
--- /dev/null
+++ b/week05/Plat/mission3/src/pages/HomePage.tsx
@@ -0,0 +1,37 @@
+import { Link } from "react-router-dom";
+
+export default function HomePage() {
+ return (
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission3/src/pages/LoginPage.tsx b/week05/Plat/mission3/src/pages/LoginPage.tsx
new file mode 100644
index 0000000..fbdf1c5
--- /dev/null
+++ b/week05/Plat/mission3/src/pages/LoginPage.tsx
@@ -0,0 +1,97 @@
+import { useAuth } from "../context/AuthContext";
+import { useForm } from "../hooks/useForm";
+import { validateSignin, type UserSignInformation } from "../utils/validate";
+
+export default function LoginPage() {
+ const { login } = useAuth();
+
+ const { values, errors, touched, getInputProps } =
+ useForm
+
+ Welcome
++ Please choose an option below +
+ +
+
+ Login
+
+
+
+ Sign Up
+
+
+
+ My Page
+
+
+
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission3/src/pages/Mypage.tsx b/week05/Plat/mission3/src/pages/Mypage.tsx
new file mode 100644
index 0000000..7f72db8
--- /dev/null
+++ b/week05/Plat/mission3/src/pages/Mypage.tsx
@@ -0,0 +1,84 @@
+import { useEffect, useState } from "react";
+import { getMyInfo } from "../apis/auth";
+import { type ResponseMyInfoDto } from "../types/auth";
+import { useAuth } from "../context/AuthContext";
+import { useNavigate } from "react-router-dom";
+
+const MyPage = () => {
+ const [data, setData] = useState
+
+
+
+
+ Login
++ Sign in to continue +
+
+
+
+
+ {errors?.email && touched?.email && (
+
+
+ {errors.email}
+ )} +
+
+ {errors?.password && touched?.password && (
+
+
+
+
+ {errors.password}
+ )} +
+
+ or
+
+
+
+
+
+
+ );
+ }
+
+ return (
+
+
+ Loading...
+
+
+ );
+};
+
+export default MyPage;
\ No newline at end of file
diff --git a/week05/Plat/mission3/src/pages/NotFoundPage.tsx b/week05/Plat/mission3/src/pages/NotFoundPage.tsx
new file mode 100644
index 0000000..196a745
--- /dev/null
+++ b/week05/Plat/mission3/src/pages/NotFoundPage.tsx
@@ -0,0 +1,43 @@
+import { Link } from "react-router-dom";
+
+export default function NotFoundPage() {
+ return (
+
+
+
+
+
+
+ {data.data?.avatar ? (
+ 
+ ) : (
+ data.data?.name?.charAt(0).toUpperCase()
+ )}
+
+
+ My Page
+Your profile information
+
+
+
+
+
+
+
+ Nickname
++ {data.data?.name} +
+
+ Email
+
+ + {data.data?.email} +
+
+
+ {/* 배경 그라데이션 (은은한 네온 느낌) */}
+
+
+ {/* 컨텐츠 */}
+
+ );
+}
\ No newline at end of file
diff --git a/week05/Plat/mission3/src/pages/SignupPage.tsx b/week05/Plat/mission3/src/pages/SignupPage.tsx
new file mode 100644
index 0000000..b58ebf3
--- /dev/null
+++ b/week05/Plat/mission3/src/pages/SignupPage.tsx
@@ -0,0 +1,144 @@
+import { z } from "zod";
+import { useForm, type SubmitHandler } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { postSignup } from "../apis/auth";
+
+const schema = z
+ .object({
+ email: z.string().email({ message: "Invalid email address" }),
+
+ password: z
+ .string()
+ .min(8, { message: "Password must be at least 8 characters" })
+ .max(20, { message: "Password must be at most 20 characters" }),
+
+ passwordCheck: z
+ .string()
+ .min(8, { message: "Password must be at least 8 characters" })
+ .max(20, { message: "Password must be at most 20 characters" }),
+
+ name: z.string().min(1, { message: "Name is required" }),
+ })
+ .refine((data) => data.password === data.passwordCheck, {
+ message: "Passwords do not match",
+ path: ["passwordCheck"],
+ });
+
+type FormFields = z.infer
+
+ {/* 404 텍스트 (네온 글로우) */}
+
+ + 404 +
+ ++ Page Not Found +
+ ++ The page you are looking for does not exist +
+ + {/* 네온 버튼 */} + + Go Home + +
+
+ );
+};
+
+export default SignupPage;
\ No newline at end of file
diff --git a/week05/Plat/mission3/src/types/auth.ts b/week05/Plat/mission3/src/types/auth.ts
new file mode 100644
index 0000000..9fc47d7
--- /dev/null
+++ b/week05/Plat/mission3/src/types/auth.ts
@@ -0,0 +1,44 @@
+import type { CommonResponse } from "./common";
+
+//Signup
+export type RequestSignupDto = {
+ name: string;
+ email: string;
+ bio?: string;
+ avatar?: string;
+ password: string;
+};
+
+export type ResponseSignupDto = CommonResponse<{
+ id: number;
+ name: string;
+ email: string;
+ bio: string | null;
+ avatar: string | null;
+ createAt: Date;
+ updateAt: Date;
+}>;
+
+//Login
+export type RequestSigninDto = {
+ email: string;
+ password: string;
+}
+
+export type ResponseSigninDto = CommonResponse<{
+ id: number;
+ name: string;
+ accessToken: string;
+ refreshToken: string;
+}>
+
+// My Data Join
+export type ResponseMyInfoDto = CommonResponse<{
+ id: number;
+ name: string;
+ email: string;
+ bio: string | null;
+ avatar: string | null;
+ createAt: Date;
+ updateAt: Date;
+}>
\ No newline at end of file
diff --git a/week05/Plat/mission3/src/types/common.ts b/week05/Plat/mission3/src/types/common.ts
new file mode 100644
index 0000000..aa8a9fd
--- /dev/null
+++ b/week05/Plat/mission3/src/types/common.ts
@@ -0,0 +1,6 @@
+export type CommonResponse
+
+
+
+
+ Sign Up
++ Create your account +
+
+
+
+
+ {errors.email && (
+
+
+ + {errors.email.message} +
+ )} +
+
+ {errors.password && (
+
+
+ + {errors.password.message} +
+ )} +
+
+ {errors.passwordCheck && (
+
+
+ + {errors.passwordCheck.message} +
+ )} +
+
+ {errors.name && (
+
+
+
+ + {errors.name.message} +
+ )} +
+
+
+
+
+
+ Cat YaOh
+
+
+
+
+
+
+ );
+}
+
+type ErrorStateProps = {
+ message?: string;
+ onRetry?: () => void;
+};
+
+export function ErrorState({
+ message = "데이터를 불러오지 못했습니다.",
+ onRetry,
+}: ErrorStateProps) {
+ return (
+
+
+ {message}
+
+
+ );
+}
\ No newline at end of file
diff --git a/week07/Plat/mission1/src/components/Sidebar.tsx b/week07/Plat/mission1/src/components/Sidebar.tsx
new file mode 100644
index 0000000..111a432
--- /dev/null
+++ b/week07/Plat/mission1/src/components/Sidebar.tsx
@@ -0,0 +1,93 @@
+import { Link } from "react-router-dom";
+import { useAuth } from "../context/AuthContext";
+
+type SidebarProps = {
+ isOpen: boolean;
+ onClose: () => void;
+};
+
+export default function Sidebar({ isOpen, onClose }: SidebarProps) {
+ const { accessToken } = useAuth();
+
+ return (
+ <>
+
+
+
+ );
+}
diff --git a/week07/Plat/mission1/src/components/comment/CommentInputBox.tsx b/week07/Plat/mission1/src/components/comment/CommentInputBox.tsx
new file mode 100644
index 0000000..1be34f5
--- /dev/null
+++ b/week07/Plat/mission1/src/components/comment/CommentInputBox.tsx
@@ -0,0 +1,61 @@
+import { useState } from "react";
+import { useCreateCommentMutation } from "../../hooks/mutations/useCommentMutations";
+
+type CommentInputBoxProps = {
+ lpId?: string;
+};
+
+export default function CommentInputBox({ lpId }: CommentInputBoxProps) {
+ const [comment, setComment] = useState("");
+ const createCommentMutation = useCreateCommentMutation(Number(lpId));
+
+ const isInvalid = comment.trim().length === 0;
+
+ const handleCreateComment = async () => {
+ if (!lpId || isInvalid) return;
+
+ await createCommentMutation.mutateAsync({
+ lpId: Number(lpId),
+ body: {
+ content: comment.trim(),
+ },
+ });
+ setComment("");
+ };
+
+ return (
+
+
+ 오류 발생
+{message}
+ + {onRetry && ( + + )} +
+
+
+