프로젝트 초기 상태를 기준으로 저장소를 재구성하고 업로드 규칙을 정비한다. 이미지 자산은 Git LFS를 통해 원격 용량 제한에 대응한다. Made-with: Cursor
69 lines
2.7 KiB
Markdown
69 lines
2.7 KiB
Markdown
# 기술 명세
|
|
|
|
## 프로젝트 개요
|
|
- 목적: 보유 중인 닌텐도 스위치 게임 목록을 웹에서 조회, 필터링, 정렬, 상세 확인한다.
|
|
- 형태: 정적 HTML + ES Module JavaScript 기반 단일 프론트엔드.
|
|
- 빌드: Tailwind CSS CLI를 사용해 스타일 파일을 생성/관리한다.
|
|
|
|
## 화면/라우팅
|
|
- 목록 화면: `index.html`
|
|
- 주요 기능: 검색, 필터(언어/상태/국가/CERO), 정렬, 게임 개수 표시
|
|
- 데이터 소스: `db/nsw.db.js`
|
|
- 스크립트: `script/nsw.js`
|
|
- 상세 화면: `nsw-detail.html`
|
|
- 주요 기능: 게임 기본 정보/구매 정보 상세 표시
|
|
- 진입 방식: `nsw-detail.html?no={gameNo}`
|
|
- 데이터 소스: `db/nsw.db.js`
|
|
- 스크립트: `script/nsw-detail.js`
|
|
|
|
## 데이터 구조
|
|
- 파일: `db/nsw.db.js`
|
|
- 형태: `export default []` 배열
|
|
- 주요 필드:
|
|
- `no` (number): 게임 고유 순번
|
|
- `title` (string): 일본어/원문 타이틀
|
|
- `koTitle` (string|null): 한국어 타이틀
|
|
- `image` (string): 상세 이미지 경로
|
|
- `thumbnail` (string): 목록 썸네일 경로
|
|
- `platform` (string): 플랫폼명
|
|
- `requiredCapacity` (string|null): 필요 용량
|
|
- `playMode` (string|null): 플레이 모드
|
|
- `playUser` (string|null): 플레이 인원
|
|
- `localPlayUser` (string|null): 로컬 통신 인원
|
|
- `onlinePlayUser` (string|null): 온라인 통신 인원
|
|
- `compatibleController` (string|null): 대응 컨트롤러
|
|
- `onlineDataSave` (string|null): 세이브 데이터 보관 지원 여부
|
|
- `maker` (string|null): 메이커
|
|
- `language` (string|null): 지원 언어 목록
|
|
- `release` (string|null): 출시일(예: `2017年7月20日`)
|
|
- `tags` (string|null): 장르/특성 태그
|
|
- `extension` (string[]|null): 추가 콘텐츠 목록
|
|
- `status` (string): `package` | `download` | `expansion` | `sold`
|
|
- `country` (string): `KOR` | `JPN`
|
|
- `cero` (string|null): CERO 등급
|
|
- `purchaseInformation` (object|null):
|
|
- `date` (string|null)
|
|
- `store` (string|null)
|
|
- `purchase` (number|null)
|
|
- `monetary` (string|null)
|
|
- `orderNumber` (string|null)
|
|
|
|
## 필터/정렬 동작
|
|
- 필터:
|
|
- 언어 필터: 한국어 지원/미지원
|
|
- 상태 필터: `status` + `extension` 보유 여부
|
|
- 국가 필터: `country`
|
|
- CERO 필터: `cero`
|
|
- 정렬:
|
|
- 순번 최신/과거
|
|
- 발매일 최신/과거
|
|
- 구매일 최신/과거
|
|
- 무작위
|
|
|
|
## 스타일/에셋
|
|
- 스타일 소스: `style/tailwind.css`
|
|
- 이미지:
|
|
- 목록/상세에서 `images/nsw` 하위 이미지를 참조
|
|
- 데이터 레코드의 `image`, `thumbnail` 필드로 렌더링
|
|
- 원격 업로드 용량 제한 대응을 위해 `images/**`는 Git LFS 관리 대상으로 지정한다.
|