docs(changes): 비주얼 레이어 리디자인 변경 로그

bibimbap.css 신설 + 9단위 JSP 비주얼 이식 결과·하드제약 준수·
L1/L2 검증·errer JSTL taglib 결함 수정·needs_user_verification 기록.
docs/changes/index.md 링크 추가.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
이정수 2026-06-30 16:42:42 +09:00
parent 8c86e8c4e1
commit f87aeee34b
2 changed files with 69 additions and 0 deletions

View File

@ -0,0 +1,68 @@
# 2026-06-30 클로드 디자인 리디자인 — 비주얼 레이어 9단위 반영
**세션**: sid 20260630-160000
**브랜치**: feat/v2
**커밋**: `0390da6` ~ `360078a` (단위별 8개) + graph 메타 `8c86e8c`
## 요약
클로드 디자인 리디자인 산출물을 "비주얼 레이어" 방식으로 전 페이지에 반영했다.
파일 통째 교체 없이 마크업·클래스만 이식하고 모델명·CSRF·AJAX·include·자체 head는 기존값을 전부 보존했다.
---
## 변경 범위
| 단위 | 내용 |
|---|---|
| 1 — CSS 신설 | `src/main/webapp/css/bibimbap.css` 신설 (다크 오버라이드 포함). `WEB-INF/views/theme-init.jsp` 단일 link 태그로 23개 전 페이지 공통 적용. |
| 2 — 빈 상태 fragment | `fragments/posts-empty.jspf`, `fragments/recruit-empty.jspf` 신설. `posts-list.jsp`, `recruit-list.jsp` 에서 include. |
| 3 — 홈 | `index.jsp` — 히어로 섹션·정렬 칩·그리드 레이아웃 클래스 이식. |
| 4 — 인증 | `login.jsp` — pw-toggle·에러 슬롯. `signup.jsp` — 강도 막대·일치 표시. |
| 5 — 약관 | `terms.jsp` — sticky TOC 구조 이식. |
| 6 — 프로필 | `profile.jsp``.profile-head`·`.game-row` 클래스 이식. |
| 7 — 게임 상세 | `game-detail.jsp` — 이미 동일 토큰 구현 확인 → **no-op**. |
| 8 — 에러 | `errer.jsp` — empty-state 외형(SVG/아이콘) 이식. 기존 scriptlet `statusCode` 읽기 유지. |
| 9 — 모집 작성 | `recruit-form.jsp` — 필수 표시·글자수 카운터·sticky 미리보기 이식. |
---
## 하드 제약 준수
| 제약 | 처리 |
|---|---|
| 모델명 보존 | 디자인 EL(`${errorData}` 등) 미채택. 기존 `${game.title}`, `${ctx}` 등 유지. |
| CSRF 이중방어 | `_csrf` hidden + `BibimbapCsrf.headers` AJAX 헤더 — 기존 코드 무수정 보존. |
| include 경로 | `/WEB-INF/views/header.jsp` 등 기존 include 경로 전부 유지. |
| CDN 0 | 외부 CDN 참조 추가 없음. |
| 미존재 라우트 비노출 | `/games/{id}/visibility`, `/profile/edit`, `/password/reset` UI 요소 미채택. |
| game-detail 보존 | 이미 동일 토큰 구현 상태 확인 후 no-op 처리. |
---
## 검증 결과
| 레벨 | 결과 |
|---|---|
| L1 — WAR 빌드 | `./mvnw -q -DskipTests package` exit 0 PASS |
| L1 — CSS WAR 포함 | `target/.../css/bibimbap.css` 존재 확인 PASS |
| L2 — 스모크 | 로컬 dev 재기동 후 `/`, `/login`, `/signup`, `/terms`, `/posts`, `/recruit`, `/error` 전부 HTTP 200 |
| L2 — 결함 수정 | `errer.jsp` stray `javax` JSTL taglib → `/error` 500 → taglib 제거 → 200 (fix 커밋 `360078a`) |
| L2 — 마커 검증 | home css link+hero, login pw-toggle, signup pw-meter, terms toc, error empty-state 서빙 확인 |
---
## needs_user_verification (브라우저 세션 필요)
- 로그인 인터랙티브 제출: AJAX(`_csrf` + `BibimbapCsrf.headers`) 성공·리다이렉트. 테스트 계정 `admin@bibimbap.local`.
- 회원가입 제출 → modal → `/login` 리다이렉트.
- 프로필: 닉네임·아바타 변경 AJAX (로그인 세션 필요).
- 게임 상세: WebGL 플레이·6축 리뷰·댓글 CRUD (no-op이나 회귀 확인 권장).
- 모집 작성: `/recruit/new` 제출 성공 + 라이브 미리보기.
- 다크모드 토글 시 body ↔ header/footer 색 정합 육안 확인.
---
## 관련 문서
- [docs/changes/2026-06-29-b2-b4-fe-hardening.md](./2026-06-29-b2-b4-fe-hardening.md) — FE 다크모드 대비·세션 하드닝 (선행 작업)

