Feat[#245]: 랜딩 페이지 SSR 적용 및 클랜 모집 슬라이더 배너 구현

[designsoo]

관련 문서

• issue: Feat: 랜딩 페이지 SSR 적용 및 클랜 모집 슬라이더 배너 구현 #245
• close Feat: 랜딩 페이지 SSR 적용 및 클랜 모집 슬라이더 배너 구현 #245

유형

• 기능 구현
• UI 구현
• 리팩토링
• 버그 해결
• 문서 업데이트
• 기타( )

작업 내용

• 랜딩페이지 클랜 모집 구현

설명

📌 기능

• SSR 및 react-query를 적용하여 랜딩 페이지에서 모든 게임 리스트를 서버로부터 받아옵니다.
• 게임 카테고리별로 포스트를 필터링하여 최신 3개의 포스트를 슬라이더에 표시합니다.

📌 UI

• 총 12개의 게임 카테고리 클랜 포스트로 구성된 슬라이더 카드 아이템을 제공합니다.
• 클랜 모집 카드의 기본 및 hover 상태 디자인을 구현하였습니다.
• PC 이하 디바이스에서는 hover 상태를 제거하고 활성 상태로 고정된 디자인을 유지합니다.
• 태블릿 이상의 크기에서는 사용자가 직접 슬라이더를 이동할 수 있는 슬라이더로 변경됩니다.
• 클랜 모집 카드 컴포넌트를 구현했습니다.
• 슬라이더 버튼 컴포넌트를 구현했습니다.

스크린샷

🎥 모션 영상

slider.mov