OH SU JINFrontend Engineer

외부 서비스진행 중멀티 브랜드

보험 상품 서브브랜딩

암·치아·치매·종합건강 4개 보험 상품의 서브브랜드 상품 페이지.

담당
퍼블리싱 전담 · 반응형 · 배포 파이프라인
팀
백엔드 1 · 프론트 1(본인)
기간
2026.08 – 진행 중

암·치아·치매·종합건강 4개 상품 페이지를 A안·B안 두 벌씩, 총 8벌 퍼블리싱했다. 브랜드가 둘이지만 구조는 같아서, 리포지토리 구조를 배포 버킷 구조와 일치시키고 브랜드 차이는 속성 하나로만 분기했다.

배포
링크 비공개
스택
HTMLVanilla CSSJavaScriptAWS S3CodeBuild

주요 작업

  • 리포지토리 구조 = 배포 버킷 구조

    • 단일 버킷에 두 브랜드를 하위 경로로 나눠 배포한다.
    • 로컬 폴더 구조를 버킷과 동일하게 맞춰서, 어떤 파일이 어디로 가는지 눈으로 확인할 수 있게 했다.
    • 경로를 추측할 필요가 없으면 배포 사고도 줄어든다.
  • 임시 조치에는 만료 조건을 적어둔다

    • 모바일 작업이 끝나기 전까지 가로 스크롤을 막는 임시 규칙을 넣었다.
    • 대신 '콘텐츠 모바일 마무리 시 걷어낼 것'이라는 조건을 문서 최상단에 경고로 박아 뒀다 — 임시 조치가 영구 조치가 되는 건 대개 만료 조건을 안 적었기 때문이다.
상품 페이지
8벌
4개 상품 × A·B안
반응형
1025~1920 · 태블릿·모바일 ≤1024
분기점 1240
브랜드 분기
data-site 속성 1개
헤더·푸터·팝업은 공용 조각