From d2185cf8d9015b22f88b0ea78ddb0fd8b0b909e4 Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Thu, 26 Dec 2024 23:08:48 +0900
Subject: [PATCH 01/11] =?UTF-8?q?refactor:=20=EB=A6=AC=EB=B7=B0=EB=AF=B8?=
 =?UTF-8?q?=20=EB=A1=9C=EA=B3=A0=20=EA=B8=80=EC=9E=90=20=EA=B0=84=EA=B2=A9?=
 =?UTF-8?q?=20=EB=B0=8F=20=ED=81=AC=EA=B8=B0=20=EC=A1=B0=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/layouts/Topbar/components/Logo/styles.ts   | 8 +-------
 1 file changed, 1 insertion(+), 7 deletions(-)

diff --git a/frontend/src/components/layouts/Topbar/components/Logo/styles.ts b/frontend/src/components/layouts/Topbar/components/Logo/styles.ts
index 682e0908d..860d6abea 100644
--- a/frontend/src/components/layouts/Topbar/components/Logo/styles.ts
+++ b/frontend/src/components/layouts/Topbar/components/Logo/styles.ts
@@ -3,17 +3,11 @@ import styled from '@emotion/styled';
 import media from '@/utils/media';
 
 export const Logo = styled.div`
-  line-height: 8rem;
   text-align: center;
 
   span {
-    font-size: 3rem;
+    font-size: 2.8rem;
     font-weight: ${({ theme }) => theme.fontWeight.bolder};
-    letter-spacing: 0.7rem;
-
-    ${media.small} {
-      font-size: 2.8rem;
-    }
 
     ${media.xSmall} {
       font-size: 2.6rem;

From 47e82535e00dd0fbdef22eae7ef75bd56079a879 Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Thu, 26 Dec 2024 23:43:50 +0900
Subject: [PATCH 02/11] =?UTF-8?q?refactor:=20=ED=91=B8=ED=84=B0=EC=97=90?=
 =?UTF-8?q?=20border=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/layouts/Footer/style.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/frontend/src/components/layouts/Footer/style.ts b/frontend/src/components/layouts/Footer/style.ts
index 51c79fd4c..394029288 100644
--- a/frontend/src/components/layouts/Footer/style.ts
+++ b/frontend/src/components/layouts/Footer/style.ts
@@ -21,6 +21,8 @@ export const Footer = styled.footer`
 
   background-color: ${({ theme }) => theme.colors.white};
 
+  border-top: 0.1rem solid ${({ theme }) => theme.colors.lightGray};
+
   ${media.xSmall} {
     flex-direction: column;
     gap: 0.2rem;

From 8580927563f7ae237d412123530ee5e0e5bb22aa Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Fri, 27 Dec 2024 13:48:05 +0900
Subject: [PATCH 03/11] =?UTF-8?q?feat:=20=EB=A6=AC=EB=B7=B0=20=EB=A7=81?=
 =?UTF-8?q?=ED=81=AC=20=EA=B4=80=EB=A6=AC=20=ED=8E=98=EC=9D=B4=EC=A7=80=20?=
 =?UTF-8?q?=EB=A0=88=EC=9D=B4=EC=95=84=EC=9B=83=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ReviewLinkManagementLayout/index.tsx      | 18 +++++++
 .../ReviewLinkManagementLayout/styles.ts      | 48 +++++++++++++++++++
 2 files changed, 66 insertions(+)
 create mode 100644 frontend/src/components/layouts/ReviewLinkManagementLayout/index.tsx
 create mode 100644 frontend/src/components/layouts/ReviewLinkManagementLayout/styles.ts

diff --git a/frontend/src/components/layouts/ReviewLinkManagementLayout/index.tsx b/frontend/src/components/layouts/ReviewLinkManagementLayout/index.tsx
new file mode 100644
index 000000000..885ba0e35
--- /dev/null
+++ b/frontend/src/components/layouts/ReviewLinkManagementLayout/index.tsx
@@ -0,0 +1,18 @@
+import * as S from './styles';
+
+interface ReviewLinkManagementLayoutProps {
+  leftContent: React.ReactNode;
+  rightContent: React.ReactNode;
+}
+
+const ReviewLinkManagementLayout = ({ leftContent, rightContent }: ReviewLinkManagementLayoutProps) => {
+  return (
+    <S.Layout>
+      <S.LeftWrapper>{leftContent}</S.LeftWrapper>
+      <S.Separator />
+      <S.RightWrapper>{rightContent}</S.RightWrapper>
+    </S.Layout>
+  );
+};
+
+export default ReviewLinkManagementLayout;
diff --git a/frontend/src/components/layouts/ReviewLinkManagementLayout/styles.ts b/frontend/src/components/layouts/ReviewLinkManagementLayout/styles.ts
new file mode 100644
index 000000000..db01ad59b
--- /dev/null
+++ b/frontend/src/components/layouts/ReviewLinkManagementLayout/styles.ts
@@ -0,0 +1,48 @@
+import styled from '@emotion/styled';
+
+import media from '@/utils/media';
+
+export const Layout = styled.section`
+  width: 100%;
+
+  display: flex;
+
+  ${media.small} {
+    flex-direction: column;
+
+    padding: 0 3rem;
+  }
+`;
+
+export const LeftWrapper = styled.div`
+  width: 30%;
+
+  padding: 10rem 0;
+
+  ${media.small} {
+    width: 100%;
+  }
+`;
+
+export const Separator = styled.div`
+  width: 0.1rem;
+  min-height: calc(100vh - 13rem); // 전체 영역에서 헤더와 푸터 영역 제외
+
+  background-color: ${({ theme }) => theme.colors.lightGray};
+
+  margin: 0 10rem;
+
+  ${media.small} {
+    display: none;
+  }
+`;
+
+export const RightWrapper = styled.div`
+  width: 70%;
+
+  padding: 10rem 0;
+
+  ${media.small} {
+    width: 100%;
+  }
+`;

From 4ec2fa7b81a8ca2385ad593639264311d0f81d1b Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Thu, 2 Jan 2025 11:47:13 +0900
Subject: [PATCH 04/11] =?UTF-8?q?feat:=20=EB=A6=AC=EB=B7=B0=20=EB=A7=81?=
 =?UTF-8?q?=ED=81=AC=20=EA=B4=80=EB=A6=AC=20=ED=8E=98=EC=9D=B4=EC=A7=80=20?=
 =?UTF-8?q?=EA=B5=AC=ED=98=84=20=EB=B0=8F=20=EB=A0=88=EC=9D=B4=EC=95=84?=
 =?UTF-8?q?=EC=9B=83=20=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ReviewLinkManagementLayout/index.tsx      | 18 -------------
 .../pages/ReviewLinkManagementPage/index.tsx  | 27 +++++++++++++++++++
 .../ReviewLinkManagementPage}/styles.ts       | 22 +++++++++++++--
 frontend/src/pages/index.tsx                  |  1 +
 4 files changed, 48 insertions(+), 20 deletions(-)
 delete mode 100644 frontend/src/components/layouts/ReviewLinkManagementLayout/index.tsx
 create mode 100644 frontend/src/pages/ReviewLinkManagementPage/index.tsx
 rename frontend/src/{components/layouts/ReviewLinkManagementLayout => pages/ReviewLinkManagementPage}/styles.ts (56%)

