62 lines
2.1 KiB
Markdown
62 lines
2.1 KiB
Markdown
---
|
|
title: Ironclad 홈페이지 제작 계획
|
|
updated: 2026-03-28
|
|
tags: [product, website, design]
|
|
---
|
|
|
|
## 개요
|
|
|
|
ironclad.it.com 공식 홈페이지. 호스팅 상품 소개, 가격표, 회사 소개.
|
|
|
|
## 기술 스택
|
|
|
|
| 항목 | 선택 | 이유 |
|
|
|------|------|------|
|
|
| 프레임워크 | **Astro** | 콘텐츠 사이트 최적, Cloudflare 인수로 Workers/R2 궁합 최고, Next.js 대비 2-3배 빠름 |
|
|
| 디자인 | **Google Stitch** | AI 기반 UI 디자인, Tailwind 코드 export, 무료 (Google Labs) |
|
|
| 스타일 | Tailwind CSS | Stitch export 호환, 유틸리티 기반 |
|
|
| 배포 | cf-multisite | Gitea push → R2 → Workers → ironclad.it.com |
|
|
| 다국어 | 한/영/일 | Astro i18n 지원 |
|
|
|
|
## 디자인 도구: Google Stitch
|
|
|
|
- URL: https://stitch.withgoogle.com/
|
|
- Gemini 2.5 기반 AI UI 디자인
|
|
- 텍스트 프롬프트 → 고품질 UI 생성
|
|
- Vibe Design: 분위기/느낌 기반 디자인 (예: "Stripe처럼 프리미엄하고 미니멀하게")
|
|
- 이미지 업로드: 참고 사이트 스크린샷 → 유사 디자인 생성
|
|
- Export: HTML/CSS, Tailwind, Vue, Angular, Flutter, SwiftUI (7개 프레임워크)
|
|
|
|
## 페이지 구성
|
|
|
|
| 페이지 | 내용 |
|
|
|--------|------|
|
|
| 히어로/랜딩 | 핵심 메시지, CTA |
|
|
| 상품 소개 | VPS, 베어메탈, IKE, 보안서비스 카테고리 |
|
|
| 가격표 | 리전별/스펙별 가격, 비교표 ([[ironclad-hosting-products]]) |
|
|
| 보안서비스 | 3단계 보안 구조 (CDN + WAF + CrowdSec) |
|
|
| 회사 소개 | Ironclad Corp 정보 ([[ironclad-corp]]) |
|
|
| 문의 | 연락처, 상담 신청 |
|
|
|
|
## 배포 경로
|
|
|
|
```
|
|
Stitch 디자인 → Tailwind 코드 export
|
|
→ Astro 프로젝트에 통합
|
|
→ hosting/ironclad repo (Gitea)
|
|
→ Gitea Actions (Astro build + rclone R2)
|
|
→ ironclad.it.com (Workers 서빙)
|
|
```
|
|
|
|
## 참고 디자인
|
|
|
|
- Stripe (프리미엄, 미니멀)
|
|
- Vercel (개발자 친화적)
|
|
- Vultr / Linode (호스팅 가격표)
|
|
|
|
## 관련 문서
|
|
|
|
- [[ironclad-corp]] — 회사 정보, 요금 플랜
|
|
- [[ironclad-hosting-products]] — 전체 상품 구성, 가격표
|
|
- [[cf-multisite]] — 배포 플랫폼
|