<ziny/>

1. 배경 및 문제 상황2026년 1월, 주문 데이터가 급증하면서 정산 배치 및 조회 로직 실행 시 Connection Pool Timeout 에러가 빈번하게 발생했습니다.현상: 정산 페이지 로딩 실패 및 서버 에러 로그 누적원인 추정: 대량의 데이터를 처리하며 커넥션을 지나치게 오래 점유함 2. 해결 방안 검토 및 의사결정[2-1] DB 커넥션 풀 단순 증설현재 default 값(num_cpus::get_physical() * 2 + 1)인 커넥션 풀을 더 늘려서 임시 방편으로 대응하는 방법기각 사유: 현재 백오피스와 유저용 API 서버가 하나의 DB를 공유하는 통합 DB 환경으로 되어있어, 백오피스에서 커넥션을 독점할 경우, 실제 유저 서비스 장애(API 지연)로 이어질 위험이 커 기각했습니다.[2-..

어드민 화면을 만들다 보면,input 컴포넌트를 공통화하고 싶은 순간이 꼭 오는데요 저도 처음에는 'label, error, icon 모든 걸 다 포함한 input하나 만들면 편하겠다."라고 생각했습니다.그래서 input에 이런 저런 props를 계속 추가하기 시작했습니다. 나름 잘 정리되고 있다고 생각했는데요페이지가 늘어가고, input의 종류가 많아질수록props는 점점점 늘어가기 시작했습니다.공통 Input이 점점 무거워졌다.문제가 생기기 시작한건 화면에 따라 요구사항이 조금씩 달라질 때였습니다. 예를 들면어떤 input은 label이 필요가 없고,clear버튼은 text input에만 필요가 있고,icon이나 endAdronment는 케이스마다 달라지기 시작했습니다. props가 늘어가다 보니, ..

FE 개발자의 서버 상태 관리 여정 기록.. 협업에서 관리자 페이지를 만들다 보면 엄청 많은 API를 요청을 다루게 되는데요.저도 모든 페이지에서 Axios를 사용해서 서버와 통신했고,DashboardApi 와 같은 API 레이어를 나눠서 깔끔하게 아키텍처를 유지하고 있다고 생각했습니다. 하지만 페이지수가 늘어나고, 실시간으로 요청 받아야하는 화면이 많아지면서어느순간 부터는 axios만으로 모든 상태를 관리하는 것이 어려워지기 시작했습니다. 이 글에서는 제가 왜 React Query를 도입하기로 결심 했는지,그리고 Axios와 React Query를 조합하면 어떤 장점이 있는지를 경험 기반으로 공유해 보려고 합니다. 1. 처음에는 Axios 만으로 충분했습니다.초기에는 API 요청 로직을 분리해 다음과 ..

Vercel은 프론트엔드 개발자에게 정말 편리한 배포 플랫폼이지만,Pro 요금제부터는 팀원당 $20의 추가 요금이 붙습니다. 예: 팀원 3명이면 기본 $20 + 추가 $40 → 월 $60~70 발생 단순히 Preview 배포를 만들기 위해 팀원을 초대하기엔 너무 비싸죠.그래서 이번 글에서는 Vercel 팀원으로 초대하지 않고도 배포를 처리하는 방법을 정리해봤습니다. ❗ 이런 에러 메시지를 본 적 있다면?Vercel - Git author hziny722 must have access to the project on Vercel to create deployments.이 에러는 PR을 만든 GitHub 사용자가 Vercel 프로젝트 접근 권한이 없어서 배포가 막힌 경우입니다.하지만 실제로 배포 권한 없이..

회사의 일과, 나의 개인 프로젝트를 동시에 진행하다보면,하나의 컴퓨터에서 여러 github계정을 써야할때가 있습니다. SSH키와 git 설정 관리만 잘하면, 깔끔하게 계정별 pull/push가 가능합니다. (참고)저는 회사 노트북을 기준으로 작업합니다. 모든 노트북은 하나의 계정을 이미 바라보고 있다는 가정하에 진행하겠습니다. 1. SSH 키 생성ssh-keygen -t ed25519 -C "personal@email.com" -f ~/.ssh/id_ed25519_personal - "" 사이에 개인 깃허브 계정을 작성해주세요- Enter passphrase (empty for no passphrase): 비밀번호 입력하라고 나오는데 해도되고 안해도 됩니다. - 비밀번호 입력을 하면, 매번 비밀번호를..

2025.03 ~ 2025.06방통대 컴퓨터과학과 3학년 1학기 후기 비전공자 개발자로 일한 지 어언.. 3년이 가까워질 때쯤CS에 관한 지식의 부재를 굉장히 많이 느꼈고,컴공을 나오신 분들한테 알게 모르게 부러워하고 있던 찰나 방통대 편입기간이 되어서 편입 신청을 하게 되었습니다.편입 자체는 어렵지 않았고, 그냥 기간에 맞춰서 필요한 서류만 제출하면 끝이었습니다. 방통대는 온라인으로 수업이 이루어지고,한 학기 당 학비가 30만 원대 선으로 비싸지 않아서 편입을 하게 되었습니다. [수강 내역 및 강의 후기]💡 원격대학교육의 이해 (1학점)처음 학교에 입학하면 들어야 하는 강의입니다.총 15개의 강의로 이루어져 있고, 80% 이상만 들으면 Pass입니다.저는 실제로 80%만 들었습니다. 그리고 정말 필..

프로젝트를 운영하다 보면, 실수로 빌드가 깨진 코드를 push 하는 경우가 생깁니다.이런 문제를 사전에 방지하기 위해git push 하기전에 build를 자동으로 하도록 처리하는 방법에 대해서 알아보겠습니다. 💡 작업 순서 1. 프로젝트의 루트에서 .git/hooks/pre-push 파일생성 2. pre-push에 코드 추가#!/bin/shnpm run build 3. 터미널에서 실행 권한 부여chmod +x .git/hooks/pre-push git push를 하면 자동으로 npm run build가 먼저 실행됩니다.build에 실패하면 push가 중단되고, 성공해야만 push도 성공합니다. 🔴 마주하는 다양한 에러들 [에러1] pre-push 파일이 안 보이는 경우 🔎 원인: pre-push ..

지난 주에는 zustand의 기본핵심인 createStore에 대해서 알아보았습니다.🎯 이번주 학습목표" 미들웨어 redux.ts 와 subscribewithSelector.ts 파일 분석하기 " Redux 패턴의 zustand의 구현방식에 대해서 알아보고,subscribewithSelector.ts 의 선택적 구독 패턴의 구현방식에 대해서 알아보도록 하겠습니다.🔨 redux.ts의 전체 구조와 주요 설명 zustand는 아주 간단한 상태 관리 라이브러리 이지만,내부적으로 미들웨어를 통해 Redux의 패턴도 지원합니다. ❓ Redux 패턴을 사용하는 이유 1. 상태 변화의 흐름이 명확 Redux의 핵심" 상태는 항상 dispatch -> reducer -> 새로운 상태 " - 상태 변화의 원인을 추..

상태관리 라이브러리 중 하나인 zustand는 많은 프론트엔드 개발자들에게 사랑 받고 있습니다.이번 스터디에서는 그 핵심을 더 깊게 이해하기 위해서,zustand를 싹싹 훑어 보려고 합니다! 🎯 이번주 학습목표" zustand의 내부 로직이 구현되어있는 vanila.ts 파일을 분석하기 " 이 파일은 상태를 생성하고 관리하는 zustand의 핵심 엔진부분입니다.자주 사용하는 crate함수의 바탕이 되는 코드로,파일에 담긴 함수와 인터페이스를 살펴보고 이해해 보도록 하겠습니다🔨 vanila.ts의 전체 구조와 주요 설명 ❓ 상태 생성 원리 - createStoreconst createStore = ((createState) => createState ? createStoreImpl(createSta..

프로세스 스케줄링스케줄링: 여러가지 작업의 처리 순서를 결정하는 것프로세스 스케줄링: 주어진 프로세스가 여러개인 경우, 프로세스의 처리 순서를 결정하는 것스케줄링 단계상위단계 스케줄링: 작업이 들어오면 어떤 작업을 프로세스로 만들것인지 결정하위단계 스케줄링: 준비 큐에 있는 프로세스를 선택해 사용가능한 CPU를 할당 하는 역할, 주체는 dispatcher중간단계 스케줄링: 시스템에 대한 단기적인 부하를 조절스케줄링의 기본 목표공정성: 모든 프로세스가 적정 수준에서 CPU작업을 할 수 있게 함균형: 시스템 자원이 충분히 활용될 수 있게 함운영체제에 따른 스케줄링 목표일괄처리 운영체제처리량의 극대화: 주어진 시간에 처리한 프로세스의 수반환시간의 최소화: 프로세스 생성시점 부터 종료시점까지의 소요시간CPU활용..