diff --git a/frontend/src/components/layouts/ReviewLinkManagementLayout/index.tsx b/frontend/src/components/layouts/ReviewLinkManagementLayout/index.tsx
deleted file mode 100644
index 885ba0e35..000000000
--- a/frontend/src/components/layouts/ReviewLinkManagementLayout/index.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import * as S from './styles';
-
-interface ReviewLinkManagementLayoutProps {
-  leftContent: React.ReactNode;
-  rightContent: React.ReactNode;
-}
-
-const ReviewLinkManagementLayout = ({ leftContent, rightContent }: ReviewLinkManagementLayoutProps) => {
-  return (
-    <S.Layout>
-      <S.LeftWrapper>{leftContent}</S.LeftWrapper>
-      <S.Separator />
-      <S.RightWrapper>{rightContent}</S.RightWrapper>
-    </S.Layout>
-  );
-};
-
-export default ReviewLinkManagementLayout;
diff --git a/frontend/src/pages/ReviewLinkManagementPage/index.tsx b/frontend/src/pages/ReviewLinkManagementPage/index.tsx
new file mode 100644
index 000000000..33f72e55a
--- /dev/null
+++ b/frontend/src/pages/ReviewLinkManagementPage/index.tsx
@@ -0,0 +1,27 @@
+import ReviewCard from '@/components/ReviewCard';
+
+import { URLGeneratorForm } from '../HomePage/components';
+
+import * as S from './styles';
+
+const ReviewLinkManagementPage = () => {
+  return (
+    <S.Layout>
+      <S.LeftContainer>
+        <URLGeneratorForm />
+      </S.LeftContainer>
+      <S.Separator />
+      <S.RightContainer>
+        <S.TitleWrapper>
+          <h2>생성한 리뷰 링크를 확인해보세요</h2>
+          <S.SubTitle>클릭하면 해당 프로젝트의 리뷰 목록으로 이동해요</S.SubTitle>
+        </S.TitleWrapper>
+        <S.ReviewLinkList>
+          <ReviewCard createdAt={''} contentPreview={''} categories={[]} handleClick={() => {}} />
+        </S.ReviewLinkList>
+      </S.RightContainer>
+    </S.Layout>
+  );
+};
+
+export default ReviewLinkManagementPage;
diff --git a/frontend/src/components/layouts/ReviewLinkManagementLayout/styles.ts b/frontend/src/pages/ReviewLinkManagementPage/styles.ts
similarity index 56%
rename from frontend/src/components/layouts/ReviewLinkManagementLayout/styles.ts
rename to frontend/src/pages/ReviewLinkManagementPage/styles.ts
index db01ad59b..c9227e443 100644
--- a/frontend/src/components/layouts/ReviewLinkManagementLayout/styles.ts
+++ b/frontend/src/pages/ReviewLinkManagementPage/styles.ts
@@ -14,7 +14,7 @@ export const Layout = styled.section`
   }
 `;
 
-export const LeftWrapper = styled.div`
+export const LeftContainer = styled.div`
   width: 30%;
 
   padding: 10rem 0;
@@ -37,7 +37,11 @@ export const Separator = styled.div`
   }
 `;
 
