노트

design-page/theme 오늘 변경 노트

2026-08-24

#작업#Next.js#노트

오늘은 design-page/theme worktree 쪽 변경을 따로 읽을 수 있게 정리했다. 홈 화면은 그대로 두고, 상세 기록은 /notes 로 분리했다. 이 노트는 그 작업 내용을 한 번에 읽을 수 있게 묶은 기록이다.

바뀐 것

• 홈 상단에 노트 진입 버튼을 넣었다.
• 홈은 Tracker 중심 흐름을 유지했다.
• qb-theme 와 qb-begs 를 effect 안에서 바로 setState 하지 않도록 정리했다.
• localStorage 값은 lazy init 으로 읽게 바꿨다.
• /notes 정적 라우트를 새로 만들었다.
• 노트 페이지는 파일 단위 요약, 테마, 데이터/그래프, 보조 노트, 현재 정리를 카드 형태로 보여 준다.
• 같은 스티커 톤을 유지하도록 공통 CSS도 추가했다.

파일 단위

src/components/Tracker.tsx

• Link 로 노트 버튼 추가.
• 브랜드 링크도 Link 로 바꿨다.
• theme 와 begs 초기값을 lazy init 로 바꿔 lint 경고를 없앴다.
• 기존 히어로, 통계, 공지 피드, 펼치기/접기 흐름은 유지했다.

src/app/notes/page.tsx

• 새 노트 페이지 추가.
• 메타데이터는 노트 | Quota Board.
• 홈, 테마, 데이터, 보조 노트, 현재 정리 섹션으로 분리했다.
• 2026-08-24 기준 어떤 파일이 왜 바뀌었는지 읽히게 썼다.

src/app/globals.css

• masthead-actions 추가.
• 노트용 note-hero, note-meta, note-grid, note-card, note-list 스타일 추가.
• 기존 종이색 배경, 하드 보더, 오프셋 섀도 톤은 유지했다.

확인

• npm run lint 성공.
• npm run build 성공.
• 정적 라우트 /, /notes, /_not-found 생성 확인.

왜 이렇게 했나

홈은 가볍게 두고, 변경 기록은 별도 노트로 분리해야 나중에 다시 보기 쉽다. 오늘처럼 파일이 여러 개 바뀌는 작업은 특히 요약 페이지가 있으면 추적이 편하다.

한 줄 결론

오늘 변경은 “홈 유지 + /notes 분리 + lint/build 통과”다.

댓글

GitHub 계정으로 답니다. 내용은 이 저장소 Discussions에 남습니다.