fromis_9/frontend/src/App.jsx
caadiq 3339b281c7 feat: 갤러리 최적화 및 라우터 개선
- 컨셉 포토 갤러리 페이지 추가 (AlbumGallery.jsx)
- react-photo-album 라이브러리로 Justified 레이아웃 구현
- 썸네일/원본 이미지 분리 (thumb_400, original 폴더)
- 라우터 변경: /discography → /album
- URL 형식 변경: ID 기반 → 앨범명 기반 (/album/하얀 그리움)
- 앨범명 기반 API 추가 (/api/albums/by-name/:name)
- 브레드크럼 스타일 네비게이션 적용
- 라이트박스 슬라이드 애니메이션 추가
- 점 형태 인디케이터로 변경
2026-01-01 17:20:36 +09:00

43 lines
1.7 KiB
JavaScript

import { BrowserRouter, Routes, Route } from 'react-router-dom';
import { BrowserView, MobileView } from 'react-device-detect';
// PC 페이지
import PCHome from './pages/pc/Home';
import PCMembers from './pages/pc/Members';
import PCDiscography from './pages/pc/Discography';
import PCAlbumDetail from './pages/pc/AlbumDetail';
import PCAlbumGallery from './pages/pc/AlbumGallery';
import PCSchedule from './pages/pc/Schedule';
// PC 레이아웃
import PCLayout from './components/pc/Layout';
function App() {
return (
<BrowserRouter future={{ v7_startTransition: true, v7_relativeSplatPath: true }}>
<BrowserView>
<PCLayout>
<Routes>
<Route path="/" element={<PCHome />} />
<Route path="/members" element={<PCMembers />} />
<Route path="/album" element={<PCDiscography />} />
<Route path="/album/:name" element={<PCAlbumDetail />} />
<Route path="/album/:name/gallery" element={<PCAlbumGallery />} />
<Route path="/schedule" element={<PCSchedule />} />
</Routes>
</PCLayout>
</BrowserView>
<MobileView>
{/* 모바일 버전은 추후 구현 */}
<div className="flex items-center justify-center h-screen bg-gray-100 p-4">
<div className="text-center">
<p className="text-xl font-bold text-primary mb-2">fromis_9</p>
<p className="text-gray-500">모바일 버전은 준비 중입니다.</p>
</div>
</div>
</MobileView>
</BrowserRouter>
);
}
export default App;