-export const RightWrapper = styled.div`
+export const RightContainer = styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 3rem;
+
   width: 70%;
 
   padding: 10rem 0;
@@ -46,3 +50,17 @@ export const RightWrapper = styled.div`
     width: 100%;
   }
 `;
+
+export const TitleWrapper = styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0.8rem;
+`;
+
+export const SubTitle = styled.span`
+  color: ${({ theme }) => theme.colors.gray};
+  /* font-size: ${({ theme }) => theme.fontSize.small}; */
+  /* font-weight: ${({ theme }) => theme.fontWeight.semibold}; */
+`;
+
+export const ReviewLinkList = styled.div``;
diff --git a/frontend/src/pages/index.tsx b/frontend/src/pages/index.tsx
index 4dc586d19..7e7a3fe3d 100644
--- a/frontend/src/pages/index.tsx
+++ b/frontend/src/pages/index.tsx
@@ -7,3 +7,4 @@ export { default as ReviewWritingPage } from './ReviewWritingPage';
 export { default as ReviewWritingCompletePage } from './ReviewWritingCompletePage';
 export { default as ReviewZonePage } from './ReviewZonePage';
 export { default as ReviewCollectionPage } from './ReviewCollectionPage';
+export { default as ReviewLinkManagementPage } from './ReviewLinkManagementPage';

From a82450d2d7427ba70174a68b494302ad29e505e9 Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Thu, 2 Jan 2025 11:47:22 +0900
Subject: [PATCH 05/11] =?UTF-8?q?feat:=20=EB=9D=BC=EC=9A=B0=ED=84=B0=20?=
 =?UTF-8?q?=EC=84=A4=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/constants/route.ts | 1 +
 frontend/src/router.tsx         | 2 ++
 2 files changed, 3 insertions(+)

diff --git a/frontend/src/constants/route.ts b/frontend/src/constants/route.ts
index 0826e9ff8..b70105cf2 100644
--- a/frontend/src/constants/route.ts
+++ b/frontend/src/constants/route.ts
@@ -7,4 +7,5 @@ export const ROUTE = {
   detailedReview: 'user/detailed-review',
   reviewZone: 'user/review-zone',
   reviewCollection: 'user/review-collection',
+  reviewLinkManagement: 'user/review-link-management',
 };
diff --git a/frontend/src/router.tsx b/frontend/src/router.tsx
index 0fd64b227..97762f9e7 100644
--- a/frontend/src/router.tsx
+++ b/frontend/src/router.tsx
@@ -10,6 +10,7 @@ const ReviewWritingPage = lazy(() => import('@/pages/ReviewWritingPage'));
 const ReviewZonePage = lazy(() => import('@/pages/ReviewZonePage'));
 const ReviewCollectionPage = lazy(() => import('@/pages/ReviewCollectionPage'));
 const LoadingPage = lazy(() => import('@/pages/LoadingPage'));
+const ReviewLinkManagementPage = lazy(() => import('@/pages/ReviewLinkManagementPage'));
 
 import App from './App';
 import { ErrorSuspenseContainer } from './components';
@@ -52,6 +53,7 @@ const router = createBrowserRouter([
         ),
       },
       { path: `${ROUTE.reviewCollection}/:${ROUTE_PARAM.reviewRequestCode}`, element: <ReviewCollectionPage /> },
+      { path: `${ROUTE.reviewLinkManagement}`, element: <ReviewLinkManagementPage /> },
     ],
   },
 ]);

From bfa7a9df9e16051dfaabf1e451a027ed35c6e470 Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Thu, 2 Jan 2025 19:03:36 +0900
Subject: [PATCH 06/11] =?UTF-8?q?fix:=20Amplitude=20=EB=B0=A9=EB=AC=B8=20?=
 =?UTF-8?q?=EC=9D=B4=EB=B2=A4=ED=8A=B8=EC=97=90=20=EB=A6=AC=EB=B7=B0=20?=
 =?UTF-8?q?=EB=A7=81=ED=81=AC=20=EA=B4=80=EB=A6=AC=20=ED=8E=98=EC=9D=B4?=
 =?UTF-8?q?=EC=A7=80=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/constants/amplitudeEventName.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/src/constants/amplitudeEventName.ts b/frontend/src/constants/amplitudeEventName.ts
index c610d53b7..4c88cee97 100644
--- a/frontend/src/constants/amplitudeEventName.ts
+++ b/frontend/src/constants/amplitudeEventName.ts
@@ -24,6 +24,7 @@ export const PAGE_VISITED_EVENT_NAME: { [key in Exclude<PageName, undefined>]: s
   detailedReview: '[page] 리뷰 상세 보기 페이지',
   reviewWriting: '[page] 리뷰 작성 페이지',
   reviewWritingComplete: '[page] 리뷰 작성 완료 페이지',
+  reviewLinkManagement: '[page] 리뷰 링크 관리 페이지',
 };
 
 export const REVIEW_WRITING_EVENT_NAME = {

From 281b115bd5b5ce05b8fe3328150dee4478300be3 Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Fri, 3 Jan 2025 15:17:25 +0900
Subject: [PATCH 07/11] =?UTF-8?q?refactor:=20ErrorSuspenseContainer?=
 =?UTF-8?q?=EB=A1=9C=20=EA=B0=90=EC=8B=BC=20=ED=9B=84,=20ReviewLinkManagem?=
 =?UTF-8?q?entPage=EC=97=90=EC=84=9C=20ReviewLinkDashboard=EB=A1=9C=20?=
 =?UTF-8?q?=EB=B6=84=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/ReviewLinkDashboard/index.tsx  | 26 +++++++++++++++++++
 .../ReviewLinkDashboard}/styles.ts            |  0
 .../pages/ReviewLinkManagementPage/index.tsx  | 25 +++++-------------
 3 files changed, 32 insertions(+), 19 deletions(-)
 create mode 100644 frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
 rename frontend/src/pages/ReviewLinkManagementPage/{ => components/ReviewLinkDashboard}/styles.ts (100%)

diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
new file mode 100644
index 000000000..1f1336be1
--- /dev/null
+++ b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
@@ -0,0 +1,26 @@
+import { URLGeneratorForm } from '@/pages/HomePage/components';
+
+import * as S from './styles';
+
+const TITLE = '생성한 리뷰 링크를 확인해보세요';
+const SUBTITLE = '클릭하면 해당 프로젝트의 리뷰 목록으로 이동해요';
+
+const ReviewLinkDashboard = () => {
+  return (
+    <S.Layout>
+      <S.LeftContainer>
+        <URLGeneratorForm />
+      </S.LeftContainer>
+      <S.Separator />
+      <S.RightContainer>
+        <S.TitleWrapper>
+          <h2>{TITLE}</h2>
+          <S.SubTitle>{SUBTITLE}</S.SubTitle>
+        </S.TitleWrapper>
+        <S.ReviewLinkList>{/* TODO: ReviewCard 컴포넌트 추가 */}</S.ReviewLinkList>
+      </S.RightContainer>
+    </S.Layout>
+  );
+};
+
+export default ReviewLinkDashboard;
diff --git a/frontend/src/pages/ReviewLinkManagementPage/styles.ts b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
similarity index 100%
rename from frontend/src/pages/ReviewLinkManagementPage/styles.ts
rename to frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
diff --git a/frontend/src/pages/ReviewLinkManagementPage/index.tsx b/frontend/src/pages/ReviewLinkManagementPage/index.tsx
index 33f72e55a..3a06eee29 100644
--- a/frontend/src/pages/ReviewLinkManagementPage/index.tsx
+++ b/frontend/src/pages/ReviewLinkManagementPage/index.tsx
@@ -1,26 +1,13 @@
-import ReviewCard from '@/components/ReviewCard';
+import { ErrorSuspenseContainer } from '@/components';
 
-import { URLGeneratorForm } from '../HomePage/components';
-
-import * as S from './styles';
+import ReviewLinkDashboard from './components/ReviewLinkDashboard';
 
 const ReviewLinkManagementPage = () => {
   return (
-    <S.Layout>
-      <S.LeftContainer>
-        <URLGeneratorForm />
-      </S.LeftContainer>
-      <S.Separator />
-      <S.RightContainer>
-        <S.TitleWrapper>
-          <h2>생성한 리뷰 링크를 확인해보세요</h2>
-          <S.SubTitle>클릭하면 해당 프로젝트의 리뷰 목록으로 이동해요</S.SubTitle>
-        </S.TitleWrapper>
-        <S.ReviewLinkList>
-          <ReviewCard createdAt={''} contentPreview={''} categories={[]} handleClick={() => {}} />
-        </S.ReviewLinkList>
-      </S.RightContainer>
-    </S.Layout>
+    <ErrorSuspenseContainer>
+      {/* TODO: 네비게이션 탭 추가 */}
+      <ReviewLinkDashboard />
+    </ErrorSuspenseContainer>
   );
 };
 

From 45d1585c0a9c0afafb49bcfb870b654a8c8d48bc Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Tue, 7 Jan 2025 14:52:22 +0900
Subject: [PATCH 08/11] =?UTF-8?q?feat:=20ReviewLinkLayout=20=EC=BB=B4?=
 =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=B6=94=EA=B0=80=20=EB=B0=8F=20?=
 =?UTF-8?q?=EB=B0=98=EC=9D=91=ED=98=95=20=EC=8A=A4=ED=83=80=EC=9D=BC=20?=
 =?UTF-8?q?=EC=A0=81=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/URLGeneratorForm/styles.ts     |  2 +-
 .../components/ReviewLinkDashboard/index.tsx  | 30 +++++-----
 .../components/ReviewLinkDashboard/styles.ts  | 58 ++++++++++---------
 .../layouts/ReviewLinkLayout/index.tsx        | 22 +++++++
 .../layouts/ReviewLinkLayout/styles.ts        | 37 ++++++++++++
 5 files changed, 108 insertions(+), 41 deletions(-)
 create mode 100644 frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/index.tsx
 create mode 100644 frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts

