Framework41

• 

  Nest에서 Cron 서비스가 갑자기 돌지 않는다면? 1. 배경: 코드 구조 리팩토링과 QueryBuilder의 도입NestJS로 백엔드 서비스를 운영하다 보면, 엔티티(Entity) 클래스가 점점 비대해지는 문제가 생깁니다.예를 들어 특정 엔티티 안에 “날짜 범위 검색”, “OO별 필터링” 같은 쿼리 매핑 메서드를 static으로 붙여두면, 어느 순간 엔티티가 데이터 모델링과 쿼리 빌더 역할을 동시에 하게 됩니다.이를 해결하기 위해 팀에선 전용 QueryBuilder 클래스를 도입했습니다.// src/purchase/query-builders/Sample-query.builder.ts@Injectable({ scope: Scope.REQUEST })export class SampleQueryBuilder { private filters: FilterQu.. Framework/NestJS 2025. 9. 22.

• 

  TanStack Query v5로 GraphQL과 REST API 통합 관리하기 요약TanStack Query v5는 React Query의 후속 버전으로, GraphQL과 REST API를 하나의 통합된 인터페이스로 관리할 수 있는 강력한 서버 상태 관리 라이브러리입니다. 기존 버전 대비 개선된 TypeScript 지원, 더욱 직관적인 API, 그리고 프레임워크 독립적인 구조를 제공합니다. 특히 현재 Wisely 구조 상 BigCommerce Storefront GraphQL API와 자체 구축한 REST API를 동시에 사용하는 이커머스 환경에서, 일관된 캐싱 전략과 낙관적 업데이트를 통해 최적의 사용자 경험을 제공할 수 있습니다.핵심 기능/개념 정리TanStack Query v5 주요 변화점항목v4 (React Query)v5 (TanStack Query)패키지명react-qu.. Framework/React & RN 2025. 8. 24.

• 

  백엔드 개발자가 다시 프론트엔드로: 2024년 생태계 변화 총정리 요약2021-2022년과 비교했을 때, 2024년 프론트엔드 생태계는 서버 중심 사고로의 회귀, 타입 안전성 강화, 그리고 개발자 경험(DX) 개선을 중심으로 급격한 변화를 겪었습니다. React 18의 Concurrent Features, Next.js App Router의 Server Components, 그리고 TanStack Query의 서버 상태 관리 패러다임은 백엔드 개발자에게 친숙한 개념들로 프론트엔드와 백엔드의 경계를 모호하게 만들고 있습니다. 이러한 변화는 특히 풀스택 개발 경험이 있는 개발자들에게는 오히려 더 직관적이고 이해하기 쉬운 환경을 제공합니다.핵심 기능/개념 정리주요 기술 스택 변화 타임라인연도기술/패턴변화 내용백엔드 개발자 관점2021React 17, SWRCSR 중심, 클라.. Framework/Nextjs 2025. 8. 24.

• 

  FSD 아키텍처로 대규모 Next.js 프로젝트 구조 설계하기: 실무 적용 가이드 요약Feature-Sliced Design(FSD)은 대규모 프론트엔드 애플리케이션의 구조를 체계적으로 관리하기 위한 아키텍처 방법론입니다. 전통적인 기능별 폴더 구조나 Atomic Design의 한계를 극복하고, 비즈니스 로직의 응집도를 높이면서 계층 간의 의존성을 명확히 관리할 수 있습니다. Next.js App Router와 결합했을 때, Server Components와 Client Components의 역할을 명확히 분리하고, 코드 재사용성과 유지보수성을 극대화할 수 있는 현대적인 프론트엔드 아키텍처 패턴입니다.핵심 기능/개념 정리FSD 계층 구조계층명역할의존성 방향Next.js 적용 예시app전역 설정, 프로바이더모든 계층 의존layout.tsx, providers.tsxpages라우팅, 페이.. Framework/Nextjs 2025. 8. 24.

