diff --git a/packages/react-native/.eslintrc.js b/packages/react-native/.eslintrc.js
index e450c867..840eb0a9 100644
--- a/packages/react-native/.eslintrc.js
+++ b/packages/react-native/.eslintrc.js
@@ -23,7 +23,10 @@ module.exports = {
'no-console': 'error',
'import/prefer-default-export': 'off',
'@typescript-eslint/no-unused-vars': 'warn',
+ 'global-require': 'off',
'react/no-array-index-key': 'off',
+ 'react/no-unescaped-entities': 'off',
+ 'react/jsx-key': 'error',
},
ignorePatterns: [
'index.js',
diff --git a/packages/react-native/src/assets/home/dokaebi.png b/packages/react-native/src/assets/home/dokaebi.png
new file mode 100644
index 00000000..48cf8b7e
Binary files /dev/null and b/packages/react-native/src/assets/home/dokaebi.png differ
diff --git a/packages/react-native/src/assets/home/dongbaek.png b/packages/react-native/src/assets/home/dongbaek.png
new file mode 100644
index 00000000..03c9c7ae
Binary files /dev/null and b/packages/react-native/src/assets/home/dongbaek.png differ
diff --git a/packages/react-native/src/assets/home/homecapture.png b/packages/react-native/src/assets/home/homecapture.png
new file mode 100644
index 00000000..a480b489
Binary files /dev/null and b/packages/react-native/src/assets/home/homecapture.png differ
diff --git a/packages/react-native/src/assets/home/mrsunshine.png b/packages/react-native/src/assets/home/mrsunshine.png
new file mode 100644
index 00000000..a6c033b9
Binary files /dev/null and b/packages/react-native/src/assets/home/mrsunshine.png differ
diff --git a/packages/react-native/src/assets/home/popular-spot.png b/packages/react-native/src/assets/home/popular-spot.png
new file mode 100644
index 00000000..0ae4d57b
Binary files /dev/null and b/packages/react-native/src/assets/home/popular-spot.png differ
diff --git a/packages/react-native/src/assets/home/sarang.png b/packages/react-native/src/assets/home/sarang.png
new file mode 100644
index 00000000..8275c789
Binary files /dev/null and b/packages/react-native/src/assets/home/sarang.png differ
diff --git a/packages/react-native/src/assets/home/set-jetting.png b/packages/react-native/src/assets/home/set-jetting.png
new file mode 100644
index 00000000..342dbb5a
Binary files /dev/null and b/packages/react-native/src/assets/home/set-jetting.png differ
diff --git a/packages/react-native/src/assets/home/setjettingtrend.png b/packages/react-native/src/assets/home/setjettingtrend.png
new file mode 100644
index 00000000..1d0f1450
Binary files /dev/null and b/packages/react-native/src/assets/home/setjettingtrend.png differ
diff --git a/packages/react-native/src/assets/home/travellogcapture.png b/packages/react-native/src/assets/home/travellogcapture.png
new file mode 100644
index 00000000..2cfdae30
Binary files /dev/null and b/packages/react-native/src/assets/home/travellogcapture.png differ
diff --git a/packages/react-native/src/assets/home/tripcapture.png b/packages/react-native/src/assets/home/tripcapture.png
new file mode 100644
index 00000000..308bebe8
Binary files /dev/null and b/packages/react-native/src/assets/home/tripcapture.png differ
diff --git a/packages/react-native/src/assets/home/tv.png b/packages/react-native/src/assets/home/tv.png
new file mode 100644
index 00000000..fa8268ce
Binary files /dev/null and b/packages/react-native/src/assets/home/tv.png differ
diff --git a/packages/react-native/src/components/home/ContentImage.tsx b/packages/react-native/src/components/home/ContentImage.tsx
new file mode 100644
index 00000000..eb6f58db
--- /dev/null
+++ b/packages/react-native/src/components/home/ContentImage.tsx
@@ -0,0 +1,25 @@
+import { Dimensions, Image, ImageSourcePropType, View } from 'react-native';
+
+type ImageType = 'wide' | 'poster';
+
+interface ContentImageProps {
+ type: ImageType;
+ asset: ImageSourcePropType;
+}
+
+const { width } = Dimensions.get('window');
+
+export default function ContentImage({ type, asset }: ContentImageProps) {
+ if (type === 'poster')
+ return (
+
+
+
+ );
+
+ return (
+
+
+
+ );
+}
diff --git a/packages/react-native/src/components/home/ContentTitle.tsx b/packages/react-native/src/components/home/ContentTitle.tsx
new file mode 100644
index 00000000..2e5820f5
--- /dev/null
+++ b/packages/react-native/src/components/home/ContentTitle.tsx
@@ -0,0 +1,27 @@
+import { Font } from 'design-system';
+import { View } from 'react-native';
+
+interface ContentTitleProps {
+ mainTitle: string;
+ subTitle: string;
+}
+
+export default function ContentTitle({
+ mainTitle,
+ subTitle,
+}: ContentTitleProps) {
+ return (
+
+
+
+ {mainTitle}
+
+
+
+
+ {subTitle}
+
+
+
+ );
+}
diff --git a/packages/react-native/src/components/home/SetJettingContent.tsx b/packages/react-native/src/components/home/SetJettingContent.tsx
new file mode 100644
index 00000000..ad115213
--- /dev/null
+++ b/packages/react-native/src/components/home/SetJettingContent.tsx
@@ -0,0 +1,31 @@
+import { Font } from 'design-system';
+import { ImageSourcePropType, View } from 'react-native';
+import ContentImage from './ContentImage';
+
+interface SetJettingContentProps {
+ title: string;
+ image?: ImageSourcePropType;
+ content: string;
+}
+
+export default function SetJettingContent({
+ title,
+ content,
+ image,
+}: SetJettingContentProps) {
+ return (
+
+
+
+ {title}
+
+
+ {image && }
+
+
+ {content}
+
+
+
+ );
+}
diff --git a/packages/react-native/src/components/home/contents/PopularSpot.tsx b/packages/react-native/src/components/home/contents/PopularSpot.tsx
new file mode 100644
index 00000000..df5c0e46
--- /dev/null
+++ b/packages/react-native/src/components/home/contents/PopularSpot.tsx
@@ -0,0 +1,93 @@
+import { Font } from 'design-system';
+import { Image, ImageSourcePropType, View } from 'react-native';
+import ContentTitle from '../ContentTitle';
+import ContentImage from '../ContentImage';
+
+interface PopularSpotContent {
+ title: string;
+ subtitle: string;
+ content: string;
+ image: ImageSourcePropType;
+ imageType: 'poster' | 'wide';
+}
+
+const CONTENTS: PopularSpotContent[] = [
+ {
+ title: '동백꽃 필무렵',
+ subtitle: '포항 구룡포 일본인 가옥거리',
+ content:
+ "구룡포 일본인 가옥거리는 '동백꽃 필 무렵'의 주요 촬영지 중 하나로, 드라 마의 포스터에도 등장한 바로 그 장소입니다. 이곳에는 주인공 동백이가 운영하던 까멜리아도 자리하고 있어, 드라마 속 장면들이 현실에서 그대로 펼쳐지는 듯한 분위기를 자아냅니다. 좁은 골목길과 고즈넉한 건물들이 어우러져 동백이의 일상과 따뜻한 사랑 이야기가 그려졌던 공간의 감성을 고스란히 느낄 수 있으며, 동백이의 삶 이 우리 눈앞에 펼쳐지는 듯한 특별한 경험을 할 수 있습니다.",
+ image: require('../../../assets/home/dongbaek.png'),
+ imageType: 'poster',
+ },
+ {
+ title: '도깨비',
+ subtitle: '주문진 방파제',
+ content:
+ "'도깨비' 하면 떠오르는 가장 기억에 남는 장면 중 하나가 바로 주문진 방파제를 배경으로 한 이 장면입니다. 이곳은 도깨비 김신과 지은탁이 처음 만난 장소로, 지은탁이 붉은 목도리를 두르고 김신과의 운명적인 만남을 가졌던 그 순간이 많은 팬들에게 깊은 인상을 남겼습니다. 푸른 바다와 파도가 어우러진 방파제는 그 자체로도 낭만적이지만, 드라마 속 장면 덕분에 더 특별한 분위기를 자아냅니다. SPOT! 필터를 이용해 도깨비와 함께하는 그 순간을 재현해보세요. 드라마의 감동을 직접 느끼며 잊지 못할 추억을 남길 수 있습니다.",
+ image: require('../../../assets/home/dokaebi.png'),
+ imageType: 'wide',
+ },
+ {
+ title: '미스터 선샤인',
+ subtitle: '만휴정',
+ content: `'미스터 션샤인' 속 웅장한 자연과 고즈넉한 한옥이 조화를 이루는 만휴정 은 주인공들의 깊은 감정이 오고 갔던 중요한 장면이 촬영된 곳입니다. 으 히 "합시다. 러브. 나랑 같이."라는 명대사가 담긴 장면으로, 드라마 팬들에 게 더욱 특별한 의미를 갖는 명소입니다. 고요하고 아름다운 자연을 느낄 수 있는 만휴정은 사계절 내내 매력적인 경치로 많은 여행객들의 사랑을인 받고 있습니다. 이곳에서 SPOT! 필터를 사용해 주인공처럼 드라마 속 장 면을 재현해보고, 드라마의 감동을 직접 느껴보세요.`,
+ image: require('../../../assets/home/mrsunshine.png'),
+ imageType: 'wide',
+ },
+ {
+ title: '사랑의 불시착',
+ subtitle: '포천 한탄강 하늘다리',
+ content: `한탄강 하늘다리는 ‘사랑의 불시착’ 속 윤세리와 리정혁이 자신들이 이전 에 스위스에서 만났다는 운명적인 첫 인연을 서로에게 이야기하는 중요한 장면이 촬영된 곳입니다. 이 다리는 두 주인공의 이야기가 깊어지는 낭만 적인 순간을 담아내며, 많은 팬들이 그 감동을 되새기기 위해 이곳을 찾습 니다. 한탄강 협곡 위에 놓여진 하늘다리는 웅장한 자연경관을 자랑하며, 방문객들에게도 사랑받는 명소입니다. 탁 트인 한탄강의 경치와 어우러진 이 다리를 건너며, 드라마의 감동을 생생하게 체험하고 특별한 순간을 기록해보세요.`,
+ image: require('../../../assets/home/sarang.png'),
+ imageType: 'wide',
+ },
+];
+
+export default function PopularSpot() {
+ return (
+
+
+
+ Spot! 필터와 함께하는
+
+
+ 인기 드라마 촬영지 모음
+
+
+
+
+ Spot! | 2024-10-01
+
+
+
+
+
+
+
+ 드라마 속 촬영지를 직접 만나보고, 그 감동을 다시 느껴볼 수 있는 특별한
+ 기회! 이번에 소개할 여행지들은 한국의 대표적인 인기 드라마 속 명장면
+ 이 담긴 장소들로, 많은 이들에게 사랑받아온 곳들입니다. SPOT! 필터와
+ 함께라면, 우리도 드라마 속 주인공이 될 수 있어요! 촬영지 에서 주인공과
+ 함께 사진을 찍은 듯한 SPOT! 필터를 적용해, 드라마의 감 동을 사진으로
+ 남겨보세요. 잊지 못할 순간을 기록하며, 현실 속에서 드라 마의 한 장면을
+ 직접 재현할 수 있는 절호의 기회입니다.
+
+
+ {CONTENTS.map((item) => (
+
+
+
+
+
+ {item.content}
+
+
+
+ ))}
+
+ );
+}
diff --git a/packages/react-native/src/components/home/contents/SetJetting.tsx b/packages/react-native/src/components/home/contents/SetJetting.tsx
new file mode 100644
index 00000000..e473bf2e
--- /dev/null
+++ b/packages/react-native/src/components/home/contents/SetJetting.tsx
@@ -0,0 +1,103 @@
+import { Font } from 'design-system';
+import { Image, ImageSourcePropType, View } from 'react-native';
+import ContentImage from '../ContentImage';
+import SetJettingContent from '../SetJettingContent';
+
+interface SetJettingContent {
+ title: string;
+ image?: ImageSourcePropType;
+ content: string;
+}
+
+const SET_JETTING_CONTENTS: SetJettingContent[] = [
+ {
+ title: 'Set-Jetting 트렌드',
+ content: `최근 여행 트렌드 중 하나로 떠오르고 있는 ‘Set-Jetting’은 전 세계 여행 자들 사이에서 하나의 관광 형태로 빠르게 인기를 얻고 있습니다. Set-Jetting이란 드라마나 영화에 등장한 실제 촬영지를 직접 여행하는 것을 의미하는 신조어로, 콘텐츠 소비 방식이 여행 선택에까지 영향을 미 치는 현상을 반영하고 있습니다. American Express의 2023 Global Travel Trends Report에 따르면, 'Set-Jetting'은 주목해야 할 4가지 여행 트렌드 중 하나로 선정되었으며, Expedia의 2023 여행 트렌드 보고서 또한 2023년 주목해야 할 트렌드 중 하나로 ‘Set-Jetters’를 꼽았습니다. 관련 조사에 따르면, 전 세계 여행자들 중 2/3가 여행 전 'Set-Jetting'을 고려했으며, 그 중 39%는 드라마나 영화와 같은 미디어 콘텐츠 속 장면에 서 영감을 받아 여행을 떠난 경험이 있다고 응답했습니다. 이는 TV와 영화 같은 미디어 콘텐츠가 이제 하나의 여행 동기이자 테마로 발전하고 있음을 보여줍니다.`,
+ image: require('../../../assets/home/setjettingtrend.png'),
+ },
+ {
+ title: 'K-Contents 열풍과 한국 내 Set-Jetting 여행의 확산',
+ content:
+ '특히 K-드라마와 영화의 전 세계적인 인기가 높아지면서 한국의 촬영 장소 로 향하는 관광객이 급증하고 있습니다. 예를 들어, 드라마 도깨비에서 등장한 강릉의 주문진 방파제는 ‘도깨비 방파제’라는 이름으로 포토존으로 자리 잡았고, 수많은 팬들이 드라마 속 한 장면을 재현하기 위해 이곳을 찾고 있습니다.',
+ image: require('../../../assets/home/tv.png'),
+ },
+ {
+ title: '여행과 이야기가 만나는 순간',
+ content:
+ 'Set-Jetting의 가장 큰 매력은 단순한 여행을 넘어 자신이 사랑한 이야기 속으로 들어가는 듯한 몰입감을 선사한다는 점입니다. 아름다운 자연 경관 이나 도시를 배경으로 내가 좋아하는 드라마/영화 속 장면을 떠올리며, 그 공간에 서 있는 것만으로도 특별한 감동을 느낄 수 있습니다. 뿐만 아니라 촬영지가 제공하는 고유의 분위기를 직접 경험하며, 작품 속 인물들과 더 가까워지는 기분도 느낄 수 있죠.',
+ },
+ {
+ title: 'Spot!과 함께하는 Set-Jetting 여행 팁',
+ content:
+ '이러한 Set-Jetting 여행을 즐기기 위해서는, 자신이 좋아하는 작품 속 촬 영지 저보를 사전에 조사하고, 이를 바탕으로 여행을 계획하는 것이 중요 합니다. 그리고 Spot!은 이러한 Set-Jetter들을 위해 단순히 촬영지 정보 획득을 넘어 더욱 다채로운 여행을 경험할 수 있도록 도와줍니다. 촬영지 를 중심으로 하되, 그 주변의 관광 명소와 주변맛집, 숙소를 함께 탐험할 수 있도록 도와줌으로써, 촬영지 방문을 핵심으로 하면서도 현지의 고유한 매력까지 놓치지 않는 풍부한 여행 경험을 즐길 수 있습니다. 그럼 Spot!을 활용해 Set-Jetting 여행을 단계별로 준비하는 방법을 소 개합니다. 홈 탭에서 촬영지 탐색',
+ },
+ {
+ title: '1. 홈탭에서 촬영지 검색',
+ content:
+ 'Spot!의 홈 탭에서는 좋아하는 드라마나 영화를 검색해 해당 콘텐츠의 촬영지를 한눈에 확인할 수 있습니다. 드라마 속 주요 촬영지를 추천받고, 각 장소에 대한 상세 정보와 위치, 주소까지 모두 제공됩니다. 이뿐만 아니라, 주변 관광명소, 맛집, 숙소까지 추천받을 수 있어 한 번에 다양한 여행 정 보를 얻고 계획을 세울 수 있습니다. 원하는 장소를 내 여행에 담아 Trip Planner 탭의 My Trip(내 여행)에 저장해두는 것도 잊지 마세요.',
+ image: require('../../../assets/home/homecapture.png'),
+ },
+ {
+ title: '2. Trip Planner로 맞춤형 여행 경로 설계',
+ content:
+ '촬영지 탐색이 끝났다면, Trip Planner 탭에서 모아둔 장소들을 활용해 나만의 여행 경로를 설계할 차례입니다. 담은 촬영지와 관광 명소, 맛집, 숙소를 한곳에 모아보고, 그 장소들을 중심으로 여행 일정을 자유롭게 편 집할 수 있습니다. 나아가 새로운 장소를 직접 추가할 수도 있어요! 일정에 따라 장소를 추가, 삭제하고 순서를 편집하며 나만의 최적의 여행 루트를 완성해보세요.',
+ image: require('../../../assets/home/tripcapture.png'),
+ },
+ {
+ title: '3. Quiz & Filter로 촬영지에서의 특별한 체험',
+ content:
+ '실제 촬영지에 도착했다면 Quiz & Filter 탭을 활용해 반경 20km 내에 있 는 촬영지들을 탐색해보세요. 해당 장소에서만 사용할 수 있는 필터 카메 라를 통해 드라마의 주인공과 함께 사진을 찍은 것 같은 특별한 경험을 남 길 수 있습니다. 또한, 각 촬영지에서 퀴즈를 풀고 정답을 맞출 경우, 여행 뱃지도 획득할 수 있으니 놓치지 마세요!',
+ },
+ {
+ title: '4. Travel Log로 나만의 여행 기록 남기기',
+ content:
+ '여행이 끝난 후에는 Travel Log 탭에서 방문한 촬영지와 여행 경험을 기 록하고 저장해보세요. 한국 지도에서 지역별로 대표사진을 설정해 나의 여 행 사진들로 나만의 지도를 완성할 수 있으며, 각 지역별로 여행의 추억들 기록할 수 있어요. 이 기능을 통해 여행지에서의 특별한 순간을 오래도록 간직하고 추억할 수 있겠죠.',
+ image: require('../../../assets/home/travellogcapture.png'),
+ },
+ {
+ title: '5.마이페이지에서 뱃지 확인과 레벨업',
+ content: `Spot! 앱을 통해 모은 여행 뱃지들을 마이페이지 탭에서 확인해보세요. 대한민국 행정구역 별로 촬영지 방문 여부에 따라 뱃지를 수집하고, 뱃지 를 클릭해 어느 지역에서 뱃지를 획득했는지도 확인할 수 있습니다.할 배지를 많이 모을수록 나의 프로필 레벨이 올라가며, Set-Jetting 여행자 로서의 성장을 확인할 수 있습니다. 최종적으로는 최상위의 Set-Jetter 여행자인 'Director's Cut' 레벨까지 도전해보세요!`,
+ },
+];
+
+export default function SetJetting() {
+ return (
+
+
+
+
+ Spot!
+
+
+ 과 함께 떠나는
+
+
+
+ Set-Jetting 여행
+
+
+ : 드라마와 영화 속 그 장소로!
+
+
+
+
+ Spot! | 2024-10-01
+
+
+
+
+
+ {SET_JETTING_CONTENTS.map((item) => (
+
+ ))}
+
+ );
+}
diff --git a/packages/react-native/src/constants/HOME_CONTENTS.ts b/packages/react-native/src/constants/HOME_CONTENTS.ts
new file mode 100644
index 00000000..83e4bde1
--- /dev/null
+++ b/packages/react-native/src/constants/HOME_CONTENTS.ts
@@ -0,0 +1,21 @@
+import { ImageSourcePropType } from 'react-native';
+
+export type ContentTitle = 'popular-spot' | 'set-jetting';
+
+interface Content {
+ title: ContentTitle;
+ image: ImageSourcePropType;
+}
+
+const HOME_CONTENTS: Content[] = [
+ {
+ title: 'popular-spot',
+ image: require('../assets/home/popular-spot.png'),
+ },
+ {
+ title: 'set-jetting',
+ image: require('../assets/home/set-jetting.png'),
+ },
+];
+
+export default HOME_CONTENTS;
diff --git a/packages/react-native/src/pages/Home/Content.tsx b/packages/react-native/src/pages/Home/Content.tsx
new file mode 100644
index 00000000..c61361cc
--- /dev/null
+++ b/packages/react-native/src/pages/Home/Content.tsx
@@ -0,0 +1,19 @@
+import { useRoute } from '@react-navigation/native';
+import { SafeAreaView, ScrollView } from 'react-native';
+
+import { StackRouteProps } from '@/types/navigation';
+import PopularSpot from '@/components/home/contents/PopularSpot';
+import SetJetting from '@/components/home/contents/SetJetting';
+
+export default function Content() {
+ const route = useRoute>();
+ const { title } = route.params;
+
+ return (
+
+
+ {title === 'popular-spot' ? : }
+
+
+ );
+}
diff --git a/packages/react-native/src/pages/Detail.tsx b/packages/react-native/src/pages/Home/Detail.tsx
similarity index 100%
rename from packages/react-native/src/pages/Detail.tsx
rename to packages/react-native/src/pages/Home/Detail.tsx
diff --git a/packages/react-native/src/pages/Home.tsx b/packages/react-native/src/pages/Home/Home.tsx
similarity index 71%
rename from packages/react-native/src/pages/Home.tsx
rename to packages/react-native/src/pages/Home/Home.tsx
index 9d1ec91b..5ca3faa9 100644
--- a/packages/react-native/src/pages/Home.tsx
+++ b/packages/react-native/src/pages/Home/Home.tsx
@@ -1,4 +1,4 @@
-import { View } from 'react-native';
+import { ImageBackground, TouchableOpacity, View } from 'react-native';
import { Font } from 'design-system';
import SearchBar from '@components/common/SearchBar';
import BackGroundGradient from '@/layouts/BackGroundGradient';
@@ -10,6 +10,7 @@ import Header from '@/components/common/Header';
import withSuspense from '@/components/HOC/withSuspense';
import useHomeSpotQuery from '@/apis/queries/home/useHomeSpotQuery';
import SPOTLogo from '@/assets/SPOTLogo';
+import HOME_CONTENTS from '@/constants/HOME_CONTENTS';
interface HomeScreenProps {
navigation: StackNavigation<'Home/Main'>;
@@ -29,7 +30,7 @@ export default withSuspense(function Home({ navigation }: HomeScreenProps) {
}
/>
-
+
안녕하세요, {profile?.nickname}님{'\n'}오늘은 어디로 가 볼까요?
@@ -50,14 +51,27 @@ export default withSuspense(function Home({ navigation }: HomeScreenProps) {
renderItem={({ item }) => }
/>
- {/* FIXME: 추후 주석 제거
}
+ data={HOME_CONTENTS}
+ renderItem={({ item }) => (
+
+ navigation.navigate('Home/Content', {
+ title: item.title,
+ })
+ }
+ >
+
+
+ )}
/>
- */}
+
);
diff --git a/packages/react-native/src/pages/HomeSpotAdd.tsx b/packages/react-native/src/pages/Home/HomeSpotAdd.tsx
similarity index 100%
rename from packages/react-native/src/pages/HomeSpotAdd.tsx
rename to packages/react-native/src/pages/Home/HomeSpotAdd.tsx
diff --git a/packages/react-native/src/pages/Search.tsx b/packages/react-native/src/pages/Home/Search.tsx
similarity index 100%
rename from packages/react-native/src/pages/Search.tsx
rename to packages/react-native/src/pages/Home/Search.tsx
diff --git a/packages/react-native/src/routes/HomeStackNavigator.tsx b/packages/react-native/src/routes/HomeStackNavigator.tsx
index a9b737f6..86b98fa9 100644
--- a/packages/react-native/src/routes/HomeStackNavigator.tsx
+++ b/packages/react-native/src/routes/HomeStackNavigator.tsx
@@ -1,10 +1,11 @@
import { createStackNavigator } from '@react-navigation/stack';
-import Home from '@/pages/Home';
+import Home from '@/pages/Home/Home';
import { StackParamList } from '@/types/navigation';
-import Search from '@/pages/Search';
-import Detail from '@/pages/Detail';
-import HomeSpotAdd from '@/pages/HomeSpotAdd';
+import Search from '@/pages/Home/Search';
+import Detail from '@/pages/Home/Detail';
+import HomeSpotAdd from '@/pages/Home/HomeSpotAdd';
import TripPlannerPost from '@/pages/TripPlanner/TripPlannerPost';
+import Content from '@/pages/Home/Content';
const Stack = createStackNavigator();
@@ -19,6 +20,7 @@ export default function HomeStackNavigator() {
+
);
}
diff --git a/packages/react-native/src/routes/MyPageStackNavigator.tsx b/packages/react-native/src/routes/MyPageStackNavigator.tsx
index 104bc3d2..adff025c 100644
--- a/packages/react-native/src/routes/MyPageStackNavigator.tsx
+++ b/packages/react-native/src/routes/MyPageStackNavigator.tsx
@@ -2,7 +2,7 @@ import { createStackNavigator } from '@react-navigation/stack';
import MyPage from '@/pages/MyPage';
import EditProfile from '@/pages/MyPage/EditProfile';
import EditProfileWithNickname from '@/pages/MyPage/EditProfileWithNickname';
-import Detail from '@/pages/Detail';
+import Detail from '@/pages/Home/Detail';
const Stack = createStackNavigator();
diff --git a/packages/react-native/src/types/navigation.ts b/packages/react-native/src/types/navigation.ts
index dcbe3d45..8b31222b 100644
--- a/packages/react-native/src/types/navigation.ts
+++ b/packages/react-native/src/types/navigation.ts
@@ -3,6 +3,7 @@ import { RouteProp } from '@react-navigation/native';
import { KoreaLocationName } from './map';
import { SpotResponse } from '@/apis/queries/spot/useSpotDetailQuery';
import { City, Region } from '@/constants/CITY';
+import { ContentTitle } from '@/constants/HOME_CONTENTS';
export type StackParamList = {
Splash: undefined;
@@ -50,6 +51,9 @@ export type StackParamList = {
spots: SpotResponse[];
};
'Home/PlanPost': undefined;
+ 'Home/Content': {
+ title: ContentTitle;
+ };
'Gamification/Main': undefined;
'Gamification/Quiz': {