turin's blog

만들고, 터지고, 기록합니다

풀스택, Flutter, 서버 운영, SEO, 배포 삽질을 실제 프로젝트 기준으로 정리합니다. 검색해서 들어온 사람이 바로 쓸 수 있는 체크리스트와 명령을 남기는 게 목표입니다.

1175published
8topics
kopractical notes

자주 다루는 주제

주제별로 빠르게 훑어보기

웹 개발350Next.js283서버 운영165Docker110API80TypeScript58DB50Flutter39

전체 글

운영 중 부딪힌 문제를 검색 의도에 맞춰 정리

Docker

작은 서비스 자동 시작을 Compose와 systemd 중에서 고른 기준

컨테이너와 호스트의 재시작 책임을 나눈 비교 메모입니다.

·1분 읽기
Next.js1분 읽기

Next.js 목록이 발행 직후 갱신되지 않았던 캐시 추적기

API 성공과 공개 목록 반영 사이의 캐시 지연을 추적한 기록입니다.

계속 읽기 →
웹 개발1분 읽기

Node.js 작업 큐가 조용히 멈췄을 때 heartbeat를 추가한 방법

작업 큐의 프로세스는 살아 있지만 소비가 멈춘 장애를 heartbeat와 지표로 발견한 경험입니다.

계속 읽기 →
UX1분 읽기

기능 플래그를 끄고도 새 화면이 보였던 캐시 확인 기록

기능 플래그를 껐는데 일부 브라우저에서 새 UI가 계속 보인 원인과 확인 순서를 정리했습니다.

계속 읽기 →
Next.js1분 읽기

Next.js 프로덕션 소스맵을 공개하지 않도록 빌드 설정을 바꾼 이유

에러 추적에는 필요하지만 브라우저에 원본 코드가 내려가던 소스맵을 다룬 설정 노트입니다.

계속 읽기 →
Next.js1분 읽기

React 토스트 알림이 읽히지 않을 때 aria-live를 붙인 기준

화면에는 나타나지만 스크린 리더에는 전달되지 않던 토스트 알림을 수정하며 정한 기준입니다.

계속 읽기 →
Git1분 읽기

git bisect로 배포 뒤 깨진 설정의 커밋을 좁힌 기록

기능은 멀쩡한데 특정 환경에서만 깨질 때 git bisect를 실제 점검 순서에 넣은 방법을 기록했습니다.

계속 읽기 →
Next.js1분 읽기

로그에 토큰을 남겼던 실수를 마스킹 규칙과 테스트로 막기

디버깅 로그에 인증 토큰이 남았던 상황을 계기로 민감 정보 마스킹 위치와 회귀 테스트를 정한 기록입니다

계속 읽기 →
API1분 읽기

TypeScript 유니온 타입으로 API 성공과 실패 응답을 나눈 비교

status 코드를 여러 곳에서 검사하던 클라이언트 코드를 판별 가능한 유니온으로 바꾼 이유와 트레이드오프입니다

계속 읽기 →
웹 개발1분 읽기

CSP를 한 번에 강제하지 않고 Report-Only로 도입한 순서

콘텐츠 보안 정책으로 화면을 깨뜨리지 않도록 관찰 단계와 강제 단계의 기준을 나눈 노트입니다

계속 읽기 →
웹 개발1분 읽기

systemd 서비스가 재시작만 반복할 때 확인한 종료 신호 처리

프로세스가 실행 직후 재시작되던 VPS에서 상태와 애플리케이션 종료 처리를 확인한 기록입니다

계속 읽기 →
웹 개발1분 읽기

WebSocket이 끊긴 뒤 재연결 폭주를 막은 백오프 설계

개발 환경에서는 잘 보이지 않던 재연결 폭주를 재현하고 지수 백오프와 상한을 적용한 과정입니다

계속 읽기 →
Next.js1분 읽기

검색 결과에 오래된 페이지가 남을 때 canonical과 리다이렉트를 나눈 기준

URL 구조 변경 뒤 canonical, 301, noindex를 구분해 적용한 SEO 판단 가이드입니다.

계속 읽기 →
Docker1분 읽기

Docker 이미지 크기를 줄일 때 multi-stage 빌드가 항상 정답은 아니었던 이유

Node.js 컨테이너를 줄이며 alpine과 slim의 호환성, 캐시, 운영 조건을 비교한 글입니다.

계속 읽기 →
서버 운영1분 읽기

Ubuntu 서버에 최소 권한 배포 사용자를 만든 설정 노트

root SSH 키로만 배포하던 VPS에 별도 사용자와 제한된 sudo 권한을 구성한 설정 노트입니다.

계속 읽기 →
Next.js1분 읽기

React 폼 상태를 한 객체로 묶었다가 검증을 나눈 이유

체크박스의 false 값이 서버에 전달되지 않던 폼 오류를 상태와 검증 규칙으로 분리한 회고입니다.

계속 읽기 →
Docker1분 읽기

Next.js 이미지 최적화가 느려졌을 때 캐시 헤더부터 확인한 과정

개발 환경과 운영 환경의 이미지 응답 시간이 달랐던 원인을 캐시 헤더와 프록시 설정으로 좁힌 기록입니다.

계속 읽기 →
웹 개발1분 읽기

배포 후 관리자만 401을 받았던 쿠키 속성 점검 체크리스트

로컬에서는 로그인되는데 HTTPS 운영 환경에서 관리자 요청만 401이 된 원인을 쿠키 속성별로 확인한 체크리스트입니다.

계속 읽기 →
API2분 읽기

PostgreSQL 트랜잭션 안에서 외부 API를 기다리지 않도록 바꾼 설계 회고

주문 저장 트랜잭션 안에서 결제 API를 호출해 잠금이 길어졌던 문제를 outbox 방식으로 나눈 회고입니다.

계속 읽기 →
UX1분 읽기

웹 접근성 테스트에서 발견한 아이콘 버튼의 이름 누락과 수정 기준

화면에는 보이지만 스크린 리더가 읽지 못하던 아이콘 버튼을 직접 테스트하며 aria-label과 구조를 정리했습니다.

계속 읽기 →
서버 운영1분 읽기

Linux inode가 먼저 바닥났을 때 디스크 용량만 보던 습관을 고친 순서

df -h가 여유 있다고 나오는데 파일 생성이 실패했던 VPS에서 inode와 작은 파일을 확인하고 정리한 과정입니다.

계속 읽기 →
Next.js2분 읽기

React Server Component 경계에서 브라우저 전용 코드를 분리한 기록

Next.js App Router에서 window와 이벤트 핸들러가 섞인 컴포넌트를 어디까지 client로 둘지 정한 실제 기준을 적었습니다.

계속 읽기 →
DB1분 읽기

PostgreSQL 인덱스를 추가하기 전 EXPLAIN ANALYZE로 확인한 선택 기준

느린 목록 조회에 인덱스를 무작정 추가하지 않고 실행 계획과 쓰기 비용을 함께 비교한 짧은 튜토리얼입니다.

계속 읽기 →
UX1분 읽기

웹 폼 오류 메시지에 내부 정보를 노출했던 실수와 수정 기준

사용자에게 보여 줄 오류와 서버 로그에 남길 세부 정보를 분리하지 않아 생긴 보안 실수와 수정 기준을 적었습니다.

계속 읽기 →