diff --git a/src/lib/router/header-route.ts b/src/lib/router/header-route.ts
index 3b3fece4..f7a96a6f 100644
--- a/src/lib/router/header-route.ts
+++ b/src/lib/router/header-route.ts
@@ -1,6 +1,6 @@
export const headerRouteConfig = [
{ route: 'home', navName: 'Home' },
{ route: 'timetable', navName: 'Timetable', innerTab: ['timetable', 'timetable/friend'] },
- { route: 'community', navName: 'Community' },
+ { route: 'community/all?board=All&boardId=0', navName: 'Community' },
{ route: 'matching', navName: '1:1 Matching' },
]
diff --git a/src/lib/router/routeConfig.tsx b/src/lib/router/routeConfig.tsx
new file mode 100644
index 00000000..79665c6d
--- /dev/null
+++ b/src/lib/router/routeConfig.tsx
@@ -0,0 +1,96 @@
+import {
+ BoardPage,
+ ClubDetailPage,
+ ClubPage,
+ CourseInfoPage,
+ CourseReviewPage,
+ FriendPage,
+ FriendTimetablePage,
+ HotBoardPage,
+ MainCommunityPage,
+ MyPage,
+ MyTimetablePage,
+ PostViewPage,
+ ReviewDetailPage,
+ ReviewPage,
+ SchedulePage,
+ TimetablePage,
+ WritePostPage,
+ WriteReviewPage,
+} from '@/lib/router/lazy-route'
+import CommunityAllPage from '@/pages/Community/All'
+import HomePage from '@/pages/Home'
+import LandingPage from '@/pages/LandingPage'
+import Login from '@/pages/LoginPage'
+import PasswordResetPage from '@/pages/PasswordResetPage'
+import RegisterPage from '@/pages/RegisterPage'
+
+export const routeConfig = {
+ // 메인 페이지
+ LandingPage: { path: '/', element:
, params: [] },
+ HomePage: { path: 'home', element:
, params: [] },
+
+ // 인증 관련
+ Login: { path: 'login', element:
, params: [] },
+ RegisterPage: { path: 'register', element:
, params: [] },
+ PasswordResetPage: { path: 'password-reset', element:
, params: [] },
+
+ // 마이페이지
+ MyPage: { path: 'mypage', element:
, params: [] },
+
+ // 시간표
+ TimetablePage: { path: '/timetable', element:
, params: [] },
+ MyTimetablePage: { path: '/timetable', element:
, params: [] },
+ FriendPage: { path: '/timetable/friend', element:
, params: [] },
+ FriendTimetablePage: {
+ path: 'timetable/friend/:userHandler',
+ params: ['userHandler'],
+ element:
,
+ },
+
+ // 강의 리뷰
+ CourseReviewPage: { path: '/course-review', element:
, params: [] },
+ CourseInfoPage: { path: '/course-review/info', element:
, params: [] },
+ ReviewPage: { path: '/course-review/detail', element:
, params: [] },
+ ReviewDetailPage: { path: '/course-review/review', element:
, params: [] },
+ WriteReviewPage: { path: '/course-review/write', element:
, params: [] },
+
+ // 커뮤니티
+ MainCommunityPage: { path: '/community', element:
, params: [] },
+ CommunityAllPage: { path: '/community/all', element:
, params: [] },
+ WritePostPage: {
+ path: '/community/action/:type/post/:boardName',
+ params: ['type', 'boardName'],
+ element:
,
+ },
+ BoardPage: {
+ path: '/community/board/:boardName',
+ params: ['boardName'],
+ element:
,
+ },
+ HotBoardPage: { path: '/community/board/hotboard', element:
, params: [] },
+ PostViewPage: {
+ path: '/community/:boardName/post/:postId',
+ params: ['boardName', 'postId'],
+ element:
,
+ },
+
+ // 일정
+ SchedulePage: { path: '/calendar', element:
, params: [] },
+
+ // 동아리
+ ClubPage: { path: '/club', element:
, params: [] },
+ ClubDetailPage: {
+ path: '/club/detail/:clubId',
+ params: ['clubId'],
+ element:
,
+ },
+} as const
+
+export type RouteKey = keyof typeof routeConfig
+
+export type RouteParams
= (typeof routeConfig)[T]['params'][number]
+
+// 파라미터 배열을 객체 타입으로 변환하는 타입
+export type RouteParamsObject =
+ RouteParams extends never ? undefined : { [K in RouteParams]: string }
diff --git a/src/lib/router/router.tsx b/src/lib/router/router.tsx
index 74a66d8b..6be1bd82 100644
--- a/src/lib/router/router.tsx
+++ b/src/lib/router/router.tsx
@@ -1,33 +1,9 @@
import { RouteObject } from 'react-router-dom'
import MainLayout from '@/components/MainLayout'
-import {
- BoardPage,
- ClubDetailPage,
- ClubPage,
- CourseInfoPage,
- CourseReviewPage,
- FriendPage,
- FriendTimetablePage,
- HotBoardPage,
- MainCommunityPage,
- MyPage,
- MyTimetablePage,
- PostViewPage,
- ReviewDetailPage,
- ReviewPage,
- SchedulePage,
- TimetablePage,
- WritePostPage,
- WriteReviewPage,
-} from '@/lib/router/lazy-route'
import ProtectedRoutes from '@/lib/router/ProtectedRoutes'
-import CommunityAllPage from '@/pages/Community/All'
-import HomePage from '@/pages/Home'
+import { routeConfig } from '@/lib/router/routeConfig'
import LandingPage from '@/pages/LandingPage'
-import Login from '@/pages/LoginPage'
-import PasswordResetPage from '@/pages/PasswordResetPage'
-import RegisterPage from '@/pages/RegisterPage'
const routes: RouteObject[] = [
{
@@ -42,70 +18,68 @@ const routes: RouteObject[] = [
path: '',
element: ,
children: [
- { path: 'mypage', element: },
+ { ...routeConfig.MyPage },
{
- path: 'timetable',
- element: ,
+ ...routeConfig.TimetablePage,
children: [
- { path: '', element: },
{
- path: 'friend',
- element: ,
+ ...routeConfig.MyTimetablePage,
+ path: routeConfig.MyTimetablePage.path.replace('/timetable', ''),
+ },
+ {
+ ...routeConfig.FriendPage,
+ path: routeConfig.FriendPage.path.replace('/timetable/', ''),
+ },
+ {
+ ...routeConfig.FriendTimetablePage,
+ path: routeConfig.FriendTimetablePage.path.replace('/timetable/', ''),
},
- { path: 'friend/:userHandler', element: },
],
},
{
- path: 'course-review',
- element: ,
+ ...routeConfig.CourseReviewPage,
children: [
- { path: 'info', element: },
- { path: 'detail', element: },
- { path: 'review', element: },
- { path: 'write', element: },
+ {
+ ...routeConfig.CourseInfoPage,
+ path: routeConfig.CourseInfoPage.path.replace('/course-review/', ''),
+ },
+ {
+ ...routeConfig.ReviewPage,
+ path: routeConfig.ReviewPage.path.replace('/course-review/', ''),
+ },
+ {
+ ...routeConfig.ReviewDetailPage,
+ path: routeConfig.ReviewDetailPage.path.replace('/course-review/', ''),
+ },
+ {
+ ...routeConfig.WriteReviewPage,
+ path: routeConfig.WriteReviewPage.path.replace('/course-review/', ''),
+ },
],
},
- {
- path: 'community',
- element: ,
- },
- {
- path: 'community/all',
- element: ,
- },
- {
- path: 'community/action/:type/post/:boardName',
- element: ,
- },
- {
- path: 'community/board/:boardName',
- element: ,
- },
- {
- path: 'community/board/hotboard',
- element: ,
- },
- {
- path: 'community/:boardName/post/:postId',
- element: ,
- },
+ { ...routeConfig.MainCommunityPage },
+ { ...routeConfig.CommunityAllPage },
+ { ...routeConfig.WritePostPage },
+ { ...routeConfig.BoardPage },
+ { ...routeConfig.HotBoardPage },
+ { ...routeConfig.PostViewPage },
],
},
- { path: 'home', element: },
- { path: 'calendar', element: },
- { path: 'login', element: },
- { path: 'register', element: },
- { path: 'password-reset', element: },
+ { ...routeConfig.HomePage },
+ { ...routeConfig.SchedulePage },
+ { ...routeConfig.Login },
+ { ...routeConfig.RegisterPage },
+ { ...routeConfig.PasswordResetPage },
{
path: 'club',
children: [
{
- path: '',
- element: ,
+ ...routeConfig.ClubPage,
+ path: routeConfig.ClubPage.path.replace('/club', ''),
},
{
- path: 'detail/:clubId',
- element: ,
+ ...routeConfig.ClubDetailPage,
+ path: routeConfig.ClubDetailPage.path.replace('/club/', ''),
},
],
},
diff --git a/src/util/hooks/useNavigateRouter.ts b/src/util/hooks/useNavigateRouter.ts
new file mode 100644
index 00000000..674fe6eb
--- /dev/null
+++ b/src/util/hooks/useNavigateRouter.ts
@@ -0,0 +1,24 @@
+import { useCallback } from 'react'
+import { generatePath, NavigateOptions, useNavigate } from 'react-router-dom'
+
+import { routeConfig, RouteKey, RouteParamsObject } from '@/lib/router/routeConfig'
+
+export const useNavigateRouter = () => {
+ const navigate = useNavigate()
+
+ const navigateTo = useCallback(
+ (routeName: T, params?: RouteParamsObject, options?: NavigateOptions) => {
+ const route = routeConfig[routeName]
+ // React Router의 generatePath 사용
+ try {
+ const path = generatePath(route.path, params as { [K in (typeof route.params)[number]]: string })
+ navigate(path, options)
+ } catch (error) {
+ console.error(`Failed to generate path for "${routeName}":`, error)
+ }
+ },
+ [navigate],
+ )
+
+ return navigateTo
+}