arch.crowny.org 프론트엔드 구현

개요

크라우니건축(arch.crowny.org) 웹 프론트엔드를 구현했다. interior.crowny.org의 디자인 시스템을 계승하되 건축 도메인에 맞는 스틸블루 컬러 시스템으로 차별화했다.

무엇을 했는지

프론트엔드 3개 파일 생성 (web/ 디렉토리)

1. index.html — 전체 랜딩 페이지

- 히어로 (Thinking Digital Twin Architecture Platform) - 핵심 가치 3개 (설계 투명성, 데이터 축적, 공간 진화) - 실적 카운터 (스크롤 애니메이션) - 4개 서비스 카드 (건축설계/도시설계/시공관리/감리컨설팅) - 6단계 프로세스 (아이디어→설계BIM→인허가→시공→검수→디지털트윈) - 건축 철학 6개 - 프로젝트 등급 (Idea→Design→Build→Twin) - 포네 결제 시뮬레이터 (건축 스케일: 1000만~10억) - 인테리어 연계 (interior.crowny.org 링크) - 프로젝트 문의 폼 - 로드맵 (건축→BIM 디지털트윈→스마트시티→Thinking Space)

1. style.css — 디자인 시스템

- 스틸블루 accent (#4a90c8) vs interior의 골드 (#c8a060) - 그리드 배경 패턴 (hero-grid) — 건축 도면 느낌 - 정사각형 프로세스 번호 (border-radius: 12px) vs interior의 원형 - 반응형 (768px, 560px 브레이크포인트)

1. app.js — 프론트엔드 로직

- 서비스 카드 렌더링 (SVG 아이콘) - 포네 계산기 - 문의 폼 → /api/inquiry POST - 카운터 애니메이션 - 스크롤 fade-in 애니메이션

기존 파일 (변경 없음)

• server.js — Node.js 서버 (포트 9756, 이미 구현됨)
• 건축서버.한선 — 한선씨 동반 서버 (기본 버전)
• data/arch.json — 데이터 파일

관련 파일 경로

• /Users/ef/crowny-arch/web/index.html
• /Users/ef/crowny-arch/web/style.css
• /Users/ef/crowny-arch/web/app.js
• /Users/ef/crowny-arch/server.js
• /Users/ef/crowny-arch/건축서버.한선

검증

• node server.js → 포트 9756 정상 기동
• GET / → index.html 정상 서빙
• GET /api/health → ok
• GET /api/services → 4개 서비스 JSON
• GET /style.css, GET /app.js → 정적 파일 정상
• 게이트웨이(gateway.yaml)에 arch.crowny.org 이미 등록됨

잔여 이슈

• 건축 전문 파트너 (전문가) 데이터 아직 없음 — 인테리어처럼 실제 파트너 확보 후 추가 필요
• 포트폴리오 섹션 미포함 — 실적 확보 후 추가
• 건축서버.한선 업그레이드 필요 — 정적 파일 서빙 로직 반영
• server.js의 url.parse() 사용 → WHATWG URL로 마이그레이션 권장