본문 바로가기

전체 글

(138)
Next.js Server Function 에러 메시지가 프로덕션에서 사라지는 이유 개발 환경에서는 "이미 사용 중인 아이디입니다" 같은 에러 메시지가 잘 뜨는데,프로덕션에 배포하면 갑자기 이런 메시지로 바뀐 경험이 있을 것이다.An error occurred in the Server Components render.The specific message is omitted in production builds to avoid leaking sensitive details.원인은 Next.js의 의도적인 보안 정책이다.왜 이런 일이 생기나Next.js의 Server Function('use server')은 이름 그대로 서버에서 실행되는 함수다.클라이언트에서 호출하면 내부적으로 HTTP 요청을 만들어 서버에서 실행한다.'use server'export async function creat..
서버가 호출하는 API와 브라우저가 호출하는 API는 다르다 : NEXTJS 들어가며Next.js로 개발하다 보면 이런 상황을 마주친다. 분명히 서버에서 API를 잘 호출하고 있는데, 같은 주소를 클라이언트 컴포넌트에서 쓰면 요청이 실패한다. 로컬에서는 둘 다 되던 코드가, 배포하고 나면 클라이언트 쪽만 망가진다.이 글은 그 원인 — API를 누가 호출하느냐에 따라 동작이 달라지는 이유 — 을 설명한다.핵심 개념: API 호출의 주체Next.js 앱에서 API를 호출하는 주체는 두 가지다.서버: Server Component, API Route, Server Action 등에서 fetch()를 실행할 때. 코드는 Next.js가 돌아가는 머신에서 실행된다.브라우저: Client Component에서 fetch()를 실행하거나, 처럼 브라우저가 직접 리소스를 요청할 때. 코드는 ..
Next.js 캐싱의 기본값과 동적 렌더링 전환 조건 Next.js의 렌더링 기본값Next.js 공식 문서(Glossary)는 다음과 같이 명시한다.Prerendering is the default for components that don't use Request-time APIs.즉, Request-time API를 사용하지 않는 컴포넌트는 기본적으로 빌드 시점에 HTML을 생성해 캐싱한다.dynamic 옵션의 기본값인 'auto'에 대한 설명도 같은 방향이다.The default option to cache as much as possible without preventing any components from opting into dynamic behavior.기본값이 "최대한 캐싱"이라는 것은 Next.js의 설계 방향을 직접적으로 보여준다.Req..
히가시노 게이고, 악의 히가시노 게이고의 《악의》를 읽고 느낀 점을 영상으로 담았습니다. 우리는 누군가를 판단할 때 얼마나 많은 것을 모른 채 판단하고 있을까요.이 책은 작은 거짓이 어떻게 편견을 만들고, 그 편견이 어떻게 한 사람을 규정하는지를 보여줍니다.읽는 내내 불편했고, 그 불편함이 오래 남았습니다.영상에서 더 자세한 이야기를 나눕니다.
Next.js의 redirect() vs router.push() — nginx 리버스 프록시 + basePath 환경에서의 함정 배경Next.js App Router에서 로그인 후 대시보드로 이동시키는 코드를 작성할 때, 가장 먼저 떠오르는 방법은 Server Action에서 redirect()를 호출하는 것이다.// app/(auth)/login/actions.ts'use server'export async function login(prevState, formData) { // ... 로그인 처리 redirect('/dashboard') // 이게 문제가 됐다}로컬에서는 잘 동작한다. 그런데 nginx 리버스 프록시 뒤에 배포하는 순간, 로그인 후 /dashboard로 이동하려다 404가 발생했다. /admin/dashboard로 가야 하는데 /dashboard로 가고 있었다.Next.js의 basePath 설정이 프로젝..
방화벽 뚫지 않고 로컬 서버 공개하기 — Cloudflare Tunnel 실전 사용기 개발 서버에 22번 포트만 열려 있다면? 팀원들이 API를 테스트하려면 모두 SSH 터널링을 해야 할까요?Cloudflare Tunnel을 사용하면 인바운드 포트 개방 없이 외부에서 접근 가능한 공개 URL을 단 한 줄로 만들 수 있습니다.문제 상황개발 서버에 NestJS API를 띄웠지만, 외부에서는 22번 포트(SSH)만 접근 가능한 상황이었습니다.팀원들에게 API를 공유하려면 각자 SSH 터널링을 설정해야 해서 매우 번거로웠습니다.[팀원 브라우저] --SSH--> [개발 서버 :22] --> [NestJS API :3000 내부]❌ 팀원마다 터널링 설정 필요Cloudflare Tunnel이란?Cloudflare Tunnel(구 Argo Tunnel)은 아웃바운드 연결만으로 서버를 외부에 공개할 수 ..
Windows SSD 용량 부족 해결 — Docker vhdx, WSL 다른 드라이브로 이전하기 vhdx 위치 확인개발 환경에서 C: SSD 용량을 잡아먹는 주범은 대부분 Docker와 WSL의 가상 디스크 파일(.vhdx)이다.Docker vhdx 위치 확인(Get-ChildItem "C:\Users\$env:USERNAME\AppData\Local\Docker" -Recurse -Filter "*.vhdx" -ErrorAction SilentlyContinue).FullNameWSL vhdx 위치 확인(Get-ChildItem "C:\Users\$env:USERNAME\AppData\Local\Packages" -Recurse -Filter "*.vhdx" -ErrorAction SilentlyContinue).FullName용량 확인:Get-Item "C:\Users\$env:USERNAME\..
Ubuntu 서버에서 Docker / Laravel Sail 문제 해결 기록 Ubuntu 서버에서 Laravel Sail 실행이 안 되는 문제가 발생했습니다. 겉보기엔 다른 두 가지 문제였지만, 실제로는 Docker 환경이 꼬이면서 연쇄적으로 발생한 문제였습니다.문제 1. Docker 데몬이 실행 중인데 명령어가 실패현상$ docker infoCannot connect to the Docker daemon at unix:///var/run/docker.sock.Is the docker daemon running?$ sudo systemctl status dockerActive: active (running) # 서비스는 실행 중권한도 정상, 서비스도 정상인데 Docker 명령어가 모두 실패했습니다.원인$ ps -ef | grep dockerd/usr/bin/dockerd .....

반응형