View File

@ -11,3 +11,4 @@
- [2026-06-24-w2-jam-platform.md](./2026-06-24-w2-jam-platform.md) — W2 게임잼 워크스트림 전체(W2-1~6) 구현. 잼 엔티티/라이프사이클(jams/jam_teams/jam_team_members/jam_entries/jam_status_log) + 심사위원 역할(jam_judges 잼스코프) + 평가 동결 스키마(jam_criteria/jam_scores/jam_votes/jam_awards + jam_score_stats VIEW, 평가단위 (jam_id,game_id) 활성 자연키) + 심사 평가(3중게이트 UPSERT 가중집계) + 인기투표(1인1표 UNIQUE·종료후 공개) + 시상 집계(3트랙+가중 GRAND·CLOSED 확정 멱등). GAME_JAM_MANAGE 첫 enforcement 연결·잼스코프 isJudge·평가기간 게이트·CSRF 전수. 6 커밋 ccf1e42~a74bf74. 최종 L1 190/190 GREEN(회귀 0), L2 dev DB contract 전 PASS(격리 throwaway DB). dev DB 마이그레이션·L3 스모크 needs_user_verification. - [2026-06-24-w2-jam-platform.md](./2026-06-24-w2-jam-platform.md) — W2 게임잼 워크스트림 전체(W2-1~6) 구현. 잼 엔티티/라이프사이클(jams/jam_teams/jam_team_members/jam_entries/jam_status_log) + 심사위원 역할(jam_judges 잼스코프) + 평가 동결 스키마(jam_criteria/jam_scores/jam_votes/jam_awards + jam_score_stats VIEW, 평가단위 (jam_id,game_id) 활성 자연키) + 심사 평가(3중게이트 UPSERT 가중집계) + 인기투표(1인1표 UNIQUE·종료후 공개) + 시상 집계(3트랙+가중 GRAND·CLOSED 확정 멱등). GAME_JAM_MANAGE 첫 enforcement 연결·잼스코프 isJudge·평가기간 게이트·CSRF 전수. 6 커밋 ccf1e42~a74bf74. 최종 L1 190/190 GREEN(회귀 0), L2 dev DB contract 전 PASS(격리 throwaway DB). dev DB 마이그레이션·L3 스모크 needs_user_verification.
- [2026-06-29-b2-b4-fe-hardening.md](./2026-06-29-b2-b4-fe-hardening.md) — B2 프로토타입 dead code 제거(abstracts 4파일·header.jspf·GameCatalog 삭제, 없는 게임 ID = HTTP 404) + B4 의존성/세션 하드닝(Spring Boot 3.5.16 GA·snapshot repo 제거·쿠키 HttpOnly/SameSite·로그 WARN·OWASP DC plugin 비bind·profile properties 신규) + FE 다크모드 대비·검색 접이식·터치타깃. mvn test 361 PASS. - [2026-06-29-b2-b4-fe-hardening.md](./2026-06-29-b2-b4-fe-hardening.md) — B2 프로토타입 dead code 제거(abstracts 4파일·header.jspf·GameCatalog 삭제, 없는 게임 ID = HTTP 404) + B4 의존성/세션 하드닝(Spring Boot 3.5.16 GA·snapshot repo 제거·쿠키 HttpOnly/SameSite·로그 WARN·OWASP DC plugin 비bind·profile properties 신규) + FE 다크모드 대비·검색 접이식·터치타깃. mvn test 361 PASS.
- [2026-06-30-screenshot-guide-auth.md](./2026-06-30-screenshot-guide-auth.md) — 스크린샷 가이드 인증 흐름 추가. 비인증 7장 → 인증 포함 최대 14장. Playwright AJAX 로그인(expect_navigation) + SCREENSHOT_EMAIL/PASSWORD env var 분기 + 리뷰/댓글 composer hidden 강제 노출 폴백. - [2026-06-30-screenshot-guide-auth.md](./2026-06-30-screenshot-guide-auth.md) — 스크린샷 가이드 인증 흐름 추가. 비인증 7장 → 인증 포함 최대 14장. Playwright AJAX 로그인(expect_navigation) + SCREENSHOT_EMAIL/PASSWORD env var 분기 + 리뷰/댓글 composer hidden 강제 노출 폴백.
- [2026-06-30-visual-redesign-bibimbap-css.md](./2026-06-30-visual-redesign-bibimbap-css.md) — 클로드 디자인 리디자인 비주얼 레이어 9단위 반영. bibimbap.css 신설 + theme-init 공통 link + 빈상태 fragment 2종 + 홈/인증/약관/프로필/에러/모집 마크업·클래스 이식. game-detail no-op. 커밋 8개, L2 스모크 전 페이지 200(errer JSTL taglib 결함 포착·수정). 인터랙티브 제출·다크모드는 needs_user_verification.