-
GA4 분석을 전체 페이지에 추가해 사용자 행동 추적
GA4 분석 도구를 프로덕션 애플리케이션에 연동했다. 기본 레이아웃 파일에 환경 변수 기반 설정을 통해 배포 환경마다 유연하게 구성할 수 있도록 구현했는데, 여기서 배운 몇 가지 설계 관점을 정리해본다.
읽기 → -
레거시 템플릿 설정값 완전 제거
얼마 전 뭔가 큰 마이그레이션이 있었던 것 같은데, 거기서 남겨진 레거시 설정들을 정리했다. ssul 템플릿 관련 코드가 여기저기 흩어져 있던 게 눈에 띄었고, 특히 metric 시스템의 SITE_ID 값과 content config 카테고리 부분에 아직도 낡은 설정이 남아 있던 상황이었다.
읽기 → -
저자 페이지 네이밍 정규화와 UI 간소화
저자 페이지를 정리했다. 페이지 이름을 통일하고, 불필요한 메타데이터와 UI 요소들을 덜어냈다. 작아 보이는 작업이지만, 코드베이스를 깔끔하게 유지하는 데 생각보다 중요한 부분이었다.
읽기 → -
포트폴리오 이름 초협폭에서 단어 줄바꿈되던 버그 수정
포트폴리오 hero 섹션에서 이름이 초협폭(380px 이하) 화면에서 단어 중간에 깨지는 버그를 고쳤다. 모바일 반응형 디자인에서 자주 마주치는 typography 문제인데, 폰트 축소와 CSS word-break: keep-all 조합으로 해결했다.
읽기 → -
외부 배포를 절반 티저
Dev.to에 기사를 배포할 때, 이전에는 전체 콘텐츠를 그대로 올리고 있었다. 이번에는 대략 절반 정도의 티저 + 원본 기사로의 CTA(행동 유도) 링크로 배포 방식을 바꿨다.
읽기 → -
Dev.to 동기화 태그가 실제 카테고리로 매핑되도록 수정
외부 플랫폼과의 콘텐츠 동기화 작업 중에 발견된 흥미로운 버그를 수정했다. Dev.to 백필(backfill) 과정에서 모든 포스트의 태그가 "AI News"로 기본값 설정되던 문제인데, 본래 각 포스트의 카테고리 정보를 반영해야 하는 것이었다.
읽기 → -
블로그 콘텐츠를 Dev.to에 자동 배포하기
블로그에 글을 올릴 때마다 손으로 Dev.to에도 동일한 내용을 복붙해서 올리던 반복 작업을 없애기로 했다. bot/generate.py에 Dev.to 신디케이션 로직을 추가해서 블로그 배포와 함께 자동으로 Dev.to에 콘텐츠가 올라가도록 정리했다.
읽기 → -
특정 결제사 전용 스코프로 발급현황 조회 버그 수정
가상계좌 발급현황을 조회하는 쿼리에 특정 결제사(제주 KP_PAY)로만 동작하도록 스코프를 제한하는 수정을 했다. SQL 매퍼 파일 한 곳에 조건을 추가한 작은 변경이었지만, 단순한 쿼리 튜닝이 아니라 결제 도메인에서 꽤 자주 마주치는 패턴 문제를 드러낸다.
읽기 → -
새로운 뉴스 카테고리를 소스 코드 수정 없이 추가하다
기사 수집 봇의 카테고리 시스템을 리팩토링해서 **토픽 소스를 동적으로 관리**하고, **긴 기사도 처리 가능**하도록 개선했다. 특히 AI News 같은 새 카테고리를 추가할 때 generate.py를 건드릴 필요 없도록 했는데, 이런 변경이 서비스 운영에서 왜 중요한지 회고해본다.
읽기 → -
발행 성과 지표를 모니터링 시스템에 자동 등록
opsvoro에 조회수와 발행목표 메트릭을 추적하도록 등록하는 작업을 진행했다. 데이터 기반 의사결정이 중요해지면서 이런 지표들을 팀 대시보드에 자동으로 반영하는 것이 점점 필수가 되고 있다.
읽기 → -
분산된 추적 시스템, 하나의 집계로 통일하기
opsvoro라는 추적 시스템의 PV 집계를 site-pv.py에 새로 등록했다. 단순한 기능 추가처럼 보이지만, 사용자 행동 데이터를 여러 소스에서 수집할 때 마주하는 여러 결정과 트레이드오프를 다시 정리해볼 기회였다.
읽기 → -
Discord 채널 자동 구성으로 팀별 메시지 흐름 정리
Discord를 통해 특정 팀 관련 메시지를 자동으로 수집하고 전달하는 시스템에 팀 전용 채널을 추가하고, 채널-도메인 매핑 기능을 구축했다. 변경 파일은 discord_channels.json과 discord_post.py로, 기존 단순한 메시지 전달 방식에서 도메인 기반 라우팅 체계로 한 단계 진화시킨 작업이다.
읽기 → -
자동화 봇의 중복 청구를 원자적으로 처리
운영 자동화 시스템을 만들다 보면, 매일 반복되는 작업들을 배치 처리하는 **일일 봇**을 필요로 한다. 이번 작업은 그 봇이 여러 카테고리의 청구를 처리할 때 발생하는 중복 문제를 정면으로 마주쳤다. categoryId 추가, 인터리브 클러스터 선택, 원자적 중복 제거—세 가지 개선을 한 번에 적용했다.
읽기 → -
모바일 광고가 화면을 넘어가던 레이아웃 버그 해결
모바일 환경에서 광고 영역이 콘텐츠 박스를 벗어나면서 전체 레이아웃이 깨지는 문제를 layout.tsx에 CSS 오버플로우 가드를 추가해서 처리했다. 간단한 한 줄의 변경이었지만, 이 과정에서 느낀 몇 가지 생각을 정리해본다.
읽기 → -
카테고리 페이지 너비 통일하기
카테고리 페이지와 홈 페이지의 콘텐츠 영역 너비가 달랐다. 사용자가 홈에서 카테고리로 이동하면 갑자기 레이아웃이 좌우로 신축하는 느낌을 받는 상황이었다. 이번에 래퍼 요소의 max-width 제약을 제거하고 960px 고정 너비로 맞춰서 일관된 경험을 만들었다.
읽기 → -
홈 리스트에 카테고리명이 제대로 표시되도록
홈 페이지 리스트에서 카테고리 이름을 raw slug 대신 proper display name으로 보여주도록 고쳤다. 작은 수정이지만 사용자 경험과 데이터 표현 레이어를 분리하는 관점에서 생각해볼 점이 있었다.
읽기 → -
마크다운 테이블·제목이 스타일 안 받던 버그 수정
Astro 블로그를 쓰고 있는데, 마크다운에서 렌더링되는 테이블과 제목들이 정의해둔 CSS 스타일을 전혀 받지 않는 문제가 있었다. 처음엔 스타일 코드가 빠진 줄 알고 찾아봤는데, 결국 Astro의 CSS 스코핑(scoped styles)과 동적으로 주입되는 마크다운 HTML 사이의 충돌이었다.
읽기 → -
동적 사이트맵으로 포스트 색인 누락 문제 해결
블로그 사이트의 사이트맵을 정적 XML에서 동적 생성 방식으로 전환했다. 그 과정에서 카테고리 구조도 정규화하고, 화면 레이아웃도 개선했던 작업인데, 이번 글에서는 왜 이런 변경이 필요했는지, 팀 입장에서는 어떤 이점이 있는지 풀어보려 한다.
읽기 → -
모바일 광고 오버플로우 문제 고정
모바일 기기에서 광고가 컨테이너를 벗어나는 오버플로우 문제를 src/app/globals.css의 CSS 룰 조정으로 수정했다. 간단해 보이는 한 줄 수정이지만, 반응형 디자인에서 자주 마주치는 함정과 팀 차원의 의사결정이 담겨 있다.
읽기 → -
광고가 모바일에서 튀어나가던 버그 수정
모바일 환경에서 광고 요소가 화면을 벗어나며 UI를 깨뜨리는 문제를 발견하고, CSS 오버플로우 가드로 대응했다.
읽기 →