diff --git a/frontend/src/pages/HomePage/components/URLGeneratorForm/styles.ts b/frontend/src/pages/HomePage/components/URLGeneratorForm/styles.ts
index 80fcda2fa..a15d87396 100644
--- a/frontend/src/pages/HomePage/components/URLGeneratorForm/styles.ts
+++ b/frontend/src/pages/HomePage/components/URLGeneratorForm/styles.ts
@@ -8,10 +8,10 @@ export const URLGeneratorForm = styled.section`
   justify-content: center;
 
   width: 40%;
-  padding: 0 9rem;
 
   ${media.medium} {
     width: 45%;
+    padding: 0 9rem;
 
     h2 {
       font-size: 2rem;
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
index 1f1336be1..f375e7e30 100644
--- a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
+++ b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
@@ -1,25 +1,27 @@
+import ReviewCard from '@/components/ReviewCard';
 import { URLGeneratorForm } from '@/pages/HomePage/components';
 
-import * as S from './styles';
+import ReviewLinkLayout from '../layouts/ReviewLinkLayout';
 
-const TITLE = '생성한 리뷰 링크를 확인해보세요';
-const SUBTITLE = '클릭하면 해당 프로젝트의 리뷰 목록으로 이동해요';
+import * as S from './styles';
 
 const ReviewLinkDashboard = () => {
   return (
-    <S.Layout>
-      <S.LeftContainer>
+    <S.ReviewLinkDashboardContainer>
+      <S.FormSection>
         <URLGeneratorForm />
-      </S.LeftContainer>
+      </S.FormSection>
       <S.Separator />
-      <S.RightContainer>
-        <S.TitleWrapper>
-          <h2>{TITLE}</h2>
-          <S.SubTitle>{SUBTITLE}</S.SubTitle>
-        </S.TitleWrapper>
-        <S.ReviewLinkList>{/* TODO: ReviewCard 컴포넌트 추가 */}</S.ReviewLinkList>
-      </S.RightContainer>
-    </S.Layout>
+      <S.LinkSection>
+        <ReviewLinkLayout
+          title={'생성한 리뷰 링크를 확인해보세요'}
+          subTitle={'클릭하면 해당 프로젝트의 리뷰 목록으로 이동해요'}
+        >
+          {/* TODO: 생성한 리뷰 링크가 없을 경우, 돋보기 컴포넌트 추가 */}
+          <ReviewCard createdAt={''} contentPreview={''} categories={[]} handleClick={() => {}} />
+        </ReviewLinkLayout>
+      </S.LinkSection>
+    </S.ReviewLinkDashboardContainer>
   );
 };
 
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
index c9227e443..aaf741d98 100644
--- a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
+++ b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
@@ -2,22 +2,39 @@ import styled from '@emotion/styled';
 
 import media from '@/utils/media';
 
-export const Layout = styled.section`
+export const ReviewLinkDashboardContainer = styled.div`
+  display: flex;
+  justify-content: center;
+  gap: 7rem;
+
   width: 100%;
 
-  display: flex;
+  ${media.medium} {
+    gap: 4rem;
+  }
+
+  @media screen and (max-width: 900px) {
+    gap: 2rem;
+  }
 
   ${media.small} {
     flex-direction: column;
-
     padding: 0 3rem;
   }
 `;
 
-export const LeftContainer = styled.div`
-  width: 30%;
+export const FormSection = styled.section`
+  section {
+    width: auto;
+  }
 
