#app-router

rag fine-tuning learning-to-rank recommendation-system llm jev typesafe ai-workflow structured-output nextjs app-router rsc server-actions architecture typescript monorepo turborepo build-performance react ssr hydration route-handler tanstack-query caching routing proxy cdn react-19 react-server-components server-state browser-rendering csr dom react-dom rendering expo eas testflight ios code-signing claude-code eslint hooks lint automation seo open-graph noindex robots-txt pnpm workspace dependency-management catalog vercel aws amplify ecs fargate deployment use-id create-portal create-root cookie http-only csrf xsrf-token same-site web-security middleware rewrite sso slo authentication idp frontend bff resize-observer css-variables performance variance type-safety strict-function-types covariance image-optimization browser-image-compression jszip web-worker frontend-performance postmessage react-hook-form browser-api next-js healthkit swift workout apple-watch watchos useeffect render anti-pattern semver package-management python venv virtual-environment troubleshooting gps pedometer live-activity react-native auto-pause remote-control mobile-development web-session productivity rtk token-optimization figma-api developer-tools infrastructure mermaid mdx diagram aws-s3 presigned-url file-upload hmac security agentic-loop token-flow prompt-caching shell-script figma cli skill agent responsive-publishing context-window subagent team multi-agent ai-collaboration publishing claude-md memory history-api form xcode widget swiftui app-group sandbox html accessibility a11y nice-auth post-vs-get callback in-app-browser ssg static-site-generation getstaticprops getstaticpaths css contain browser javascript animation lerp linear-interpolation requestanimationframe code-splitting react-lazy dynamic-import preloading reflow repaint composite-layer transform will-change image-upload mobile-web docusaurus mintlify documentation openapi static-site-generator 3d-transform perspective transform-style search-console sitemap metadata canonical jsx transpile ast virtual-dom reconciliation synthetic-event flux declarative immutability frontend-history mvc mvvm jquery backbone swiper oauth user-agent-detection post-message session-storage isr cache-control route53 dns domain txt-record intersection-observer infinite-scroll chat-ui scroll-behavior vpc ec2 iam cloud-basics performance-now dom-high-res-timestamp monotonic-clock user-timing-api node-perf-hooks jenkins ci-cd github-webhook kubernetes docker cicd continuous-integration continuous-delivery continuous-deployment devops data-structure map set git github fork clone version-control oss-contribution generics type-system keyof interface git-branch remote prune closure lexical-scope execution-context deep-dive lexical-environment hoisting scope this binding cssom render-tree tcp first-class-object function arguments var let const type-alias redux redux-toolkit state-management mouse-event drag

2026년 9월 16일Article

Next.js App Router 요청 흐름 지도

요청 하나가 Proxy와 Route를 지나 화면이 뜨고, 사용자 동작이 Server Action을 거쳐 두 캐시로 갈라지는 자리를 한 장으로 이었다.

READ MOREREAD MORE→

2026년 9월 14일Article

SSR과 RSC의 차이, RSC Payload와 두 가지 로딩 흐름 정리

SSR과 RSC를 다른 축으로 갈라 보고, RSC Payload가 초기 로딩과 Client Navigation에서 각각 어떻게 쓰이는지 짚었다.

READ MOREREAD MORE→

2026년 9월 12일Article

Server Action과 Route Handler 차이, 그리고 두 캐시 계층 정리

Route Handler와 Server Action이 갈리는 지점, 그리고 TanStack Query 캐시와 Next.js 캐시가 다른 계층이라는 걸 정리했다.

READ MOREREAD MORE→

2026년 9월 11일Article

Next.js 요청이 Server Component에 닿기까지의 경로

브라우저 주소창의 URL이 Server Component에 닿기까지 DNS·CDN·라우트 매칭·Proxy 실행 순서를 따라가며 정리했다.

READ MOREREAD MORE→

2026년 9월 10일Article

React 19 Server Action과 Action 훅 역할 정리

Server Function과 Server Action의 구분부터 useActionState, useOptimistic, use까지 서버 작업을 UI에 잇는 방식을 정리했다.

READ MOREREAD MORE→