DummyImage

빠른 레이아웃 테스트용 더미 이미지 컴포넌트입니다. src가 없으면 회색 플레이스홀더를 렌더링합니다.

Astro

---
import DummyImage from "@shared/ui/dummy-image/DummyImage.astro";
---

<!-- 플레이스홀더 -->
<DummyImage width={200} height={200} />

<!-- 실제 이미지 -->
<DummyImage src="/path/to/image.jpg" width={200} height={200} />

Props:

• src?: string: 이미지 소스 (선택, 기본값: 회색 플레이스홀더)
• width: number | string: 이미지 너비 (필수)
• height: number | string: 이미지 높이 (필수)
• 기타 <img> 속성들 지원

Code

<!-- 플레이스홀더 -->
<img src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1' preserveAspectRatio='none'%3E%3Crect fill='%23f5f5f5' width='1' height='1'/%3E%3C/svg%3E" alt="" width="200" height="200" />

<!-- 실제 이미지 -->
<img src="/path/to/image.jpg" alt="" width="200" height="200" />

Preview