• 

  NestJS 완전정복: CLI 활용하기 NestJS CLI는 NestJS 애플리케이션을 개발할 때 필수적인 도구입니다. 이 가이드에서는 NestJS CLI의 주요 기능과 사용법을 자세히 알아보겠습니다.1. NestJS CLI 설치먼저 NestJS CLI를 전역으로 설치하는 방법을 알아보겠습니다:npm install -g @nestjs/cli설치가 완료되면 다음 명령어로 버전을 확인할 수 있습니다:nest --version2. 새 프로젝트 생성새로운 NestJS 프로젝트를 생성하는 방법입니다:nest new my-nest-project이 명령어를 실행하면 다음과 같은 구조의 프로젝트가 생성됩니다:my-nest-project/├── src/│ ├── app.controller.ts│ ├── app.module.ts│ ├── app.se.. Framework/NestJS 2025. 5. 26.

• 

  NestJS 완전정복: 미들웨어, 가드, 인터셉터, 파이프의 모든 것 1. 미들웨어(Middleware)1.1. 개념 및 역할미들웨어는 Express와 마찬가지로 요청(Request)과 응답(Response) 사이에서 실행되는 함수입니다. HTTP 요청이 컨트롤러의 핸들러에 도달하기 전에 실행되는 함수로, 요청(request)과 응답(response) 객체, 그리고 next() 함수를 통해 다음 미들웨어로 제어를 전달할 수 있습니다. 주로 요청의 전처리(로깅, 인증, body 파싱 등)나 후처리, 특정 조건에 따른 요청 차단 등에 사용됩니다. NestJS의 미들웨어는 Express 미들웨어와 거의 동일하게 동작하지만, Nest의 DI 시스템과 모듈 시스템에 통합되어 더 구조적으로 관리할 수 있습니다.1.2. 사용법1) 클래스형 미들웨어 작성 방법 및 적용 방법기본적으로 클.. Framework/NestJS 2025. 5. 26.

• 

  NestJS 완전정복: MikroORM 사용하기 MikroORM 소개MikroORM은 Node.js와 TypeScript를 위한 강력한 ORM(Object-Relational Mapping) 라이브러리입니다. TypeORM이나 Sequelize와 같은 다른 ORM들과 비교했을 때 다음과 같은 특징을 가지고 있습니다.TypeScript First: TypeScript를 기본적으로 지원하며, 타입 안정성이 뛰어납니다.Unit of Work 패턴: 트랜잭션 관리가 용이하며, 변경사항을 효율적으로 추적합니다. 모든 변경사항을 em.flush() 호출 시 한번에 처리(트랜잭션 자동화) 합니다.Identity Map: 메모리 내 객체 캐싱을 통해 성능을 최적화합니다.Entity Manager: 엔티티의 생명주기를 관리하고 데이터베이스 작업을 추상화합니다.Quer.. Framework/NestJS 2025. 5. 25.

• 

  NestJS 완전정복: 모듈, 컨트롤러, 서비스의 모든 것 1. NestJS의 아키텍처 개요NestJS는 Node.js 환경에서 엔터프라이즈급 서버 애플리케이션을 개발할 수 있도록 설계된 프레임워크입니다. Angular에서 영감을 받은 구조와 데코레이터 기반 프로그래밍, 그리고 강력한 의존성 주입(Dependency Injection, DI) 시스템을 갖추고 있습니다. NestJS의 핵심은 모듈(Module), 컨트롤러(Controller), 서비스(Service) 세 가지 컴포넌트로 구성됩니다. 이 세 가지는 각각의 역할이 명확하게 분리되어 있으며, 대규모 프로젝트에서도 유지보수성과 확장성을 극대화할 수 있도록 설계되어 있습니다2. 모듈(Module): 기능 단위와 의존성 관리의 중심2.1. 모듈이란?모듈은 NestJS 애플리케이션의 구조를 구성하는 기본 단위.. Framework/NestJS 2025. 5. 16.

