feat(site): 콘텐츠 탐색과 읽기 경험 개선 - #113
Conversation
홈 글 카드와 필터 패널을 의미 기반 반경과 무그림자 상태로 정리했습니다. 모바일 가로 거터를 16px로 조정하고 인기순 전환과 모바일 폭 회귀 테스트를 추가했습니다.
정보 제공 사이트의 읽기 위계를 명확히 하기 위해 UI 기준을 16px, 본문을 17px로 조정했습니다. 카드 제목과 메타 정보에 의미 기반 타입 토큰을 적용하고 ADR과 회귀 테스트를 추가했습니다.
검토 전 원고와 placeholder가 실수로 공개되지 않도록 생성기, schema, repository, 품질 감사의 기본 visibility를 private로 통일했습니다. 공개는 명시적인 승격으로만 가능하도록 ADR과 회귀 테스트를 추가했습니다.
첫 방문자가 작성자와 콘텐츠 가치를 바로 이해할 수 있도록 홈에 명확한 H1과 소개 문장을 추가했습니다. 검토된 대표 기술 글 4개를 먼저 읽을 경로로 큐레이션하고 전체 피드와 제목 구조를 분리했습니다.
NDA, 외부 사실 출처, 현재성 검토가 필요한 글 4편을 삭제하지 않고 private로 전환했습니다. 대표 글 큐레이션 정책 테스트를 갱신하고 최신 에세이의 중복 제목을 제거했습니다.
데스크톱 AppShell과 모바일 window를 하나의 스크롤 소스로 관찰해 읽기 진행률과 분석 이벤트를 정확히 계산합니다. 모바일 표를 본문 안에서 가로 스크롤하도록 수정하고 테마 변경 시 댓글 iframe이 재생성되지 않게 했습니다.
모바일 글 상세에서도 현재 섹션을 표시하고 닫힌 drawer를 키보드 탐색에서 제외했습니다. 연락처 이메일을 단일 설정으로 맞추고 redirect URL을 sitemap에서 제거했으며 한국어 404 복구 화면을 추가했습니다.
홈을 요청 시점에 렌더링하고 중복 제거를 통과한 조회를 일별로 집계하도록 Supabase 계약을 확장했습니다. 최근 기간 합계를 반환하는 제한된 RPC와 배포 순서 ADR, schema 회귀 테스트를 추가했습니다.
404를 반환하던 원격 폰트 요청을 제거하고 한국어를 지원하는 Pretendard를 OG route에 번들했습니다. 실제 ImageResponse가 비어 있지 않은 PNG를 반환하는 회귀 테스트를 추가했습니다.
일부 이모지에만 쓰이는 6MB OTF가 모든 첫 방문을 막지 않도록 preload를 제거했습니다. 본문용 Pretendard는 유지하고 TossFace는 unicode-range에 맞을 때만 요청되도록 회귀 테스트를 추가했습니다.
공용 MDX 매핑에서 Three.js 시각화를 제거하고 사용하는 글만 각 컴포넌트를 lazy import하도록 변경했습니다. 일반 글이 무거운 시각화 vendor chunk를 받지 않도록 ADR과 경계 테스트를 추가했습니다.
전역 모든 요소에 걸린 색상 transition을 제거하고 5개 clip-path 화면 레이어를 단일 opacity 레이어로 줄였습니다. reduced/off 모션 정책을 유지하면서 테마 변경 끊김을 낮추는 회귀 테스트를 추가했습니다.
PR과 master push에서 lint, 문서, 콘텐츠 감사, 단위 테스트, production build, Playwright를 같은 명령으로 실행합니다. 실패한 브라우저 결과를 artifact로 남기고 중복 실행을 취소하도록 ADR과 workflow를 추가했습니다.
글 목록을 두 번 조회해 전체 frontmatter와 내부 품질 메모를 전달하던 경로를 하나로 합쳤습니다. 검색에 필요한 공개 DTO만 만들고 AppShell은 slug와 category만 의존하도록 타입과 회귀 테스트를 정리했습니다.
삭제한 local Tasty 분석 폴더 대신 llm-wiki source note를 근거로 남겼습니다. Ark의 콘텐츠 중심 typography 결정은 브랜드 복제 없이 유지합니다.
홈의 핵심 메시지와 의미가 겹치는 보조 문장을 제거했습니다. 대표 글 영역이 더 빠르게 보이도록 소개 영역을 간결하게 유지합니다.
Hero와 먼저 읽을 글 섹션을 제거하고 최근 기록을 페이지 주 제목으로 변경했습니다. 더 이상 사용하지 않는 추천 글 선택 로직과 전용 컴포넌트 및 카드 변형도 함께 정리했습니다.
홈의 정렬 선택 UI와 런타임 인기 조회 경로를 제거했습니다. 카테고리 필터는 저장소의 최신순을 보존하고 홈을 정적 생성으로 되돌렸습니다. 글 상세의 누적 조회수와 중복 방지 계약은 유지했습니다.
Edge Function에 번들된 한글 폰트가 Vercel 배포 용량 제한을 초과했습니다. OG Route Handler를 Node.js runtime으로 전환하고 폰트를 파일 시스템에서 지연 로드하도록 변경했습니다. 실제 폰트 PNG 테스트와 ADR로 배포 계약을 고정했습니다.
Vercel Node.js 함수에서 번들된 URL 객체를 readFile 경로로 인식하지 못해 OG endpoint가 500을 반환했습니다. process.cwd() 기준 문자열 경로로 폰트 위치를 계산해 배포 환경에서도 같은 파일을 읽도록 변경했습니다.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 76bce58dc5
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| pull_request: | ||
| push: | ||
| branches: | ||
| - master |
There was a problem hiding this comment.
In this checkout the long-lived branch is main and there is no master branch, so this push.branches filter prevents the new Quality workflow from running on merges or direct pushes to the actual release branch. The workflow still runs for PRs, but the post-merge/release quality gate is skipped; point this at main or include both branch names.
Useful? React with 👍 / 👎.
| data-page-scroll-container | ||
| className="min-h-[calc(100vh-56px)] pb-8 md:min-h-0 md:flex-1 md:overflow-y-auto md:pb-0" |
There was a problem hiding this comment.
On desktop this persistent element becomes the page scroller (md:overflow-y-auto), but nothing resets its scrollTop when pathname changes. After a user scrolls the home feed or an article and navigates to another route, the new page reuses the same AppShell scroll container at the old offset, so articles can open halfway down with the reading progress already visible; add a pathname effect to scroll this container back to the top.
Useful? React with 👍 / 👎.
홈을 최신순 단일 피드로 단순화하고 읽기 경험, 콘텐츠 공개 정책, 성능 및 배포 안정성을 개선합니다.
1 participant
변경 내용
의도
방문자가 홈에서 글을 빠르게 탐색하고 모바일과 데스크톱에서 안정적으로 읽을 수 있도록 블로그 경험을 정리합니다. 운영 환경에서 동작하지 않던 인기순 기능은 노출하지 않고 최신순을 유일한 정렬 기준으로 유지합니다.
영향 범위
검증
npm run build체크리스트
codex/home-content-discovery-mobile)에서 진행함