Repository navigation
v1.1.0 — 보안 수정과 접근성 개선
QA 두 건(기능·보안 / UX·UI)에서 나온 항목을 반영했다. 36 files changed, +1037 −83
관련 PR: #32 (시스템 층) · #33 (컴포넌트) · #34 (릴리즈)
🔒 보안
JSON-LD 저장형 XSS 차단
JSON.stringify는 JSON 문법만 이스케이프하고 HTML 문법은 통과시킨다.
질문 제목·본문·답변·작성자 이름 중 어디든 </script>가 들어가면 스크립트 태그가 조기 종료됐다.
로그인한 사용자 누구나 질문 하나로 그 상세 페이지를 보는 모든 사람의 브라우저에서 임의 스크립트를 실행할 수 있었다.
세션 쿠키는 httpOnly라 직접 탈취는 안 되지만, 그 스크립트는 이미 피해자 세션으로 서버 액션을 호출할 수 있다.
♿ 접근성
색 대비를 WCAG AA로 재산정 — 흰색·muted·page·brand-subtle 네 배경 전부에서 검증했다.
| 토큰 | 이전 | 이후 |
|---|---|---|
tertiary |
3.04:1 | 5.11:1 |
secondary |
4.62:1 | 5.84:1 |
like (오류 문구) |
3.71:1 | 5.14:1 |
| 플레이스홀더 | 1.40:1 | 4.89:1 |
| 컨트롤 테두리 | 1.23:1 | 3.32:1 |
| 아바타 3색 | 2.34~4.38:1 | 4.51:1+ |
tertiary는 11~14px 텍스트 19개 파일에 쓰이고 있었고, 빈 상태 문구와 에러 화면 설명이 전부 여기 걸려 있었다 —
사용자가 막혔을 때 읽어야 하는 문구가 가장 안 읽히는 색이었다.
그 외:
word-break: keep-all— 없어서 한국어·일본어가 어절 중간에서 끊겼다prefers-reduced-motion— 스켈레톤 pulse가 전 화면에 무조건 깔려 있었다- safe-area —
viewport-fit=cover를 켠 채env()를 쓰지 않아 탭바·랜딩 로그인 버튼·답변 입력창이 홈 인디케이터에 깔렸다 h1구조 — 홈·질문 작성·알림·프로필 수정 네 화면에h1이 없었다. 본문 건너뛰기 링크도 신규- 삭제 확인 모달 — 포커스 가두기, 닫을 때 원래 버튼으로 복귀, 배경 스크롤 잠금
✨ 동작 변경
Toast 추가 — 성공·실패를 알리는 층이 아예 없었다.
좋아요·투표 실패를 알린다. 그전에는 낙관적 UI로 즉시 반영한 뒤 실패하면
"잠깐 반영됐다가 슬쩍 되돌아가는" 화면만 보였다. 이유도 재시도 안내도 없었다.
서버 액션 3개가 성공 여부를 반환하도록 바꿨다.
좋아요 실패가 페이지 전체를 날리던 버그 수정.
상세 페이지를 열어둔 사이 작성자가 그 질문을 지우면, 하트를 누르는 순간 화면이 통째로 에러 페이지로 교체됐다.
제출 버튼 비활성 제거. 비활성 버튼은 무엇이 빠졌는지 알려주지 않고 스크린리더가 건너뛴다.
이제 항상 누를 수 있고, 부족한 필드로 스크롤 + 포커스가 이동한다.
일본어 문구 폭 — プロフィール編集이 메뉴 폭을 넘어 두 줄로 접히던 것 수정.
⚠️ 눈에 띄는 변화
색 토큰을 바꿨기 때문에 모든 화면의 외관이 조금씩 달라진다.
- 회색 텍스트가 전반적으로 진해짐
- 칩 · 좋아요 버튼 · 투표 선택지의 테두리가 눈에 띄게 진해짐 (
#e5e8eb→#808f9d) - 빨간색이 깊어짐 (
#f04452→#da1122) - 하단 고정 요소가 홈 인디케이터 위로 올라옴
Figma 토큰과 값이 어긋난 상태다. 코드 주석은 여전히 Figma 토큰명을 가리키므로, Figma 쪽도 맞춰야 한다.
검증
lint / typecheck / build 통과, 36/36 정적 페이지
빌드 CSS env() 7개 · keep-all · reduced-motion · color-scheme 생성 확인
런타임(비로그인) 전 공개 라우트 정상, JSON-LD 파싱 정상, skip link ko/ja 확인
로그인이 필요한 화면(h1 4개 · 토스트 위치 · 삭제 모달 키보드 순환)은 자동 검증하지 못했다.
다음
캐시 태그 정리(questionTag가 죽은 태그라 좋아요 하나에 전체 질문 목록 캐시가 날아간다),
revalidatePath("/home") 무효화, Accept-Language 미반영, CI에 next build 추가.