Codencash 리브랜딩 개발기 1


codencash-blog-opengraph

🚀 Prologue: 왜 ‘홈페이지’가 필요했나?

Codencash는 처음에 단순한 워드프레스 블로그(blog.codencash.com)로 시작했다.
‘코드(Code)’로 ‘수익(Cash)’을 만든다는 의미였고, 수익형 블로그라는 목적에는 잘 맞았다.

하지만 서비스를 하나둘 만들기 시작하면서 분명한 한계가 보이기 시작했다.


브랜드 확장성의 한계

Codencash가 더 이상 단순한 “돈 버는 법” 블로그로 머물기에는,
내가 만들고 있는 서비스들이 담고 있는 성격이 달라지고 있었다.

  • 뭐먹지? (What Now, Eat?)
  • ImageFit
  • 자동화·공공 성격의 기술 서비스들

이 서비스들은 수익을 넘어 사회적·기술적 가치를 지니고 있었지만,
기존 블로그 구조에서는 이를 제대로 설명하기 어려웠다.


구글 애드센스 승인 문제

여러 서브도메인 기반 서비스에 광고를 연동하려다 보니,
결국 핵심은 루트 도메인(codencash.com)의 신뢰도였다.

단순한 링크 모음(Gateway) 페이지로는
“가치 있는 콘텐츠” 기준을 충족하기 어렵다고 판단했다.

그래서 결론은 하나였다.

개인 블로그를 넘어,
‘기술 연구소(Public Tech Lab)’로 리브랜딩하자.


💡 Concept: Code n’ Cash의 재정의

리브랜딩의 시작은 이름의 의미를 다시 정의하는 것이었다.

기존 Codencash의 의미는 다음과 같았다.

  • Code = 개발
  • Cash = 개인 수익

리브랜딩 이후 Codencash는 이렇게 바뀌었다.

  • Code = 자동화와 기술
  • Cash = 사회적 가치, 비용 절감, 시간 절약

Codencash에서 말하는 ‘Cash’는 이제 돈 그 자체가 아니다.

**기술로 사회의 비효율을 줄이며
그 과정에서 축적되는 시간과 재화(Value)**를 의미한다.

이 정의 덕분에 공익적 성격의 기술 서비스들을
하나의 브랜드 철학 아래 묶을 수 있게 되었다.


Codencash Slogan

Code for Value, Tech for Life


🛠 Tech Stack: 확장성을 고려한 설계

Codencash 홈페이지는 단순한 랜딩 페이지가 아니다.
향후 서비스 확장을 고려해 처음부터 구조적으로 설계했다.


Next.js 14 (App Router)

SEO와 초기 로딩 속도를 최우선으로 고려해 Next.js를 선택했다.

  • 정적 사이트 생성(SSG)
  • 서버 사이드 렌더링(SSR)

을 상황에 맞게 조합해 검색 엔진 친화적인 구조를 구성했다.
홈페이지 자체가 하나의 콘텐츠가 되도록 설계한 셈이다.


Docker & Docker Compose

현재는 단일 프론트엔드 서비스지만,
추후 API 서버나 데이터베이스가 붙을 것을 고려해
처음부터 Docker Compose 기반으로 인프라를 구성했다.

이 덕분에 배포는 항상 동일하다.

  • 서버가 바뀌어도
  • 환경이 달라져도

배포 방식은 흔들리지 않는다.


Tailwind CSS & Framer Motion

‘공적 기술 연구소’라는 인상을 주기 위해
다음과 같은 디자인 콘셉트를 잡았다.

  • Deep Navy 기반 컬러
  • Blueprint(청사진) 그리드 패턴

너무 딱딱해 보이지 않도록
Framer Motion을 활용해 부드러운 등장 애니메이션을 추가했다.


🎨 Key Features

서비스 허브 (Service Hub)

/services 페이지를 통해 실제 운영 중인 서비스들을 소개한다.

단순한 링크 나열이 아니라,
각 서비스가 어떤 문제를 해결하는지를 명확히 설명했다.

이는 사용자 신뢰도뿐 아니라
구글 애드센스 심사에도 긍정적인 구조다.


Insight Archive

기존 워드프레스 블로그는 사라지지 않았다.

대신 **‘연구 기록(Insight Archive)’**이라는 개념으로 재정의했다.

  • 홈페이지: 철학과 방향성
  • 블로그: 깊이 있는 기술 기록

각자의 역할이 분명해졌다.


수익화 준비 (AdSense Ready)

애드센스 심사를 대비해 광고 코드도 구조적으로 설계했다.

  • 광고 컴포넌트 모듈화
  • 전체 레이아웃 공통 삽입 구조

Publisher ID만 설정하면
전체 페이지에 광고를 일관되게 적용할 수 있다.


🚩 Epilogue: MadSe-Labs Team

Codencash는 개인 프로젝트를 넘어
MadSe-Labs Team이라는 이름 아래 운영되는 실험 공간이다.

앞으로 더 많은 공공적·실험적인 기술 서비스들을 선보일 예정이다.

이제 codencash.com은 단순한 주소가 아니다.

기술이 일상의 문제를 해결하고
가치를 만들어내는 과정을 증명하는 베이스캠프

다.


🔗 Codencash Public Lab 바로가기

https://codencash.com


답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다