• 

  NestJS 톺아보기 : NestJS 개요 및 아키텍처 앞으로 일주일 간 NestJS와 공부한 내용을 정리하여 올리려고 합니다.*해당 글은 AI를 활용하여 정리하였음을 서두에 밝힙니다.NestJS 개요와 아키텍처1. NestJS란 무엇인가?NestJS는 Node.js 환경에서 동작하는 진보적(Progressive)이고, 효율적이며, 확장성 있는 서버사이드 애플리케이션 프레임워크입니다. TypeScript를 기본으로 지원하며, 객체지향 프로그래밍(OOP), 함수형 프로그래밍(FP), 함수반응형 프로그래밍(FRP) 등 다양한 패러다임을 포용합니다. NestJS는 Angular에서 영감을 받은 구조와 데코레이터 기반의 프로그래밍 모델을 제공하여, 대규모 애플리케이션 개발에 적합한 아키텍처를 갖추고 있습니다.공식 사이트: https://nestjs.com/공식 문서.. Framework/NestJS 2025. 5. 15.

• 

  Spring @Transactional이 동작하지 않는 이유: Self-Invocation 정리 개요스프링의 @Transactional은 선언형 트랜잭션 처리를 가능하게 해주는 강력한 도구입니다. 하지만 실무에서는 @Transactional을 붙였음에도 트랜잭션이 전혀 동작하지 않는 이상한 상황을 겪곤 합니다. 그 대표적인 원인이 바로 Self-Invocation(자기 호출)입니다.이 문서에서는 Self-Invocation이 발생하는 구조적 원인과 해결 방법을 명확하게 정리합니다.핵심 개념 요약항목설명@Transactional 처리 방식프록시(proxy) 객체를 통해 트랜잭션을 적용 (JDK 동적 프록시 또는 CGLIB)Self-Invocation 정의하나의 클래스 내부에서 자신의 메서드를 직접 호출하는 행위문제의 본질프록시가 아닌 실제 인스턴스(this)를 통해 메서드가 호출되어 AOP 미적용결과.. Framework/Spring 2025. 5. 7.

• 

  Supabase 완전 정복: 오픈소스 Firebase 대안의 모든 것 1. Supabase란?Supabase는 오픈 소스 기반의 BaaS(Backend as a Service) 플랫폼으로, Firebase와 유사한 기능을 제공하면서도 PostgreSQL을 백엔드 엔진으로 사용하는 것이 가장 큰 특징입니다. 복잡한 서버 구성 없이도 사용자 인증, 데이터베이스 관리, 파일 스토리지, 실시간 데이터 동기화, 서버리스 함수 등을 손쉽게 구성할 수 있어, 프론트엔드 중심의 개발 환경에서 빠르게 백엔드를 구축할 수 있습니다.Supabase는 "Firebase를 오픈소스로 다시 만든다면 어떤 모습일까?"라는 질문에서 시작된 프로젝트입니다.2. 주요 기능 및 아키텍처 구성기능설명Authentication (Auth)다양한 인증 방식(이메일/비밀번호, 매직 링크, OTP, 소셜 로그인, .. Framework 2025. 5. 7.

• 

  FastAPI 로 간단하게 로컬 서버 띄우기 서론오늘은 FastAPI 로 간단하게 로컬 서버 띄우는 방법에 대해서 알아보도록 하자. 기본적으로 python(Python 3.13.2 기준으로 작성됨)이 설치된 것을 가정하고 진행하겠다.FastAPI 간단 소개Python 서버 개발 프레임워크에는 대표적으로 FastAPi, Django, Flask가 있다. 오늘은 이 중에서도 FastAPI에 대해서 알아보겠다. FastAPi란 Python 기반의 초고속 비동기 웹 프레임워크. Starlette와 Pydantic 기반으로 만들어졌으며, 비동기 API와 자동 문서화(Swagger)를 강력하게 지원한다. Python 싱글스레드 한계를 이벤트루프 + 비동기로 극복해서 동시성 높인 게 FastAPI와 같은 최신 프레임워크의 특징이다. 참고로 Python 서버는 .. Framework 2025. 3. 15.