- #Architecture
- #Project
- #ModuReview
- #Architecture
- #Project
2025-10-26

FSD(Feature-Sliced Design)의 기본 개념과 슬라이스와 세그먼트를 실제로 프로젝트에서 어떻게 적용했는지, Next.js 환경에선 FSD를 어떻게 적용했는지 예시 코드와 함께 정리한 글입니다.
2025-10-26

리액트 쿼리를 활용해 선언형 프로그래밍을 어떻게 달성했는지, 부록으로 쿼리 키 팩터리에 대한 내용과 Next.js 환경에서 리액트 쿼리로 프리패치하는 방법을 정리한 글입니다.
2025-10-11

에러 모니터링을 위한 센트리 도입기. Next.js를 사용한 프로젝트에 센트리를 어떻게 연결했고, 보다 풍부한 에러 정보를 위해 어떻게 에러 로깅 코드를 작성했는지 정리한 글입니다.
2025-09-03

ISR 기반의 HTML 생성을 통해 메인페이지를 어떻게 최적화했는지, 실제 부하테스트를 사용해 전/후를 비교한 내용과 On-Demand 캐시 무효화를 활용해 fetch 데이터를 캐싱한 경험 등 Next.js의 캐시 전략을 정리한 글입니다.
2025-08-16

Tiptap으로 구현한 에디터에 이미지 업로드 기능을 어떻게 구현했는지, 백엔드로부터 presigned url을 발급 받아 S3에 직접 업로드하는 방법, 업로드 프로그레스 계산을 어떻게 했는지 정리한 글입니다.
2025-07-11

Next.js 프로젝트에 에디터를 구현하기 위해 react-quill이 아닌 Headless 라이브러리인 Tiptap을 사용한 이유, Tiptap의 사용 방법을 정리한 글입니다.
2025-06-16

Zustand가 함수 레벨에서 훅의 규칙을 위반하는 이유와 훅의 규칙을 위반하지 않는 순수 함수 기반의 set 함수가 어떻게 동작하는지 직접 코드를 분석해 정리한 글입니다.
2025-05-16

리액트 쿼리, Zustand, API 요청 모듈을 조합해 프론트엔드에서 에러를 중앙화하고 보다 사용자에게 의미 있는 에러를 표시하기 위해 시도한 방법을 정리한 글입니다.
2025-04-16

Next.js로 구축한 프론트엔드 프로젝트를 Vercel로 배포하지 않고, AWS EC2 프리티어 환경에서 Nginx, PM2, 쉘 스크립트를 조합해 Blue-Green 방식의 무중단 배포를 구현한 과정을 정리한 글입니다.
2025-03-27

팀 프로젝트에 앞서 프론트엔드에서의 에러와 예외가 무엇인지, 그렇다면 예측 가능한 에러와 예측 불가능한 에러의 차이는 무엇인지, 이 에러들을 어떻게 처리해야 하는지 고민한 내용들을 정리한 글입니다.
2025-03-11

fetch를 이용한 요청 외에도 HTML, CSS, JS, 이미지 Form 등 브라우저가 자동으로 생성하는 HTTP 요청들의 종류와 동작 방식을 정리한 글입니다.
2025-02-27

웹 어플리케이션에서 상태 관리를 위해 사용하는 쿠키의 구조와 유효 범위, 생명 주기, 보안 속성을 위한 여러 디렉티브(Domain, Expires, HttpOnly 등)를 정리한 글입니다.
2025-02-13

클라이언트와 서버 간의 데이터 요청 사이에 효율적으로 자원을 주고받기 위해 수행하는 컨텐츠 협상과 컨텐츠 협상에 주로 사용되는 Accept 헤더에 대해 정리한 글입니다.
2025-01-28

HTTP 요청과 응답의 기본 흐름이 어떻게 이루어지는지, URL의 구조인 프로토콜, 도메인, 포트, 경로 등에 대한 정의, 클라이언트와 서버 간 통신 과정을 정리한 글입니다.
2025-01-17

객체 지향 프로그래밍(OOP)의 개념과 타입스크립트를 사용해 OOP의 4대 원칙인 캡슐화, 추상화, 상속, 다형성을 적용하는 방법을 정리한 글입니다.
2024-12-31

타입 확장은 무엇이고 반대로 타입 좁히기는 무엇인지, 타입 좁히기를 위한 typeof, instance of, is, in에 대해 정리한 글입니다.
2024-12-16

any, unknown, void, never, Array, enum 타입이 무엇인지, 타입 조합을 위한 교차 타입, 유니온 타입, 인덱스 시그니처, 맵드 타입, 제네릭 등 여러 방법을 정리한 글입니다.
2024-11-29

정적 타입 언어와 동적 타입언어가 무엇인지, 자바스크립트에서의 타입과 타입스크립트에서의 타입의 차이점 등 타입 시스템 구조를 이해하기 위한 핵심 내용을 정리한 글입니다.
2024-11-16

AWS S3, Route53, CloudFront를 활용해 정적 사이트를 배포한 경험을 정리한 글로 OAC 설정과 도메인 연결 과정을 자세히 정리했습니다.
2024-10-16

Feature-Sliced Design (FSD) 구조에 맞춰 프로젝트 폴더 구조를 개선한 내용을 정리한 글입니다. 내용을 보완해 새로운 게시글을 작성했으니 링크를 확인해주세요!
2024-10-02

