Skip to content

Latest commit

 

History

History
87 lines (61 loc) · 4.62 KB

File metadata and controls

87 lines (61 loc) · 4.62 KB

AGENTS.md

gitmoru 소개 사이트입니다. 작업 전에 아래를 보세요.

전부 읽을 필요는 없습니다. 하려는 일에 해당하는 것만 보면 됩니다.

무엇을 하려고 하나요

하려는 일 먼저 볼 것
문구를 고친다 WRITING.md, src/i18n/ui.ts
페이지를 더한다 아래 페이지 더하기
색이나 여백을 만진다 src/styles/tokens.css
모루를 만진다 아래 모루
앱 화면을 다시 찍는다 pnpm shots
공유 카드를 다시 만든다 pnpm og
배포를 손본다 .github/workflows/deploy.yml
검색 엔진 소유 확인 src/i18n/verify.ts

올리기 전에

pnpm check

astro build타입을 안 봅니다. 문구를 엉뚱한 블록에 넣어도 빌드는 통과하고 화면만 빈칸이 됩니다. 실제로 그렇게 두 군데가 비어 있었어요. pnpm check 가 그걸 잡습니다.

cookie 가 devDependencies 에 있는 건 우리가 쓰는 게 아니에요. astro 가 구워낸 prerender 진입점이 cookie 를 그대로 남겨두는데, pnpm 은 그걸 node_modules 맨 위에 안 올려놔서 빌드 막바지에 못 찾습니다. 직접 적어두면 그 자리에 놓입니다. 지우면 빌드가 깨져요.

문구

한국어가 원본입니다. src/i18n/ui.tsko 가 타입의 출처이고, enja 는 같은 모양을 채웁니다. 하나라도 빠지면 타입 검사가 걸립니다.

문구를 더할 때 어느 하위 블록에 넣는지 보세요. home 에 넣고 /mcp 에서 읽으면 화면이 조용히 빈칸이 됩니다. 실제로 두 번 그랬습니다.

seoTitleseoDesc 는 화면에 안 뜹니다. 브라우저 탭과 검색 결과에만 보이는 자리라, 사람들이 실제로 치는 말(force push 되돌리기, undo force push)을 넣습니다. 화면에 뜨는 h1 은 우리 말투를 지키고요. 이 둘을 섞지 마세요.

옮기지 말고 그 언어로 다시 쓰세요. 규칙은 WRITING.md 에 있고, 특히 일부러 어기는 것 셋을 먼저 보세요. 토스나 당근 원칙을 그대로 가져오면 이 제품에서는 오히려 해로운 게 섞여 있습니다.

페이지 더하기

  1. src/i18n/config.tsPAGES 에 이름을 넣습니다
  2. src/i18n/ui.ts 세 언어에 문구 블록을 만듭니다
  3. src/sections/<이름>.astro 에 내용을 씁니다
  4. src/pages/<이름>.astrosrc/pages/[lang]/<이름>.astro 에 얇은 라우트를 만듭니다

PAGES 에 안 넣으면 사이트맵과 언어 링크에서 빠집니다.

앱에서 가져옵니다. 사이트가 자기 팔레트를 고르는 순간 브랜드가 갈라져요. 앱에서 색을 바꾸면 tokens.css 도 같이 바꿉니다.

빨강은 어디에도 쓰지 않습니다. 이 도구는 판정하지 않아요.

새 CSS 는 반드시 레이어 안에 넣으세요. Tailwind v4 는 유틸리티를 @layer utilities 에 넣는데, 레이어 밖에 쓴 규칙은 특정도와 상관없이 그걸 전부 이깁니다. a { color: inherit } 하나 때문에 버튼 글씨가 전부 흰색으로 뒤집힌 적이 있습니다.

모루

src/lib/sprites.ts앱에서 복사한 것입니다. 손으로 고치지 마세요. 모루가 앱과 사이트에서 다르게 생기면 그때부터 캐릭터가 아닙니다.

새 동작은 앱(~/gitmoru)에 먼저 넣고 pnpm sprites 로 눈으로 확인한 뒤 이 파일을 다시 복사합니다. 그 검사기는 앞발이 세 개나 네 개가 되는 걸 잡아줍니다. 실제로 그런 적이 있어요.

흙 위에 그냥 얹으면 안 보입니다. 몸통이 #6f5442, 표토가 #6d5138 이라 대비가 1.05 예요. 실루엣에 테두리를 둘러서 풉니다 (src/lib/mole.ts).

안 하는 것

  • 프레임워크 섬을 안 씁니다. 움직이는 건 모루와 복사 버튼 정도라 짧은 인라인 스크립트로 충분해요
  • 부드러운 이징을 안 씁니다. steps() 로 끊어서 갑니다. 도트는 한 칸씩 움직여요
  • 둥근 모서리를 안 씁니다
  • 분석 도구를 안 답니다. 화면에 그렇게 적어뒀어요
  • 목업을 안 그립니다. 화면 사진은 pnpm shots 이 진짜 앱을 띄워 찍습니다
  • 긴 줄표(—), 가운뎃점(·), 말줄임표(…) 를 안 씁니다. 짧은 -... 를 쓰세요