-  padding: 10rem 0;
+  padding: 5rem 0;
+
+  ${media.medium} {
+    section {
+      padding: 0;
+    }
+  }
 
   ${media.small} {
     width: 100%;
@@ -26,41 +43,30 @@ export const LeftContainer = styled.div`
 
 export const Separator = styled.div`
   width: 0.1rem;
-  min-height: calc(100vh - 13rem); // 전체 영역에서 헤더와 푸터 영역 제외
+  // 전체 영역에서 헤더(7rem)와 푸터(6rem) 영역 제외하고, 추후 네비게이션 탭이 추가되면 해당 영역도 제외
+  min-height: calc(100vh - 13rem);
 
   background-color: ${({ theme }) => theme.colors.lightGray};
 
-  margin: 0 10rem;
-
   ${media.small} {
     display: none;
   }
 `;
 
-export const RightContainer = styled.div`
+export const LinkSection = styled.section`
   display: flex;
   flex-direction: column;
   gap: 3rem;
 
-  width: 70%;
+  width: 100%;
+
+  padding: 5rem 0;
 
-  padding: 10rem 0;
+  ${media.medium} {
+    width: 50%;
+  }
 
   ${media.small} {
     width: 100%;
   }
 `;
-
-export const TitleWrapper = styled.div`
-  display: flex;
-  flex-direction: column;
-  gap: 0.8rem;
-`;
-
-export const SubTitle = styled.span`
-  color: ${({ theme }) => theme.colors.gray};
-  /* font-size: ${({ theme }) => theme.fontSize.small}; */
-  /* font-weight: ${({ theme }) => theme.fontWeight.semibold}; */
-`;
-
-export const ReviewLinkList = styled.div``;
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/index.tsx b/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/index.tsx
new file mode 100644
index 000000000..b6ca6fee1
--- /dev/null
+++ b/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/index.tsx
@@ -0,0 +1,22 @@
+import { EssentialPropsWithChildren } from '@/types';
+
+import * as S from './styles';
+
+interface ReviewLinkListLayoutProps {
+  title: string;
+  subTitle: string;
+}
+
+const ReviewLinkLayout = ({ title, subTitle, children }: EssentialPropsWithChildren<ReviewLinkListLayoutProps>) => {
+  return (
+    <S.ReviewLinkLayout>
+      <S.TitleWrapper>
+        <S.Title>{title}</S.Title>
+        <S.SubTitle>{subTitle}</S.SubTitle>
+      </S.TitleWrapper>
+      <S.CardList>{children}</S.CardList>
+    </S.ReviewLinkLayout>
+  );
+};
+
+export default ReviewLinkLayout;
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts b/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts
new file mode 100644
index 000000000..3f317915e
--- /dev/null
+++ b/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts
@@ -0,0 +1,37 @@
+import styled from '@emotion/styled';
+
+import media from '@/utils/media';
+
+export const ReviewLinkLayout = styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 4rem;
+`;
+
+export const TitleWrapper = styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 0.8rem;
+`;
+
+export const Title = styled.h2`
+  ${media.medium} {
+    font-size: 2rem;
+  }
+`;
+
+export const SubTitle = styled.span`
+  color: ${({ theme }) => theme.colors.gray};
+`;
+
+export const CardList = styled.ul`
+  display: flex;
+  flex-direction: column;
+  gap: 4rem;
+
+  height: calc(100vh - 34rem);
+
+  overflow-y: auto;
+
+  padding-right: 2rem;
+`;

From e869d386f4edeba972dbade23cd065ac94ff8557 Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Tue, 7 Jan 2025 16:02:59 +0900
Subject: [PATCH 09/11] =?UTF-8?q?feat:=20=EB=AA=A8=EB=B0=94=EC=9D=BC=20?=
 =?UTF-8?q?=ED=99=98=EA=B2=BD=EC=97=90=EC=84=9C=20CardList=EC=9D=98=20max-?=
 =?UTF-8?q?height=EB=A5=BC=20none=EC=9C=BC=EB=A1=9C=20=EC=84=A4=EC=A0=95?=
 =?UTF-8?q?=20=EB=B0=8F=20=EB=B0=98=EC=9D=91=ED=98=95=20=EC=84=B8=EB=B6=80?=
 =?UTF-8?q?=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/ReviewLinkDashboard/styles.ts  | 10 ++++++--
 .../layouts/ReviewLinkLayout/styles.ts        | 24 +++++++++++++++++--
 2 files changed, 30 insertions(+), 4 deletions(-)

diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
index aaf741d98..e73cffa49 100644
--- a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
+++ b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
@@ -19,7 +19,7 @@ export const ReviewLinkDashboardContainer = styled.div`
 
   ${media.small} {
     flex-direction: column;
-    padding: 0 3rem;
+    align-items: center;
   }
 `;
 
@@ -38,6 +38,7 @@ export const FormSection = styled.section`
 
   ${media.small} {
     width: 100%;
+    padding: 0;
   }
 `;
 
@@ -56,6 +57,7 @@ export const Separator = styled.div`
 export const LinkSection = styled.section`
   display: flex;
   flex-direction: column;
+  justify-content: center;
   gap: 3rem;
 
   width: 100%;
@@ -67,6 +69,10 @@ export const LinkSection = styled.section`
   }
 
   ${media.small} {
-    width: 100%;
+    width: 85%;
+  }
+
+  ${media.xSmall} {
+    width: 90%;
   }
 `;
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts b/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts
index 3f317915e..623cbfadc 100644
--- a/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts
+++ b/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts
@@ -18,10 +18,26 @@ export const Title = styled.h2`
   ${media.medium} {
     font-size: 2rem;
   }
+
+  ${media.xSmall} {
+    font-size: 1.8rem;
+  }
+
+  ${media.xxSmall} {
+    font-size: 1.6rem;
+  }
 `;
 
 export const SubTitle = styled.span`
   color: ${({ theme }) => theme.colors.gray};
+
+  ${media.xSmall} {
+    font-size: 1.5rem;
+  }
+
+  ${media.xxSmall} {
+    font-size: 1.3rem;
+  }
 `;
 
 export const CardList = styled.ul`
@@ -29,9 +45,13 @@ export const CardList = styled.ul`
   flex-direction: column;
   gap: 4rem;
 
-  height: calc(100vh - 34rem);
-
+  max-height: calc(100vh - 34rem);
   overflow-y: auto;
 
   padding-right: 2rem;
+
+  ${media.small} {
+    max-height: none;
+    padding-right: 0;
+  }
 `;

From 3202a95bec2be59a88f70fa2a283de351138ee4d Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Tue, 7 Jan 2025 16:48:01 +0900
Subject: [PATCH 10/11] =?UTF-8?q?fix:=20=20ReviewCard=20=EC=BB=B4=ED=8F=AC?=
 =?UTF-8?q?=EB=84=8C=ED=8A=B8=20flex-start=EB=A1=9C=20=EC=83=81=EB=8B=A8?=
 =?UTF-8?q?=20=EC=A0=95=EB=A0=AC=20=EB=B0=8F=20=EC=9C=84=EC=B9=98=20?=
 =?UTF-8?q?=EB=B9=84=EC=9B=8C=EB=91=90=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/ReviewLinkDashboard/index.tsx                 | 5 ++---
 .../components/ReviewLinkDashboard/styles.ts                 | 2 +-
 .../components/layouts/ReviewLinkLayout/styles.ts            | 1 +
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
index f375e7e30..0d06f6774 100644
--- a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
+++ b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
@@ -1,4 +1,3 @@
-import ReviewCard from '@/components/ReviewCard';
 import { URLGeneratorForm } from '@/pages/HomePage/components';
 
 import ReviewLinkLayout from '../layouts/ReviewLinkLayout';
@@ -17,8 +16,8 @@ const ReviewLinkDashboard = () => {
           title={'생성한 리뷰 링크를 확인해보세요'}
           subTitle={'클릭하면 해당 프로젝트의 리뷰 목록으로 이동해요'}
         >
-          {/* TODO: 생성한 리뷰 링크가 없을 경우, 돋보기 컴포넌트 추가 */}
-          <ReviewCard createdAt={''} contentPreview={''} categories={[]} handleClick={() => {}} />
+          {/* TODO: ReviewCard 컴포넌트 추가 및 생성한 리뷰 링크가 없을 경우, 돋보기 컴포넌트 추가 */}
+          <></>
         </ReviewLinkLayout>
       </S.LinkSection>
     </S.ReviewLinkDashboardContainer>
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
index e73cffa49..8d4ab58ae 100644
--- a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
+++ b/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
@@ -57,7 +57,7 @@ export const Separator = styled.div`
 export const LinkSection = styled.section`
   display: flex;
   flex-direction: column;
-  justify-content: center;
+  justify-content: flex-start;
   gap: 3rem;
 
   width: 100%;
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts b/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts
index 623cbfadc..ed8ec571f 100644
--- a/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts
+++ b/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts
@@ -5,6 +5,7 @@ import media from '@/utils/media';
 export const ReviewLinkLayout = styled.div`
   display: flex;
   flex-direction: column;
+
   gap: 4rem;
 `;
 

From c74726160ec8e0ad70c7fba8aad7bed9d014fa9c Mon Sep 17 00:00:00 2001
From: soosoo22 <lllllh00@naver.com>
Date: Thu, 9 Jan 2025 19:51:57 +0900
Subject: [PATCH 11/11] =?UTF-8?q?refactor:=20=EB=A6=AC=EB=B7=B0=20?=
 =?UTF-8?q?=EB=A7=81=ED=81=AC=20=EA=B4=80=EB=A6=AC=20=ED=8E=98=EC=9D=B4?=
 =?UTF-8?q?=EC=A7=80=20=EA=B2=BD=EB=A1=9C=EB=AA=85=20=EB=B0=8F=20=ED=8F=B4?=
 =?UTF-8?q?=EB=8D=94=EB=AA=85=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/constants/amplitudeEventName.ts                  | 2 +-
 frontend/src/constants/route.ts                               | 2 +-
 .../components/ReviewLinkDashboard/index.tsx                  | 4 ++--
 .../components/ReviewLinkDashboard/styles.ts                  | 0
 .../components/layouts/ReviewLinkLayout/index.tsx             | 0
 .../components/layouts/ReviewLinkLayout/styles.ts             | 0
 .../{ReviewLinkManagementPage => ReviewLinkPage}/index.tsx    | 4 ++--
 frontend/src/pages/index.tsx                                  | 2 +-
 frontend/src/router.tsx                                       | 4 ++--
 9 files changed, 9 insertions(+), 9 deletions(-)
 rename frontend/src/pages/{ReviewLinkManagementPage => ReviewLinkPage}/components/ReviewLinkDashboard/index.tsx (81%)
 rename frontend/src/pages/{ReviewLinkManagementPage => ReviewLinkPage}/components/ReviewLinkDashboard/styles.ts (100%)
 rename frontend/src/pages/{ReviewLinkManagementPage => ReviewLinkPage}/components/layouts/ReviewLinkLayout/index.tsx (100%)
 rename frontend/src/pages/{ReviewLinkManagementPage => ReviewLinkPage}/components/layouts/ReviewLinkLayout/styles.ts (100%)
 rename frontend/src/pages/{ReviewLinkManagementPage => ReviewLinkPage}/index.tsx (77%)

diff --git a/frontend/src/constants/amplitudeEventName.ts b/frontend/src/constants/amplitudeEventName.ts
index 4c88cee97..a90ae22e5 100644
--- a/frontend/src/constants/amplitudeEventName.ts
+++ b/frontend/src/constants/amplitudeEventName.ts
@@ -24,7 +24,7 @@ export const PAGE_VISITED_EVENT_NAME: { [key in Exclude<PageName, undefined>]: s
   detailedReview: '[page] 리뷰 상세 보기 페이지',
   reviewWriting: '[page] 리뷰 작성 페이지',
   reviewWritingComplete: '[page] 리뷰 작성 완료 페이지',
-  reviewLinkManagement: '[page] 리뷰 링크 관리 페이지',
+  reviewLinks: '[page] 리뷰 링크 관리 페이지',
 };
 
 export const REVIEW_WRITING_EVENT_NAME = {
diff --git a/frontend/src/constants/route.ts b/frontend/src/constants/route.ts
index b70105cf2..df2fc17fe 100644
--- a/frontend/src/constants/route.ts
+++ b/frontend/src/constants/route.ts
@@ -7,5 +7,5 @@ export const ROUTE = {
   detailedReview: 'user/detailed-review',
   reviewZone: 'user/review-zone',
   reviewCollection: 'user/review-collection',
-  reviewLinkManagement: 'user/review-link-management',
+  reviewLinks: 'user/review-links',
 };
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx b/frontend/src/pages/ReviewLinkPage/components/ReviewLinkDashboard/index.tsx
similarity index 81%
rename from frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
rename to frontend/src/pages/ReviewLinkPage/components/ReviewLinkDashboard/index.tsx
index 0d06f6774..aaf99ed0c 100644
--- a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/index.tsx
+++ b/frontend/src/pages/ReviewLinkPage/components/ReviewLinkDashboard/index.tsx
@@ -13,8 +13,8 @@ const ReviewLinkDashboard = () => {
       <S.Separator />
       <S.LinkSection>
         <ReviewLinkLayout
-          title={'생성한 리뷰 링크를 확인해보세요'}
-          subTitle={'클릭하면 해당 프로젝트의 리뷰 목록으로 이동해요'}
+          title="생성한 리뷰 링크를 확인해보세요"
+          subTitle="클릭하면 해당 프로젝트의 리뷰 목록으로 이동해요"
         >
           {/* TODO: ReviewCard 컴포넌트 추가 및 생성한 리뷰 링크가 없을 경우, 돋보기 컴포넌트 추가 */}
           <></>
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts b/frontend/src/pages/ReviewLinkPage/components/ReviewLinkDashboard/styles.ts
similarity index 100%
rename from frontend/src/pages/ReviewLinkManagementPage/components/ReviewLinkDashboard/styles.ts
rename to frontend/src/pages/ReviewLinkPage/components/ReviewLinkDashboard/styles.ts
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/index.tsx b/frontend/src/pages/ReviewLinkPage/components/layouts/ReviewLinkLayout/index.tsx
similarity index 100%
rename from frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/index.tsx
rename to frontend/src/pages/ReviewLinkPage/components/layouts/ReviewLinkLayout/index.tsx
diff --git a/frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts b/frontend/src/pages/ReviewLinkPage/components/layouts/ReviewLinkLayout/styles.ts
similarity index 100%
rename from frontend/src/pages/ReviewLinkManagementPage/components/layouts/ReviewLinkLayout/styles.ts
rename to frontend/src/pages/ReviewLinkPage/components/layouts/ReviewLinkLayout/styles.ts
diff --git a/frontend/src/pages/ReviewLinkManagementPage/index.tsx b/frontend/src/pages/ReviewLinkPage/index.tsx
similarity index 77%
rename from frontend/src/pages/ReviewLinkManagementPage/index.tsx
rename to frontend/src/pages/ReviewLinkPage/index.tsx
index 3a06eee29..f9ecf4719 100644
--- a/frontend/src/pages/ReviewLinkManagementPage/index.tsx
+++ b/frontend/src/pages/ReviewLinkPage/index.tsx
@@ -2,7 +2,7 @@ import { ErrorSuspenseContainer } from '@/components';
 
 import ReviewLinkDashboard from './components/ReviewLinkDashboard';
 
-const ReviewLinkManagementPage = () => {
+const ReviewLinkPage = () => {
   return (
     <ErrorSuspenseContainer>
       {/* TODO: 네비게이션 탭 추가 */}
@@ -11,4 +11,4 @@ const ReviewLinkManagementPage = () => {
   );
 };
 
-export default ReviewLinkManagementPage;
+export default ReviewLinkPage;
diff --git a/frontend/src/pages/index.tsx b/frontend/src/pages/index.tsx
index 7e7a3fe3d..28b98890c 100644
--- a/frontend/src/pages/index.tsx
+++ b/frontend/src/pages/index.tsx
@@ -7,4 +7,4 @@ export { default as ReviewWritingPage } from './ReviewWritingPage';
 export { default as ReviewWritingCompletePage } from './ReviewWritingCompletePage';
 export { default as ReviewZonePage } from './ReviewZonePage';
 export { default as ReviewCollectionPage } from './ReviewCollectionPage';
-export { default as ReviewLinkManagementPage } from './ReviewLinkManagementPage';
+export { default as ReviewLinkPage } from './ReviewLinkPage';
diff --git a/frontend/src/router.tsx b/frontend/src/router.tsx
index 97762f9e7..a8abb7137 100644
--- a/frontend/src/router.tsx
+++ b/frontend/src/router.tsx
@@ -10,7 +10,7 @@ const ReviewWritingPage = lazy(() => import('@/pages/ReviewWritingPage'));
 const ReviewZonePage = lazy(() => import('@/pages/ReviewZonePage'));
 const ReviewCollectionPage = lazy(() => import('@/pages/ReviewCollectionPage'));
 const LoadingPage = lazy(() => import('@/pages/LoadingPage'));
-const ReviewLinkManagementPage = lazy(() => import('@/pages/ReviewLinkManagementPage'));
+const ReviewLinkPage = lazy(() => import('@/pages/ReviewLinkPage'));
 
 import App from './App';
 import { ErrorSuspenseContainer } from './components';
@@ -53,7 +53,7 @@ const router = createBrowserRouter([
         ),
       },
       { path: `${ROUTE.reviewCollection}/:${ROUTE_PARAM.reviewRequestCode}`, element: <ReviewCollectionPage /> },
-      { path: `${ROUTE.reviewLinkManagement}`, element: <ReviewLinkManagementPage /> },
+      { path: `${ROUTE.reviewLinks}`, element: <ReviewLinkPage /> },
     ],
   },
 ]);