Next.js로 구축한 채팅 서버를 AWS 환경에 자동 배포하기 위해 사용한 github-actions, CodeDeploy 설정 파일을 정리한 글입니다.
2024-08-21

웹소켓 서버에 Next-Auth로 로그인 기능을 구현한 과정과, middleware로 CORS 문제를 해결한 과정을 정리한 글입니다.
2024-08-10

간단한 웹소켓 기반의 Next.js 서버를 만들고, 버거풋 프로젝트에 Socket.io 라이브러리를 사용해 관리자 문의 기능을 도입한 내용을 정리한 글입니다.
2024-08-02

JWT 기반 로그인 기능을 구현하고 axios 라이브러리의 인터셉터 기능을 이용해 인증 헤더를 구성과 토큰 재발급 기능을 구현한 과정을 정리한 글입니다.
2024-06-30

react-hook-form와 rc-slider 라이브러리를 조합해 슬라이더 입력을 구현한 과정을 정리한 글입니다.
2024-06-16

기존의 복잡한 input 로직을 react-hook-form 라이브러리로 개선하며 얻은 경험과 성능상 이점을 정리한 글입니다.
2024-06-06

CONNECT, OPTIONS, TRACE 등 남음 HTTP 메서드들의 목적과 동작 방식을 RFC 문서를 기반으로 정리한 마무리 글입니다.
2024-05-26

PUT과 DELETE 메서드의 정의, PUT과 POST의 차이점, DELETE 메서드의 제한된 사용 및 주요 용도와 요청에 대한 상태 코드 등을 정리한 글입니다.
2024-05-17

GET, HEAD, POST 메서드의 목적과 동작 방식을 RFC 문서를 기반으로 정리한 글로 이전 게시글의 안정성과 멱등성을 기반으로 다루며 사용 방법도 간단히 정리한 글입니다.
2024-05-11

안전한 메서드와 안전하지 않은 메서드, 멱등성, 캐싱과 조건 등 HTTP 메서드의 공통 속성을 단계적으로 자세히 정리한 글입니다.
2024-05-05

RFC 9110 문서를 기반으로 HTTP 메서드의 기본 개념을 정리한 글로, 전체 흐름을 이해하기 위한 서론을 정리한 글입니다.
2024-04-30

리액트의 createPortal로 모달을 DOM 계층에서 분리해 스타일 상속 문제를 해결한 과정과 구현 방식에 대해 정리한 글입니다. (CSS 상속 회피)
2024-04-24

cURL과 crontab으로 셀레니움 기반의 로딩 로직을 자동화하고, 크롤링 시간을 고려해 ALB idle timeout 설정한 경험을 정리한 글입니다.
2024-04-17

버거풋 프로젝트의 근본적인 목표와 서버에서 크롤링을 트리거하기 위해 시도한 방법을 정리한 글입니다.
2024-04-11

Burgerput 프로젝트의 시작 배경과 개발 과정을 간단하게 정리한 글입니다.
2024-04-04

Sanity Studio에서 스키마를 정의하고 데이터를 구성하는 과정과 실제 컨텐츠를 추가한 경험을 정리한 글입니다.
2024-03-29

Headless CMS의 개념과 전통적인 CMS와의 차이를 정리하고, Sanity의 기본적인 사용 방법을 정리한 글입니다.
2024-03-21

Next.js의 API Routes 활용 방식과 서버리스 개념을 함께 정리하며, nodemailer로 메일 전송 기능을 구현한 방법을 정리한 글입니다.
2024-03-16

Next.js의 metadata 객체를 사용해 SEO, 소셜 공유를 위한 OG 정보를 어떻게 설정했는지, 동적인 페이지에서 메타데이터를 어떻게 생성하는지 정리한 글입니다.
2024-03-10

SEO의 기본 개념과 Next.js 13버전에서 sitemap.xml과 robots.txt를 직접 생성하지 않고 sitemap.ts, robots.ts 코드를 사용해 생성하는 방법을 정리한 글입니다.
2024-03-04

Lottie 애니메이션이 무엇인지, lottie-react 라이브러리를 사용해 블로그에 Lottie 애니메이션을 적용한 방법을 정리한 글입니다.
2024-02-28

블로그 제작기 3. 다이나믹 라우팅을 사용한 상세 페이지 구성, react-markdown과 tailwind typography를 사용해 마크다운을 화면에 렌더링하는 방법을 정리한 글입니다.
2024-02-23

블로그 제작기 2. react-multi-carousel 라이브러리를 이용해 게시물을 캐러셀 형태로 표시한 방법을 정리한 글입니다.(번들 사이즈가 무려 2.5KB..!)
2024-02-17

블로그 제작기 1. Posts 목록 데이터 받아와 사용자에게 표시하기, @next/font와 Next.js의 Image 컴포넌트로 레이아웃 시프트를 방지하는 방법에 대해 정리한 글입니다.
2024-02-12

블로그를 Next.js로 개발하게 된 계기, Next.js의 핵심 내용과 4가지 렌더링 방식의 차이를 정리한 글입니다.
2024-02-06

Next.js 13 환경에서 다크모드를 구현하기 위해 로컬 스토리지를 이용한 방법과 그 과정에서 마주친 문제들을 정리한 글입니다.
2024-01-27

기존 블로그 플랫폼 대신 직접 기술 블로그를 만들게 된 배경과 구현 과정에서 고민했던 부분들을 정리한 글입니다.
2024-01-23
