HTML/CSS 이중작업, 에이전시가 매달 얼마를 버리고 있나
Article
어느 날 에이전시 프로젝트 현장을 보면서 이상한 걸 발견했습니다.
퍼블리셔가 열심히 HTML/CSS로 마크업을 끝냈는데, 바로 옆에서 개발자가 그걸 보면서 React 컴포넌트로 다시 쓰고 있었습니다. 같은 UI를. 두 번.
이게 왜 당연하게 돌아가고 있지? 그 생각이 머릿속에서 한동안 안 떠났습니다.
실제 흐름을 보면
보통 이렇게 진행됩니다:
- 디자이너가 시안을 넘깁니다
- 퍼블리셔가 HTML/CSS로 마크업합니다
- 개발자가 그걸 다시 JSX/TSX 컴포넌트로 옮깁니다
- 개발자가 데이터 연동하고 로직 붙입니다
3번이 핵심입니다. 퍼블리셔가 만든 결과물을 개발자가 그대로 쓸 수 없어서 재작성하는 단계입니다.
이게 얼마나 걸리길래
프로젝트마다 다르겠지만, 일반적인 기업 웹사이트 기준으로 한번 계산해봤습니다.
- 메인 페이지 1개: 3~4시간
- 서브 페이지 5개: 각 1~2시간
- 공통 컴포넌트(헤더, 푸터, 카드, 모달 등): 3~5시간
대략 10~15시간. 미드레벨 프론트엔드 개발자 시간 단가를 5만 원으로 잡으면 프로젝트 한 건에 50~75만 원입니다.
월 3건만 돌려도 150225만 원. 연간으로 환산하면 1,800만2,700만 원.
이 돈이 새로운 기능을 만들거나 품질을 높이는 데 쓰이는 게 아닙니다. 이미 누군가 만든 걸 다른 포맷으로 다시 쓰는 데 들어갑니다. 솔직히 이건 좀 아깝습니다.
왜 이게 계속 반복되나
퍼블리셔가 JSX를 직접 쓸 수 없기 때문입니다.
HTML과 JSX가 비슷해 보여도, 퍼블리셔 입장에선 생소한 부분이 꽤 있습니다. class 대신 className, 자기닫힘 태그, 컴포넌트 분리 방식—별도 훈련 없이 실무에서 바로 적용하기는 어렵습니다.
그래서 에이전시는 어쩔 수 없이 개발자한테 맡기고, 개발자는 로직보다 마크업 변환에 시간을 씁니다.
만약 이 단계가 사라지면
퍼블리셔가 처음부터 TSX 컴포넌트로 납품할 수 있다면 3번 단계 자체가 필요 없어집니다.
개발자는 데이터와 로직에만 집중하고, 퍼블리셔 산출물이 바로 프로젝트에 들어갑니다. 이게 가능하려면 퍼블리셔가 "개발자 수준"이 될 필요는 없습니다. 핵심 패턴 20가지 정도만 실무 기준으로 익히면 됩니다.
이 구조에 대한 생각을 요즘 계속 정리하고 있습니다. 다음에는 실제로 어떤 패턴들이 필요한지 좀 더 구체적으로 써볼 생각입니다.