작성일: 2025-11-08카테고리: CSS, UX, Cross-browser, Web Performance난이도: 초급~중급TL;DR문제: 스크롤바가 나타날 때 콘텐츠가 약 15-17px 밀리며 사용자 경험 저하해결: scrollbar-gutter: stable + Firefox fallback으로 크로스 브라우저 대응핵심: "스크롤바를 항상 표시하지 않고도 공간을 예약할 수 있다"결과: Chrome/Edge/Safari에서 레이아웃 shift 없이 깔끔한 UX 달성들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것을 하나로 제공"하는 Kubernetes 기반 API 플랫폼입니다.Frontend를 개발하면서 스크롤바가 나타날 때마다 페이지가 밀리는 불편한 UX 문제를 발견했습니다. ..
작성일: 2025-11-05카테고리: NestJS, React, TypeScript, JWT, Axios, Zustand, API, 에러처리난이도: 중급TL;DR문제: NestJS + React 프로젝트를 시작할 때마다 표준 응답, HTTP 클라이언트, 인증 스토어를 처음부터 구현해결: 재활용 가능한 3가지 핵심 코드 패턴 정립 (ResponseUtil, httpClient, authStore)핵심: "일관된 에러 처리와 타입 안정성이 개발 속도를 3배 높인다"결과: 약 2시간 소요되던 초기 설정이 10분으로 단축 (실제 경험)들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것을 하나로 제공"하는 Kubernetes 기반 API 플랫폼입니다.imprun.dev 플랫폼을 개발하면서 매번..
작성일: 2025-11-03카테고리: Implementation, Troubleshooting, Architecture난이도: 중급TL;DR문제: "Environment-Agnostic = MongoDB에 baseName만 저장"이라는 착각으로 404 에러 폭탄해결: 환경별 독립 CloudFunction 존재 (dev/hello, staging/hello, prod/hello), extractBaseName() 패턴 전면 적용핵심: "Frontend는 환경 몰라도 됨" ≠ "MongoDB도 환경 몰라도 됨"결과: Function 생성 실패, History 404, Promote 실패 → 모두 해결 (4시간 디버깅)들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것을 하나로 제공"하는 ..
작성일: 2025-11-03카테고리: Architecture, API Design, Frontend난이도: 중급TL;DR문제: dev/staging/prod 환경 prefix가 Frontend에 노출되어 코드 복잡도 증가 및 네트워크 낭비 (3배)해결: Environment-Agnostic Pattern - Frontend는 환경을 몰라야 한다핵심: 환경 정보는 인프라 레이어(Domain/Subdomain)에서 처리, API 응답은 baseName만 반환결과: 네트워크 비용 66% 감소, Frontend 코드 간결화, 배포 유연성 향상들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것을 하나로 제공"하는 Kubernetes 기반 API Gateway 플랫폼입니다. CloudFuncti..
작성일: 2025-11-03카테고리: Claude AI, 개발 가이드, 최적화, Anthropic Best Practices난이도: 중급TL;DR문제: 997줄 CLAUDE.md를 작성했는데도 AI가 패턴을 60%만 준수해결: 파일 참조 전략 + MCP 강제 활성화 + 우선순위 재구조화핵심: "AI에게 코드를 주지 말고, 파일 경로를 알려주라"결과: 997줄 → 593줄 (43% 감축), 패턴 준수율 95%들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것을 하나로 제공"하는 Kubernetes 기반 API 플랫폼입니다. 이전 글에서 997줄짜리 CLAUDE.md를 공개했습니다. Container/Presentational 패턴과 Layered Architecture로 일관성 있는 코..
작성일: 2025-11-02카테고리: MongoDB, Database, Performance, Aggregation난이도: 중급TL;DR문제: 기존 코드가 3번 쿼리 + 메모리 조인으로 페이지네이션마다 반복 조회해결: Aggregation Pipeline의 $facet + $lookup으로 1번 쿼리에 모든 것 처리핵심: $facet + $lookup의 주요 장점은 네트워크 왕복 횟수 감소 (count + data + join을 1번에)결과: 약 58% 성능 개선 예상 (이론적 계산), 쿼리 횟수 66% 감소 (3번 → 1번)주의: $lookup은 서버 측 조인, $in + Map은 애플리케이션 조인 - 환경에 따라 선택들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것을 하나로 제공..
작성일: 2025-11-02카테고리: MongoDB, Database, Performance, Backend, NestJS난이도: 중급TL;DR문제: MongoDB 인덱스를 애플리케이션 시작 시 자동 생성? 수동 생성? 어느 것이 맞을까?해결: 환경에 따라 다른 전략 사용 - Development는 자동, Production은 수동 + 환경 변수 제어핵심: 대규모 컬렉션에서 인덱스 빌드는 시간과 리소스 소요가 크므로 Production에서는 신중하게 계획결과: 개발 속도 ↑, Production 안정성 ↑, 유연한 인덱스 관리구현: NestJS onModuleInit + AUTO_CREATE_INDEXES 환경 변수로 Hybrid 접근들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것..
작성일: 2025-11-02카테고리: MongoDB, NestJS, Connection Pool, Debugging난이도: 중급TL;DR문제: 로컬 개발 환경에서 MongoDB 연결 시 50% 확률로 30초 타임아웃 발생원인: 로컬 개발을 위한 Connection Pool 분리 설계가 Hot-Reload 환경에서 673,098개의 연결 생성 초래핵심: minPoolSize=1이어도 여러 MongoClient 인스턴스가 동시에 초기화되면 연결 경합(Connection Race) 발생해결: Module-level Singleton 패턴 + Connection Pool 통합으로 타임아웃 0%로 감소들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것을 하나로 제공"하는 Kubernetes 기..
작성일: 2025-11-02카테고리: Design Pattern, Microservices, Distributed Systems난이도: 중급TL;DRSaga Pattern: 분산 시스템에서 여러 독립 서비스 간 트랜잭션을 보상 트랜잭션으로 관리두 가지 방식: Choreography (이벤트 기반) vs Orchestration (중앙 조정)imprun의 선택: State Machine + Timeout으로 충분 (단일 서비스 내 작업)교훈: 패턴보다 문제 이해가 먼저, 복잡한 게 항상 좋은 건 아님들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것을 하나로 제공"하는 Kubernetes 기반 API 플랫폼입니다.API Gateway를 생성할 때 여러 단계의 리소스 생성이 필요합니다:g..
작성일: 2025-11-02카테고리: Design Pattern, Kubernetes, Reliability난이도: 중급TL;DR문제: API Gateway 생성 중 Kubernetes 리소스 생성 실패 시 무한 대기 또는 좀비 리소스 발생해결: 5분 타임아웃 + Graceful Degradation 패턴으로 자동 정리핵심: State Machine 패턴과 결합하여 실패 시 안전하게 Stopped 상태로 전환결과: 좀비 리소스 0건, 사용자 수동 개입 불필요, 시스템 안정성 향상들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것을 하나로 제공"하는 Kubernetes 기반 API 플랫폼입니다.사용자가 API Gateway를 생성하면, 백엔드는 Kubernetes에 Deployment,..
작성일: 2025-11-02카테고리: Platform Architecture, API Gateway, Kubernetes난이도: 고급TL;DR문제: REST API 개발과 배포가 복잡하고, AI 에이전트와의 통합이 어려웠습니다.해결: CloudFunction 기반 API 개발 + Kubernetes 자동 배포 + MCP Tool 통합을 하나의 플랫폼으로 제공했습니다.핵심:Hot Reload: MongoDB Change Stream으로 1초 이내 배포State Machine: Phase 기반 리소스 생명주기 관리Multi-tenant DB: Gateway별 독립 MongoDB 데이터베이스Environment 분리: dev/staging/prod 환경 자동 생성AI 통합: CloudFunction을 MCP ..
작성일: 2025-11-01카테고리: API Gateway, Authentication, Architecture난이도: 중급TL;DR문제: Serverless에서 API Platform으로 진화하면서, 외부 사용자(Consumer)가 여러 API Gateway를 안전하게 사용할 수 있는 인증 체계가 필요했습니다.해결: Application, ApplicationGrant, Environment 3-Layer 아키텍처를 설계하여, 하나의 Application이 여러 Gateway/Environment에 접근할 수 있도록 했습니다.핵심:Application은 Gateway에 완전히 독립적Grant는 Application과 특정 Gateway/Environment를 연결API Key는 AES-256 암호화, ..
작성일: 2025-11-01카테고리: API Gateway, Authentication, APISIX, Kong난이도: 초급TL;DRConsumer란?: API Gateway에서 API를 호출하는 클라이언트(사용자, 애플리케이션)를 식별하는 엔티티핵심 개념:Consumer는 인증(Authentication)의 주체API Key, JWT, OAuth 등 다양한 인증 방식과 연결Rate Limiting, ACL 등 정책 적용의 기준점실제 사례: 모바일 앱, 웹 앱, 파트너사 시스템 등이 Consumerimprun.dev 적용: ApplicationGrant를 통해 APISIX Consumer를 자동 생성하여 관리들어가며API Gateway를 처음 접하면 가장 헷갈리는 개념 중 하나가 바로 Consumer입니..
Cron Job 기반 Task Processing에서 타임스탬프를 활용한 동시성 제어 구현TL;DR✅ Optimistic Locking: DB 트랜잭션 없이 타임스탬프로 동시성 제어✅ Lock/Unlock 패턴: 각 단계마다 unlock하여 순차 처리✅ Progressive Backoff: 대기 시간을 점진적으로 증가시켜 재시도✅ 분산 환경 안전: 여러 서버에서 동시 실행해도 중복 처리 방지✅ 자동 복구: Lock 타임아웃으로 서버 장애 시에도 자동 재시도이 글은 imprun.dev 플랫폼에서 여러 서버에서 동시에 실행되는 Cron Job 기반 Task Processing을 안전하게 구현한 경험을 공유합니다.들어가며: 여러 서버에서 동시에 Cron Job 실행하기imprun.dev는 Kubernetes ..
MongoDB + Kubernetes 환경에서 복잡한 리소스 의존성을 상태 머신으로 관리한 실제 사례TL;DR✅ State vs Phase 분리: 사용자 의도(State)와 시스템 실행 상태(Phase)를 독립적으로 관리✅ 자율적인 Document: 각 Document가 자체 상태 머신을 가지고 연관 리소스를 정리✅ 선언적 삭제: State = Deleted로 설정하면 TaskService가 자동으로 Phase 전이 처리✅ 안전한 Cascade: MongoDB는 외래키가 없지만, 상태 머신으로 안전한 Cascade 삭제 구현✅ 재시도 가능: 각 단계마다 체크포인트로 실패 시 자동 재시도이 글은 imprun.dev 플랫폼에서 API Gateway, Pod, Database, Ingress 등 복잡한 Kub..
작성일: 2025-11-01카테고리: NestJS, Dependency Injection, Backend난이도: 중급TL;DR문제: NestJS에서 Nest can't resolve dependencies of the [Service] 에러 발생원인: Module의 imports에 필요한 Provider를 제공하는 Module이 누락됨해결: 체계적인 디버깅 전략으로 의존성 체인 추적 후 Module imports 추가핵심: 에러 메시지의 첫 번째 의존성을 추적하면 해결의 실마리를 찾을 수 있음들어가며imprun.dev는 "API 개발부터 AI 통합까지, 모든 것을 하나로 제공"하는 Kubernetes 기반 API Gateway 플랫폼입니다. NestJS로 백엔드를 구축하면서 환경별 subdomain 구조..
작성일: 2025-10-31카테고리: Kubernetes, DevOps, Container난이도: 초급/중급TL;DR문제: Kubernetes에서 :latest 태그 사용 시 최신 이미지가 반영되지 않는 현상원인: imagePullPolicy: IfNotPresent 설정으로 인해 노드의 캐시된 이미지 사용해결: 개발/운영 환경별 적절한 imagePullPolicy 전략 수립핵심: 태그 전략(latest vs 버전 태그)과 imagePullPolicy는 반드시 함께 고려해야 함결과: 이미지 배포 안정성 향상, 불필요한 네트워크 트래픽 감소, 명확한 버전 관리들어가며imprun.dev는 'API 개발부터 AI 통합까지, 모든 것을 하나로 제공'하는 API 플랫폼입니다. 개발한 API를 LLM의 도구로 연결..
작성일: 2025년 10월 30일대상 독자: 백엔드 아키텍트, 플랫폼 엔지니어난이도: 중급~고급TL;DRimprun은 Serverless 플랫폼에서 Gateway 플랫폼으로 진화했습니다. 이 글은 그 여정에서 마주한 설계 고민들과 해결 방법, 그리고 최종 결정에 이르기까지의 과정을 공유합니다.핵심 변화:❌ Serverless 플랫폼 (Vercel/Netlify 같은)✅ "Gateway 플랫폼" - 다양한 게이트웨이를 제공ApiGateway: CloudFunction 기반 REST API 개발 ({id}.api.imprun.dev)AiGateway: MCP+LLM 조합 AI 채팅 ({id}.ai.imprun.dev, 향후)모든 Gateway는 동일한 패턴: Environment + ClientApp리팩토링..
작성일: 2025년 10월 29일대상 독자: 플랫폼 엔지니어, DevOps 엔지니어, 아키텍트난이도: 중급~고급주제: Environment Segregation, Deployment Pipeline, Multi-stage ArchitectureTL;DR✅ 고정 3 Stage 전략: dev, staging, prod (추가 불가, 간결함 우선)✅ Function Name Prefix: dev/user/me, prod/user/me (물리적 분리)✅ 독립 코드 관리: 각 Stage별 별도 Document (환경 간 영향 없음)✅ 클릭 배포: dev → staging → prod 코드 복사 (원클릭)✅ Plugin 계층: Application → Stage → Function (Override 가능)✅ 조건부..
작성일: 2025년 10월 29일대상 독자: 플랫폼 엔지니어, 아키텍트, API Gateway 설계자난이도: 중급~고급주제: Apache APISIX, Kubernetes, 서버리스 아키텍처TL;DR✅ Gateway → Environment → Function 3계층 아키텍처를 APISIX로 구현✅ Route 수 최소화: 100개 Function이어도 Gateway당 Route 4개만 생성✅ 동적 라우팅: APISIX Route는 고정, Runtime이 Function 동적 실행✅ Plugin 계층 상속: Gateway 전역 → Environment별 → Function별 Override✅ 멀티 테넌트: Application마다 독립된 Namespace와 Upstream✅ Kubernetes Native..
작성일: 2025-10-28대상: APISIX Ingress Controller 2.0 사용자TL;DR 🎯2025년 현재, Kubernetes Ingress + annotations 사용을 권장합니다.✅ ApisixPluginConfig는 deprecated 아님 - 활발히 사용 중❌ ApisixClusterConfig만 삭제됨 - ApisixGlobalRule로 대체🚧 Gateway API는 Alpha - CORS, 플러그인 미지원APISIX Ingress Controller 2.0 CRD 현황공식 지원 CRD (2025-10-28 기준)v2 (APISIX 네이티브) - ✅ StableCRD용도상태비고ApisixRoute라우팅 규칙✅ StableApisixRoute/v2ApisixPluginConf..
작성일: 2025-10-28대상: Kubernetes + Cilium 환경에서 Kong, APISIX 등 API Gateway 운영자개요Kubernetes에서 API Gateway(Kong, APISIX 등)를 배포할 때, kube-proxy 대신 Cilium을 사용하는 환경에서는 외부 트래픽 라우팅 전략이 달라집니다.이 문서는 Cilium 환경에서 NodePort + iptables 조합이 작동하지 않는 이유와, 상황별 최적 아키텍처 선택 가이드를 제공합니다.목차문제 상황: NodePort가 iptables에서 보이지 않음근본 원인: Cilium의 eBPF 기반 네트워킹해결 방법: hostNetwork 사용아키텍처 선택 가이드: MVP vs 프로덕션실전 구성 예시문제 상황: NodePort가 iptab..
작성일: 2025-10-28카테고리: DevOps, Kubernetes, API Gateway난이도: ⭐⭐⭐⭐ (고급)TL;DRAI Gateway를 구축하기 위해 Kong에서 APISIX로 전환하는 과정에서, 문서 오류부터 시작해 6가지 주요 시행착오를 겪었습니다. 최종적으로 hostNetwork: true + 9080/9443 포트 + iptables REDIRECT 방식으로 안정적인 구성을 완성했습니다.핵심 교훈:📝 문서는 정확하게 작성하자 - 이전 블로그를 잘못 작성해서 반나절 낭비Cilium 환경에서는 NodePort가 eBPF로 처리되어 iptables REDIRECT 대상이 될 수 없음CAP_NET_BIND_SERVICE만으로는 nginx 기반 애플리케이션이 80/443에 바인딩 불가APIS..
작성일: 2025년 10월 27일카테고리: React, Monaco Editor, 디버깅난이도: 중급TL;DR문제: TextModel got disposed before DiffEditorWidget model got reset 에러 발생원인: @monaco-editor/react의 DiffEditor가 props 변경 시 모델을 재생성하면서 dispose 충돌 발생해결: keepCurrentOriginalModel={true} + keepCurrentModifiedModel={true} props 추가 (단 2줄!)결과: 복잡한 cleanup 로직 없이 깔끔하게 해결, 코드 45% 감소들어가며imprun.dev는 Kubernetes 기반 서버리스 Cloud Function 플랫폼입니다. 웹 콘솔에서 함..
작성일: 2025년 10월 27일카테고리: Kubernetes, Gateway API, Kong난이도: 중급TL;DR문제: Ingress는 각 컨트롤러마다 다른 annotation 문법을 사용하여 vendor lock-in 발생해결: Kubernetes 표준 Gateway API로 전환하여 포터블하고 명시적인 설정 달성결과: Kong 전용 KongPlugin → 표준 HTTPRoute로 전환 완료핵심: Gateway API는 단순한 리소스 교체가 아닌, Kubernetes 네트워킹의 패러다임 전환들어가며imprun.dev는 Kubernetes 기반 서버리스 Cloud Function 플랫폼입니다. API Gateway로 Kong Ingress Controller를 사용하면서, vendor 종속적인 ann..
작성일: 2025년 10월 27일카테고리: Kubernetes, Security, Networking난이도: 중급TL;DR문제: Kong Gateway를 80/443 포트에서 실행하려면 root 권한 필요 (보안 위험)해결: NodePort(30080/30443) + iptables 포워딩으로 보안, 고가용성, 무중단 배포 모두 확보핵심: Linux 1024 미만 포트는 root만 바인딩 가능하지만, iptables는 커널 레벨에서 포워딩결과: Pod는 root 없이 실행, 다중 Pod로 HA 구성, Rolling Update 무중단, 외부에서는 80/443으로 접속들어가며imprun.dev는 Kubernetes 기반 서버리스 Cloud Function 플랫폼입니다. API Gateway로 Kong을 운..
작성일: 2025년 10월 27일카테고리: Kubernetes, Gateway API, Kong난이도: 중급TL;DR문제: Ingress는 각 컨트롤러마다 다른 annotation 문법을 사용하여 vendor lock-in 발생해결: Kubernetes 표준 Gateway API로 전환하여 포터블하고 명시적인 설정 달성결과: Kong 전용 KongPlugin → 표준 HTTPRoute로 전환 완료핵심: Gateway API는 단순한 리소스 교체가 아닌, Kubernetes 네트워킹의 패러다임 전환배경: Ingress의 파편화 문제Ingress의 현실Kubernetes에서 HTTP 라우팅을 설정하는 가장 일반적인 방법은 Ingress 리소스입니다. 하지만 실무에서는 큰 문제가 있습니다.같은 기능, 세 가지..
imprun.dev Console 개발 가이드새로운 세션에서도 일관된 개발을 위한 프론트엔드 아키텍처 및 코딩 규칙목차기술 스택아키텍처 패턴프로젝트 구조페이지 작성 규칙컴포넌트 작성 규칙Hooks 패턴타입 시스템스타일링 & 디자인 시스템 ⭐API 서비스 패턴새 기능 추가 가이드코드 리뷰 체크리스트기술 스택CoreReact 19: UI 라이브러리react-router-dom v6: 클라이언트 사이드 라우팅TypeScript: strictNullChecks: false, noImplicitAny: falseVite: 빌드 도구상태 관리Zustand: 전역 상태 (auth, ui)TanStack Query v5: 서버 상태 관리UITailwind CSS v4: 유틸리티 기반 스타일링shadcn/ui: UI 컴..
작성일: 2025년 10월 27일프로젝트: imprun.dev (Kubernetes 기반 서버리스 Cloud Function 플랫폼)키워드: Claude AI, 프론트엔드 아키텍처, 개발 가이드, Container/Presentational Pattern, Layered Architecture들어가며imprun.dev는 Kubernetes 기반 서버리스 Cloud Function 플랫폼입니다. 프론트엔드를 개발하면서 Claude AI와 협업하는 과정에서, 새 세션마다 코딩 스타일이 달라지는 문제에 직면했습니다.우리가 겪은 문제:❌ 새 세션마다 다른 패턴: useQuery → useState, Service Layer 생략 등❌ 프레임워크 변경 시 (Next.js → React Router) 일관성 상실❌..
Next.js를 버리고 순수 React로 돌아온 이유: 실무 관점의 프레임워크 선택 여정작성일: 2025년 10월 27일키워드: Next.js, React Router, 프론트엔드 아키텍처, Docker 배포, 환경 변수 관리, K8s들어가며imprun.dev는 Kubernetes 기반 서버리스 Cloud Function 플랫폼입니다. ARM64 클러스터(노드당 4 cores, 24GB)에서 운영하면서, Next.js App Router의 리소스 사용량이 심각한 병목이 되었습니다.우리가 겪은 문제:❌ Next.js 런타임 메모리: 768MB (nginx + React는 30MB)❌ 빌드 시간: 5분 (Vite는 1분)❌ 환경 변수: 빌드 타임에 고정되어 환경별 이미지 필요✅ React Router DOM..
- Total
- Today
- Yesterday
- Rag
- AI agent
- LLM
- Ontology
- Claude
- frontend
- LangChain
- SHACL
- Tailwind CSS
- claude code
- backend
- PYTHON
- workflow
- knowledge graph
- react
- Next.js
- Developer Tools
- authentication
- architecture
- authorization
- 개발 도구
- AI
- Go
- Kubernetes
- api gateway
- troubleshooting
- Developer Productivity
- security
- AI Development
- ai 개발 도구
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | 6 | |
| 7 | 8 | 9 | 10 | 11 | 12 | 13 |
| 14 | 15 | 16 | 17 | 18 | 19 | 20 |
| 21 | 22 | 23 | 24 | 25 | 26 | 27 |
| 28 | 29 | 30 |