turin's blog

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

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

1175published
8topics
kopractical notes

자주 다루는 주제

주제별로 빠르게 훑어보기

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

전체 글

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

서버 운영

Nginx 설정이 제대로 먹혔는지 확인하는 방법

Nginx 수정 후 실제로 적용되지 않거나 예상과 다르게 동작할 때 확인해야 할 체크리스트.

·1분 읽기
Next.js2분 읽기

Next.js 폼의 상태가 제대로 초기화되지 않을 때

폼 상태 관련 버그는 보통 초기값 설정이나 리렌더링 시점에서 비롯된다. 원인을 빠르게 찾는 방법을 정리했다.

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

빌드 시간이 갑자기 길어지면 어디서부터 확인할까

프로젝트 빌드가 느려지면 무작정 최적화부터 시작하기보다 문제의 원인을 체계적으로 찾는 게 훨씬 빠르다.

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

SSH로 외부에서 접속이 안 될 때

안에서는 되는데 밖에서만 SSH가 안 붙는 상황. 포트부터 방화벽까지 끊어서 확인한 순서를 적었다.

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

메모리 사용량이 슬금슬금 오를 때

당장 죽지는 않는데 메모리가 천천히 차오르는 서버. 누수인지 확인하고 원인을 좁힌 과정이다.

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

환경변수 문제 빠르게 디버깅하기

환경변수 설정 오류는 배포 후에야 드러날 때가 많다. 재현 조건을 먼저 파악하고 체계적으로 확인해야 쉽게 푼다.

계속 읽기 →
TypeScript1분 읽기

에러 타입을 구분하면 디버깅이 훨씬 쉬워진다

런타임 에러, 빌드 에러, 네트워크 에러를 명확히 구분하고 기록해두면, 배포 후 문제가 생겼을 때 원인을 빨리 찾을 수 있다.

계속 읽기 →
Flutter1분 읽기

입력 폼이 모바일에서 제대로 안 될 때 확인할 것

모바일에서 입력 폼의 키보드 높이, 포커스 이동, 입력 타입이 제대로 안 작동하면 CSS와 HTML 속성부터 점검해야 한다.

계속 읽기 →
Next.js1분 읽기

React 컴포넌트의 상태 업데이트가 반영 안 될 때

버튼이나 폼 엘리먼트가 비활성화 상태가 안 바뀔 때는 상태 업데이트 타이밍, React DevTools, 브라우저 콘솔을 순서대로 확인하면 원인을 빨리 찾을 수 있다.

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

앱의 아이콘과 메타데이터가 제대로 안 나타날 때

모바일 앱이나 웹의 메타데이터가 안 뜰 때는 Open Graph 태그, 캐시, 각 플랫폼의 메타데이터 검사 도구를 순서대로 확인해야 한다.

계속 읽기 →
API1분 읽기

외부 API 연동이 자꾸 실패할 때 디버깅 방법

외부 API와 연동할 때는 인증 토큰, 요청 형식, 타임아웃 설정을 순서대로 확인해야 자주 실패하는 이유를 찾을 수 있다.

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

배포 전에 세션 설정을 빠뜨렸을 때 하는 실수들

API 인증이 필요한 앱을 배포할 때는 쿠키 설정, 세션 저장소, HTTPS 설정을 반드시 점검해야 로그인이 안 되는 상황을 피할 수 있다.

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

URL 슬러그가 바뀐 후 운영할 때 점검할 것

기존 슬러그를 바꾼 후에는 리다이렉트 설정, 검색엔진 색인, 백링크 등을 차례로 확인해야 트래픽 손실을 막을 수 있다.

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

환경변수가 제대로 안 들어갔을 때 확인 방법

Next.js 앱이 배포 후 환경변수를 못 찾으면, 빌드 타임 vs 런타임 변수 구분부터 시작하면 빠르다.

계속 읽기 →
Next.js1분 읽기

Next.js에서 배치 작업이 실패할 때 확인 순서

배치 작업이 로컬에서는 되는데 배포 후 안 되면, 환경변수와 canonical 설정부터 점검하면 원인을 빨리 찾을 수 있다.

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

배포 전에 꼭 확인해야 할 것들

배포하기 전에는 빌드 결과, 환경변수, 로그를 한 번씩 보고 나서 올려야 배포 후 긴급 수정을 피할 수 있다.

계속 읽기 →
TypeScript1분 읽기

TypeScript Record 타입 에러를 빠르게 잡는 법

Record 타입으로 객체를 정의할 때는 빌드 에러와 실제 값을 함께 봐야 타입 문제를 찾을 수 있다.

계속 읽기 →
API1분 읽기

API 응답이 이상할 때 처음 확인할 것들

API 작업에서 막힐 때는 status code, 응답 body, 요청 파라미터를 단계별로 확인하는 습관이 제일 빠르다.

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

에러 페이지 빌드가 서버에서만 실패할 때

로컬 빌드는 통과하는데 CI에서만 에러 페이지 빌드가 깨졌다. 빌드 로그를 따라 원인을 찾은 기록이다.

계속 읽기 →
Flutter1분 읽기

모바일에서만 로딩이 멈출 때 원인 좁히기

데스크톱은 멀쩡한데 모바일에서만 로딩이 안 끝나는 문제. 재현 조건을 고정하고 좁혀간 과정이다.

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

파일 업로드가 안 될 때 확인하는 것들

업로드 실패는 프런트, 요청 헤더, 서버 제한 중 어디서든 날 수 있다. curl로 끊어서 확인하는 순서를 정리했다.

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

로딩 상태 처리를 안전하게 바꾸기

isLoading 플래그가 여기저기 흩어지면 깜빡임과 빈 화면이 생긴다. 로딩 처리를 정리한 방식을 적었다.

계속 읽기 →
Docker1분 읽기

서버에서만 이미지가 깨질 때 컨테이너부터 본다

로컬에선 멀쩡한데 배포하면 이미지가 안 뜨는 문제. 컨테이너 안을 직접 들여다보며 잡은 과정이다.

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

URL 검색 파라미터 때문에 막힐 때 원인 좁히기

쿼리스트링이 얽힌 버그는 화면만 봐서는 안 잡힌다. 파라미터의 실제 값을 먼저 확인하는 순서를 정리했다.

계속 읽기 →