From 1b045cb28209be404ac6d6f6920abfadc9e649b2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=9D=B4=EB=8F=84=EC=97=B0?= Date: Fri, 19 Dec 2025 10:59:05 +0900 Subject: [PATCH] =?UTF-8?q?fix=20:=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/Pages/channel/PostDetailPage.tsx | 215 +++++++++++++++-- frontend/src/Pages/communityPage/CP.tsx | 71 ++++-- .../src/Pages/communityPage/ChannelPage.tsx | 219 ++++++++++++++---- 3 files changed, 429 insertions(+), 76 deletions(-) diff --git a/frontend/src/Pages/channel/PostDetailPage.tsx b/frontend/src/Pages/channel/PostDetailPage.tsx index 7318e967..ab4b2f19 100644 --- a/frontend/src/Pages/channel/PostDetailPage.tsx +++ b/frontend/src/Pages/channel/PostDetailPage.tsx @@ -51,14 +51,15 @@ interface Post { comments: { author: string; text: string }[]; } +// 더미 채널 데이터 (시현용) const mockChannels: Channel[] = [ { channelId: 1, channelName: '러닝 크루', channelIntro: '함께 달리는 러닝 커뮤니티', - description: '주말마다 함께 달리며 건강을 챙기는 크루입니다.', + description: '주말마다 함께 달리며 건강을 챙기는 크루입니다. 초보자도 환영합니다!', hobbies: ['러닝', '운동', '건강'], - joined: false, + joined: true, }, { channelId: 2, @@ -68,38 +69,213 @@ const mockChannels: Channel[] = [ hobbies: ['요리', '베이킹', '레시피'], joined: true, }, + { + channelId: 3, + channelName: '독서 모임', + channelIntro: '매주 책을 읽고 이야기를 나누는 독서 동아리입니다.', + description: '매월 한 권의 책을 선정해서 함께 읽고 토론합니다.', + hobbies: ['독서', '토론', '글쓰기'], + joined: false, + }, + { + channelId: 4, + channelName: '사진 찍는 사람들', + channelIntro: '일상의 순간을 카메라에 담는 사진 동호회입니다.', + description: '카메라, 스마트폰 상관없이 사진 찍는 것을 좋아하는 분들 모여주세요!', + hobbies: ['사진', '출사', '편집'], + joined: false, + }, + { + channelId: 5, + channelName: '영화 리뷰 클럽', + channelIntro: '최신 영화부터 명작까지 리뷰를 공유하는 모임입니다.', + description: '매주 영화를 감상하고 리뷰를 공유합니다.', + hobbies: ['영화', '리뷰', '감상'], + joined: true, + }, + { + channelId: 6, + channelName: '캠핑 어디까지 가봤니', + channelIntro: '캠핑 장소와 장비 정보를 공유하는 캠핑 마니아 모임입니다.', + description: '전국 캠핑장 정보, 장비 리뷰, 캠핑 요리 레시피 등을 공유합니다.', + hobbies: ['캠핑', '아웃도어', '자연'], + joined: false, + }, + { + channelId: 7, + channelName: '보드게임 카페', + channelIntro: '다양한 보드게임을 함께 즐기는 게이머들의 공간입니다.', + description: '보드게임 좋아하시는 분들 모여주세요!', + hobbies: ['보드게임', '전략', '모임'], + joined: true, + }, + { + channelId: 8, + channelName: '식물 집사 모임', + channelIntro: '반려식물 키우기 팁과 경험을 나누는 모임입니다.', + description: '식물 키우기 초보부터 고수까지!', + hobbies: ['식물', '가드닝', '인테리어'], + joined: false, + }, ]; +// 더미 게시글 데이터 (시현용) const mockPosts: Post[] = [ + // 러닝 크루 (channelId: 1) { postId: 1, channelId: 1, author: '홍길동', - content: '이번 주말에 러닝 같이 하실 분?', + content: '이번 주말에 러닝 같이 하실 분? 한강 반포지구에서 아침 7시에 만나요!', createdAt: '2025-12-17 10:00', - likes: 3, + likes: 12, comments: [ - { author: '사용자1', text: '좋아요!' }, - { author: '사용자2', text: '같이 뛰어요!' }, + { author: '김철수', text: '좋아요! 저도 참여할게요!' }, + { author: '박지민', text: '같이 뛰어요! 기대됩니다 🏃' }, + { author: '이수현', text: '저도 참여할게요! 첫 참여인데 잘 부탁드려요~' }, ], }, { postId: 2, channelId: 1, author: '김철수', - content: '새로운 러닝 코스 추천해요!', + content: '새로운 러닝 코스 추천해요! 올림픽공원 코스 진짜 좋습니다. 평지라서 초보자도 뛰기 좋아요 👍', createdAt: '2025-12-16 14:30', - likes: 1, - comments: [{ author: '사용자3', text: '좋아요' }], + likes: 8, + comments: [ + { author: '홍길동', text: '좋은 정보 감사합니다!' }, + { author: '운동맨', text: '다음에 가봐야겠네요' }, + ], }, { postId: 3, + channelId: 1, + author: '박지민', + content: '오늘 첫 10km 완주했어요! 🎉 다들 응원 감사합니다! 작년에 1km도 힘들었는데 이제 10km를 뛸 수 있다니 감격이에요.', + createdAt: '2025-12-15 18:20', + likes: 25, + comments: [ + { author: '홍길동', text: '축하해요! 대단합니다!' }, + { author: '김철수', text: '와 정말 멋져요! 저도 열심히 해야겠어요' }, + { author: '운동초보', text: '저도 목표로 하고 있어요. 꼭 따라갈게요!' }, + ], + }, + // 홈쿠킹 연구소 (channelId: 2) + { + postId: 4, channelId: 2, author: '이영희', - content: '최근에 만든 초콜릿 케이크 레시피 공유합니다.', + content: '최근에 만든 초콜릿 케이크 레시피 공유합니다!\n\n재료: 생크림 200ml, 다크초콜릿 150g, 박력분 100g, 달걀 3개\n\n1. 초콜릿을 중탕으로 녹여주세요\n2. 달걀과 설탕을 휘핑합니다\n3. 박력분을 체쳐서 넣어주세요\n4. 180도에서 25분 구워주면 완성!', createdAt: '2025-12-15 12:00', - likes: 2, - comments: [{ author: '사용자4', text: '맛있겠다!' }], + likes: 18, + comments: [ + { author: '요리왕', text: '맛있겠다! 이번 주말에 도전해볼게요' }, + { author: '달콤이', text: '레시피 감사해요! 사진도 올려주세요~' }, + ], + }, + { + postId: 5, + channelId: 2, + author: '최민수', + content: '에어프라이어로 치킨 만들어봤는데 진짜 바삭해요! 비법은 전분가루예요. 밑간한 닭에 전분 묻히고 180도에서 25분!', + createdAt: '2025-12-14 20:00', + likes: 32, + comments: [ + { author: '치킨러버', text: '대박! 당장 해봐야겠어요' }, + { author: '이영희', text: '오늘 저녁 메뉴 정했다 ㅋㅋ' }, + { author: '에어프라이어매니아', text: '온도 팁 감사합니다!' }, + ], + }, + // 독서 모임 (channelId: 3) + { + postId: 6, + channelId: 3, + author: '정수현', + content: '이번 달 선정 도서는 "데미안"입니다. 헤르만 헤세의 고전 명작이죠. 다들 읽고 오세요~ 12월 28일에 온라인 토론회 진행합니다!', + createdAt: '2025-12-10 09:00', + likes: 15, + comments: [ + { author: '독서광', text: '좋은 선정이에요! 오랜만에 다시 읽어봐야겠네요' }, + { author: '책벌레', text: '벌써 읽기 시작했어요. 토론회 기대됩니다!' }, + ], + }, + { + postId: 7, + channelId: 3, + author: '김독서', + content: '"작은 아씨들" 감상평입니다. 시대를 초월한 메시지가 인상깊었어요. 특히 조의 캐릭터가 현대의 여성상과도 잘 맞닿아 있다고 느꼈습니다.', + createdAt: '2025-12-08 21:30', + likes: 10, + comments: [ + { author: '정수현', text: '공감해요! 저도 조가 가장 좋았어요' }, + { author: '문학소녀', text: '저도 인상깊게 읽었어요. 영화도 추천드려요!' }, + ], + }, + // 사진 찍는 사람들 (channelId: 4) + { + postId: 8, + channelId: 4, + author: '사진작가', + content: '오늘 출사 다녀왔어요! 서해 일몰 사진 공유합니다 📷 골든아워에 찍으니까 색감이 정말 예쁘게 나왔어요.', + createdAt: '2025-12-16 19:00', + likes: 45, + comments: [ + { author: '카메라덕후', text: '와 너무 예뻐요! 어떤 렌즈 쓰셨어요?' }, + { author: '출사마니아', text: '어디서 찍으셨어요? 저도 가보고 싶어요' }, + { author: '색감장인', text: '색감 대박... 보정은 어떻게 하셨나요?' }, + ], + }, + // 영화 리뷰 클럽 (channelId: 5) + { + postId: 9, + channelId: 5, + author: '영화광', + content: '듄2 봤는데요... 역대급입니다. 꼭 아이맥스로 보세요! 한스 짐머 음악이 정말 압도적이에요. 사막 전투신은 소름 돋았습니다.', + createdAt: '2025-12-12 22:00', + likes: 28, + comments: [ + { author: '시네필', text: '동의합니다! 올해 최고의 영화에요' }, + { author: 'SF팬', text: '사막신 진짜 압도적이었죠. 티모시 샬라메 연기도 최고!' }, + ], + }, + // 캠핑 어디까지 가봤니 (channelId: 6) + { + postId: 10, + channelId: 6, + author: '캠핑마스터', + content: '가평 ○○캠핑장 후기입니다. 시설 깨끗하고 뷰 최고! 특히 밤하늘 별이 정말 잘 보여요. 사이트 간격도 넓어서 프라이버시 보장됩니다.', + createdAt: '2025-12-11 15:00', + likes: 22, + comments: [ + { author: '캠핑초보', text: '정보 감사합니다! 예약하기 어렵나요?' }, + { author: '텐트매니아', text: '다음 주 가볼게요. 추천 사이트 번호 있으신가요?' }, + ], + }, + // 보드게임 카페 (channelId: 7) + { + postId: 11, + channelId: 7, + author: '게임러버', + content: '이번 주 토요일 오프라인 모임 있습니다! 강남역 3시 집합! 이번에 새로 나온 "윙스팬" 해볼 예정이에요. 초보자도 환영합니다~', + createdAt: '2025-12-13 10:00', + likes: 16, + comments: [ + { author: '보드게임덕후', text: '참여할게요! 윙스팬 해보고 싶었어요' }, + { author: '전략가', text: '몇 명 모였나요? 저도 참석하고 싶어요' }, + ], + }, + // 식물 집사 모임 (channelId: 8) + { + postId: 12, + channelId: 8, + author: '식물덕후', + content: '몬스테라 분갈이 했어요! 뿌리가 화분을 뚫고 나왔었네요 😅 2년만에 분갈이했더니 뿌리가 엄청 많아졌어요. 건강하게 잘 자라줘서 뿌듯합니다.', + createdAt: '2025-12-14 11:00', + likes: 19, + comments: [ + { author: '초록이', text: '건강하게 잘 자랐네요! 저도 분갈이 해야하는데 엄두가 안나요' }, + { author: '가드너', text: '분갈이 후 관리법 공유해주세요~' }, + ], }, ]; @@ -135,7 +311,20 @@ function PostDetailPage() { }, []); useEffect(() => { - const currentChannel = mockChannels.find(ch => ch.channelId === channelId); + let currentChannel = mockChannels.find(ch => ch.channelId === channelId); + + // 더미 데이터에 없는 채널 ID인 경우 기본값 설정 + if (!currentChannel && channelId) { + currentChannel = { + channelId: channelId, + channelName: `채널 ${channelId}`, + channelIntro: '채널 소개입니다.', + description: '채널 상세 설명입니다.', + hobbies: ['취미1', '취미2'], + joined: false, + }; + } + if (currentChannel) { setChannel(currentChannel); setJoinStatus(currentChannel.joined ? 'APPROVED' : 'NONE'); diff --git a/frontend/src/Pages/communityPage/CP.tsx b/frontend/src/Pages/communityPage/CP.tsx index 8a3dfbaa..f53d706a 100644 --- a/frontend/src/Pages/communityPage/CP.tsx +++ b/frontend/src/Pages/communityPage/CP.tsx @@ -14,7 +14,6 @@ import { import { useNavigate } from 'react-router-dom'; import { useEffect, useState } from 'react'; import Header from '../../components/mainpage-Header/mph'; -import { channelApi } from '../../api/channel'; interface Channel { channelId: number; @@ -22,6 +21,50 @@ interface Channel { channelIntro: string; } +// 더미 채널 데이터 (시현용) +const dummyChannels: Channel[] = [ + { + channelId: 1, + channelName: '러닝 크루', + channelIntro: '함께 달리며 건강을 챙기는 러닝 커뮤니티입니다.', + }, + { + channelId: 2, + channelName: '홈쿠킹 연구소', + channelIntro: '집에서 새로운 요리 레시피를 공유하는 공간입니다.', + }, + { + channelId: 3, + channelName: '독서 모임', + channelIntro: '매주 책을 읽고 이야기를 나누는 독서 동아리입니다.', + }, + { + channelId: 4, + channelName: '사진 찍는 사람들', + channelIntro: '일상의 순간을 카메라에 담는 사진 동호회입니다.', + }, + { + channelId: 5, + channelName: '영화 리뷰 클럽', + channelIntro: '최신 영화부터 명작까지 리뷰를 공유하는 모임입니다.', + }, + { + channelId: 6, + channelName: '캠핑 어디까지 가봤니', + channelIntro: '캠핑 장소와 장비 정보를 공유하는 캠핑 마니아 모임입니다.', + }, + { + channelId: 7, + channelName: '보드게임 카페', + channelIntro: '다양한 보드게임을 함께 즐기는 게이머들의 공간입니다.', + }, + { + channelId: 8, + channelName: '식물 집사 모임', + channelIntro: '반려식물 키우기 팁과 경험을 나누는 모임입니다.', + }, +]; + function CommunityPage() { const navigate = useNavigate(); const [channels, setChannels] = useState([]); @@ -29,27 +72,13 @@ function CommunityPage() { const [loading, setLoading] = useState(true); useEffect(() => { - const fetchChannels = async () => { - try { - setLoading(true); - const response = await channelApi.getAllChannels(); - if (response.success && response.data) { - const channelList = response.data.responses.map((ch) => ({ - channelId: ch.channelId, - channelName: ch.channelName, - channelIntro: ch.channelIntro, - })); - setChannels(channelList); - } - } catch (error) { - console.error('채널 목록 조회 실패:', error); - // API 실패 시 빈 배열 유지 - } finally { - setLoading(false); - } - }; + // 더미 데이터 사용 (시현용) + setLoading(true); + setTimeout(() => { + setChannels(dummyChannels); + setLoading(false); + }, 300); // 살짝 로딩 효과 - fetchChannels(); const joined = JSON.parse(localStorage.getItem('joinedChannels') || '[]'); setJoinedChannels(joined); }, []); diff --git a/frontend/src/Pages/communityPage/ChannelPage.tsx b/frontend/src/Pages/communityPage/ChannelPage.tsx index 3630be93..5f3cfdda 100644 --- a/frontend/src/Pages/communityPage/ChannelPage.tsx +++ b/frontend/src/Pages/communityPage/ChannelPage.tsx @@ -24,7 +24,6 @@ import CloseIcon from '../../assets/images/close.svg'; import React_svg from '../../assets/images/react.svg'; import { authApi } from '../../api/auth'; -import { channelApi } from '../../api/channel'; import type { FindUserInfoResponse } from '../../types/auth'; interface Channel { @@ -45,33 +44,183 @@ interface Post { comments: string[]; } +// 더미 채널 데이터 (시현용) +const dummyChannels: Record = { + 1: { + channelId: 1, + channelName: '러닝 크루', + channelIntro: '함께 달리며 건강을 챙기는 러닝 커뮤니티입니다.', + description: '주말마다 함께 달리며 건강을 챙기는 크루입니다. 초보자도 환영합니다! 매주 토요일 아침 7시에 한강에서 모여요.', + hobbies: ['러닝', '운동', '건강'], + }, + 2: { + channelId: 2, + channelName: '홈쿠킹 연구소', + channelIntro: '집에서 새로운 요리 레시피를 공유하는 공간입니다.', + description: '집에서 맛있는 요리를 만들어보세요! 레시피 공유, 요리 팁, 재료 추천 등 다양한 정보를 나눕니다.', + hobbies: ['요리', '베이킹', '레시피'], + }, + 3: { + channelId: 3, + channelName: '독서 모임', + channelIntro: '매주 책을 읽고 이야기를 나누는 독서 동아리입니다.', + description: '매월 한 권의 책을 선정해서 함께 읽고 토론합니다. 다양한 장르의 책을 읽으며 새로운 관점을 얻어보세요.', + hobbies: ['독서', '토론', '글쓰기'], + }, + 4: { + channelId: 4, + channelName: '사진 찍는 사람들', + channelIntro: '일상의 순간을 카메라에 담는 사진 동호회입니다.', + description: '카메라, 스마트폰 상관없이 사진 찍는 것을 좋아하는 분들 모여주세요! 출사도 가고 사진 피드백도 나눕니다.', + hobbies: ['사진', '출사', '편집'], + }, + 5: { + channelId: 5, + channelName: '영화 리뷰 클럽', + channelIntro: '최신 영화부터 명작까지 리뷰를 공유하는 모임입니다.', + description: '매주 영화를 감상하고 리뷰를 공유합니다. 영화 추천, 감상평, 영화 관련 이야기를 나눠요.', + hobbies: ['영화', '리뷰', '감상'], + }, + 6: { + channelId: 6, + channelName: '캠핑 어디까지 가봤니', + channelIntro: '캠핑 장소와 장비 정보를 공유하는 캠핑 마니아 모임입니다.', + description: '전국 캠핑장 정보, 장비 리뷰, 캠핑 요리 레시피 등을 공유합니다. 같이 캠핑도 가요!', + hobbies: ['캠핑', '아웃도어', '자연'], + }, + 7: { + channelId: 7, + channelName: '보드게임 카페', + channelIntro: '다양한 보드게임을 함께 즐기는 게이머들의 공간입니다.', + description: '보드게임 좋아하시는 분들 모여주세요! 정기적으로 오프라인 모임도 가집니다.', + hobbies: ['보드게임', '전략', '모임'], + }, + 8: { + channelId: 8, + channelName: '식물 집사 모임', + channelIntro: '반려식물 키우기 팁과 경험을 나누는 모임입니다.', + description: '식물 키우기 초보부터 고수까지! 식물 관리법, 분갈이, 번식 방법 등을 공유합니다.', + hobbies: ['식물', '가드닝', '인테리어'], + }, +}; + +// 더미 게시글 데이터 (시현용) const initialPosts: Post[] = [ + // 러닝 크루 (channelId: 1) { postId: 1, channelId: 1, author: '홍길동', - content: '이번 주말에 러닝 같이 하실 분?', + content: '이번 주말에 러닝 같이 하실 분? 한강 반포지구에서 아침 7시에 만나요!', createdAt: '2025-12-17 10:00', - likes: 3, - comments: ['좋아요!', '같이 뛰어요!'], + likes: 12, + comments: ['좋아요!', '같이 뛰어요!', '저도 참여할게요!'], }, { postId: 2, channelId: 1, author: '김철수', - content: '새로운 러닝 코스 추천해요!', + content: '새로운 러닝 코스 추천해요! 올림픽공원 코스 진짜 좋습니다 👍', createdAt: '2025-12-16 14:30', - likes: 1, - comments: ['좋아요'], + likes: 8, + comments: ['좋아요', '다음에 가봐야겠네요'], }, { postId: 3, + channelId: 1, + author: '박지민', + content: '오늘 첫 10km 완주했어요! 🎉 다들 응원 감사합니다!', + createdAt: '2025-12-15 18:20', + likes: 25, + comments: ['축하해요!', '대단해요!', '다음 목표는 하프마라톤!'], + }, + // 홈쿠킹 연구소 (channelId: 2) + { + postId: 4, channelId: 2, author: '이영희', - content: '최근에 만든 초콜릿 케이크 레시피 공유합니다.', + content: '최근에 만든 초콜릿 케이크 레시피 공유합니다. 생크림 200ml, 다크초콜릿 150g...', createdAt: '2025-12-15 12:00', - likes: 2, - comments: ['맛있겠다!'], + likes: 18, + comments: ['맛있겠다!', '레시피 감사해요!'], + }, + { + postId: 5, + channelId: 2, + author: '최민수', + content: '에어프라이어로 치킨 만들어봤는데 진짜 바삭해요! 비법은 전분가루!', + createdAt: '2025-12-14 20:00', + likes: 32, + comments: ['대박!', '오늘 저녁 메뉴 정했다'], + }, + // 독서 모임 (channelId: 3) + { + postId: 6, + channelId: 3, + author: '정수현', + content: '이번 달 선정 도서는 "데미안"입니다. 다들 읽고 오세요~', + createdAt: '2025-12-10 09:00', + likes: 15, + comments: ['좋은 선정이에요!', '벌써 읽기 시작했어요'], + }, + { + postId: 7, + channelId: 3, + author: '김독서', + content: '"작은 아씨들" 감상평입니다. 시대를 초월한 메시지가...', + createdAt: '2025-12-08 21:30', + likes: 10, + comments: ['공감해요', '저도 인상깊게 읽었어요'], + }, + // 사진 찍는 사람들 (channelId: 4) + { + postId: 8, + channelId: 4, + author: '사진작가', + content: '오늘 출사 다녀왔어요! 일몰 사진 공유합니다 📷', + createdAt: '2025-12-16 19:00', + likes: 45, + comments: ['와 너무 예뻐요!', '어디서 찍으셨어요?', '색감 대박'], + }, + // 영화 리뷰 클럽 (channelId: 5) + { + postId: 9, + channelId: 5, + author: '영화광', + content: '듄2 봤는데요... 역대급입니다. 꼭 아이맥스로 보세요!', + createdAt: '2025-12-12 22:00', + likes: 28, + comments: ['동의합니다!', '사막신 진짜 압도적'], + }, + // 캠핑 (channelId: 6) + { + postId: 10, + channelId: 6, + author: '캠핑마스터', + content: '가평 ○○캠핑장 후기입니다. 시설 깨끗하고 뷰 최고!', + createdAt: '2025-12-11 15:00', + likes: 22, + comments: ['정보 감사합니다', '다음 주 가볼게요'], + }, + // 보드게임 카페 (channelId: 7) + { + postId: 11, + channelId: 7, + author: '게임러버', + content: '이번 주 토요일 오프라인 모임 있습니다! 강남역 3시 집합!', + createdAt: '2025-12-13 10:00', + likes: 16, + comments: ['참여할게요!', '몇 명 모였나요?'], + }, + // 식물 집사 모임 (channelId: 8) + { + postId: 12, + channelId: 8, + author: '식물덕후', + content: '몬스테라 분갈이 했어요! 뿌리가 화분을 뚫고 나왔었네요 😅', + createdAt: '2025-12-14 11:00', + likes: 19, + comments: ['건강하게 잘 자랐네요', '저도 분갈이 해야하는데'], }, ]; @@ -97,42 +246,28 @@ function ChannelPage() { }, []); useEffect(() => { - const fetchChannel = async () => { - if (!id) return; + // 더미 데이터 사용 (시현용) + if (!id) return; + + setLoading(true); + setTimeout(() => { + const channelId = Number(id); + const dummyChannel = dummyChannels[channelId]; - try { - setLoading(true); - const response = await channelApi.getChannel(Number(id)); - if (response.success && response.data) { - const data = response.data; - const hobbies: string[] = []; - if (data.linkedHobbyName1) hobbies.push(data.linkedHobbyName1); - if (data.linkedHobbyName2) hobbies.push(data.linkedHobbyName2); - if (data.linkedHobbyName3) hobbies.push(data.linkedHobbyName3); - - setChannel({ - channelId: data.channelId, - channelName: data.channelTitle, - channelIntro: data.channelIntro, - description: data.channelDescription, - hobbies: hobbies, - }); - } - } catch (error) { - console.error('채널 정보 조회 실패:', error); + if (dummyChannel) { + setChannel(dummyChannel); + } else { + // 더미 데이터에 없는 채널 ID인 경우 기본값 설정 setChannel({ - channelId: Number(id), - channelName: '알 수 없는 채널', - channelIntro: '', - description: '', - hobbies: [], + channelId: channelId, + channelName: `채널 ${channelId}`, + channelIntro: '채널 소개입니다.', + description: '채널 상세 설명입니다.', + hobbies: ['취미1', '취미2'], }); - } finally { - setLoading(false); } - }; - - fetchChannel(); + setLoading(false); + }, 200); }, [id]); useEffect(() => {