목차
1. 비즈니스 모델 구축 배경
2. 수익 모델 도입: 광고를 통한 서버 비용 상쇄
3. 무료 서버 Netlify로의 전환
4. 결론
1. 비즈니스 모델 구축 배경
REracle 서비스 초기에는 CI/CD 파이프라인을 구축하여 main 브랜치 push 할 때 마다 Amazon S3와 CloudFront를 활용하여 배포되도록 하였습니다.
그러나 지속적인 운영 과정에서 약 15,000원 이상의 금액이 서버 비용으로 청구되었습니다. 이는 취준생인 저에게 부담되는 금액이었습니다.

2. 수익 모델 도입: 광고를 통한 서버 비용 상쇄
서버 비용을 상쇄하기 위해 광고 수익 모델을 고려했습니다. Google AdSense는 심사 기준이 엄격하여 글자 수가 몇 만자 이상인 블로그 글만 심사 기준에 충족된다는 제약이 있었습니다. 그래서 대안으로 카카오 애드핏을 선택했습니다. 카카오 애드핏은 심사 기준이 상대적으로 덜 엄격하고, 24시간 내에 심사 승인을 받을 수 있습니다.
카카오 애드핏 광고 컴포넌트를 React 프로젝트에 다음과 같이 구현했습니다:
```jsx
import { useEffect, useRef } from 'react';
export const KakaoAdfit320x50 = () => {
const scriptElement = useRef<HTMLDivElement>(null);
useEffect(() => {
const script = document.createElement('script');
script.setAttribute('src', 'https://t1.daumcdn.net/kas/static/ba.min.js');
script.setAttribute('charset', 'utf-8');
script.setAttribute('async', 'true');
scriptElement.current?.appendChild(script);
}, []);
return (
<div ref={scriptElement}>
<ins
className="kakao_ad_area"
style={{ display: 'none' }}
data-ad-unit="DAN-PJyp2bY6pWmwBDVf"
data-ad-width="320"
data-ad-height="50"
/>
</div>
);
};
```
이 컴포넌트를 프로젝트 내 적절한 위치에 배치하여 광고를 노출시켰습니다.

11월과 12월 총합 약 15,000원 이상의 적립금을 쌓아 이전 서버 비용을 충당할 수 있는 금액이 생겼습니다. 하지만 카카오 애드핏 정책상 5년 내에 5만원 이상의 적립금이 쌓여야 출금할 수 있다는 제약이 있었습니다.
남간하네… 😅

3. 무료 서버 Netlify로의 전환
광고 금액의 단가도 낮은 상황에서 AWS 서버를 빌릴 수 없는 상황이여서 비용을 더 낮추기 위해 Netlify로 REracle 서비스를 전환 후 서버 비용 절감을 하여 운영하고 있습니다.
4. 결론
REracle 서비스의 비용 효율적인 운영을 위한 여정은 초기 AWS 기반의 배포에서 시작하여 광고 수익 모델 도입, 그리고 최종적으로 Netlify로의 전환으로 이어졌습니다. 이 과정을 통해 서비스의 지속 가능성을 높이고 비용을 최소화하는 방안을 찾을 수 있었습니다.
이는 취준생이거나 수익화를 목적인 개발자들에게 유용한 사례가 된다고 생각합니다.
'FE' 카테고리의 다른 글
AllYouRaffle 사이드 프로젝트 운영했던 경험 (4) | 2025.01.03 |
---|---|
뷰포트 단위에서 rem, px, %, vh로 리팩토링한 이유 (0) | 2024.12.29 |
React PWA에서 푸시 알림 구현하기: 사용자 경험을 한 단계 업그레이드하세요 (3) | 2024.12.29 |
Styled-components에서 Tailwind로 전환한 이유 (1) | 2024.11.04 |
[최적화] suspense, lazy로 초기로딩 개선 (1) | 2024.07.23 |