2fc3f93163
지도가 회색 바탕에 점만 찍혀 있어 어디인지 알 수 없었다. OSM 타일을 좌표로 직접 깔고 그 위에 핀을 얹었다. 지도 라이브러리는 부르지 않는다. - Web Mercator 로 lat/lng → 월드 픽셀을 계산하고, 모든 지점이 여백 안에 들어오는 가장 확대된 배율을 고른다(뷰성형외과 동선은 z=15). - 타일은 img 가 아니라 CSS 배경으로 둔다. 장식 요소이고, 지도의 뜻은 감싸는 요소의 aria-label 이 전한다. 스크린리더가 타일 조각을 하나씩 읽지 않는다. - OSM 정책에 따라 "© OpenStreetMap contributors" 를 표기한다. 사진 핫링크 - 모든 사진에 referrerpolicy="no-referrer" 를 넣었다. 네이버 썸네일 CDN 이 리퍼러를 보고 403 을 준다. 서버에서 검사할 때는 리퍼러가 없어 통과해 놓치기 쉽다. - 사진 alt 를 채웠다. npm run build 의 접근성 게이트가 빈 alt 를 오류로 잡는다. 로컬에서 astro build 만 돌려 게이트를 건너뛴 탓에 배포에서 처음 걸렸다. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| .vscode | ||
| briefs | ||
| docs | ||
| public | ||
| scripts | ||
| src | ||
| .env.example | ||
| .gitignore | ||
| AGENTS.md | ||
| astro.config.mjs | ||
| CLAUDE.md | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| tsconfig.json | ||
| vercel.json | ||
Astro Starter Kit: Minimal
npm create astro@latest -- --template minimal
🧑🚀 Seasoned astronaut? Delete this file. Have fun!
🚀 Project Structure
Inside of your Astro project, you'll see the following folders and files:
/
├── public/
├── src/
│ └── pages/
│ └── index.astro
└── package.json
Astro looks for .astro or .md files in the src/pages/ directory. Each page is exposed as a route based on its file name.
There's nothing special about src/components/, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
Any static assets, like images, can be placed in the public/ directory.
🧞 Commands
All commands are run from the root of the project, from a terminal:
| Command | Action |
|---|---|
npm install |
Installs dependencies |
npm run dev |
Starts local dev server at localhost:4321 |
npm run build |
Build your production site to ./dist/ |
npm run preview |
Preview your build locally, before deploying |
npm run astro ... |
Run CLI commands like astro add, astro check |
npm run astro -- --help |
Get help using the Astro CLI |
👀 Want to learn more?
Feel free to check our documentation or jump into our Discord server.