HM소프트

쇼핑몰 고객 상담 챗봇을 LLM 없이 규칙 기반으로 만든 기록. 버튼 우선·자유 입력 보조의 두 갈래 대화 엔진과 키워드·FAQ 양방향 매칭, 환불 정책을 SQL 조건으로 표현하기, sql.js의 동시성 트레이드오프, npm ci와의 CI 싸움까지 담았다.왜 LLM 없이 시작했나쇼핑몰에 들어오는 고객 문의는 패턴이 지독하게 뻔하다. "주문한 거 언제 와요", "환불 어떻게 해요", "사이즈 바꿀 수 있나요". 상담 인력이 같은 답을 하루에 수십 번씩 복사·붙여넣기 하는 걸 보면, 이건 사람이 아니라 코드가 할 일이라는 생각이 든다. 그래서 한 쇼핑몰의 고객 상담용 챗봇을 만들기로 했다.처음부터 외부 LLM API를 붙일 수도 있었다. 하지만 일부러 그 길을 택하지 않았다. 이유는 세 가지였다. 첫째, 쇼..

4대보험·소득세 계산 엔진을 React에서 떼어 순수 함수로 짜고, 근로시간부터 통상시급·수당·과세급여·보험·세금까지 6단계 직선 파이프라인으로 순서를 못 박는다. 7가지 근로 유형 분기, 5인 미만 가산 비대칭, 항목별 절사 규칙, 국민연금 상한하한과 두루누리 감면, 간이세액표 lookup, 네트 역산출을 이분법으로 푸는 과정을 다룬다.매달 반복되는 계산을 코드로 박제하기매달 급여명세서를 만들 때마다 같은 계산을 반복했다. 기본급에서 4대보험을 빼고, 간이세액표를 뒤져 소득세를 떼고, 지방소득세를 붙이고, 실수령액을 맞춘다. 엑셀로 하다 보면 요율이 바뀐 해에 수식 하나를 놓쳐 전 직원 명세서를 다시 뽑는 일이 생긴다. 게다가 우리가 쓰는 인력 구성은 평범하지 않았다. 주 5일 정규직만 있는 게 아니라..

IntersectionObserver와 CSS 트랜지션으로 라이브러리 없는 스크롤 등장 효과를 만들고 prefers-reduced-motion으로 멀미를 막는다. 로케일을 통제 못 하는 네이티브 datetime 입력을 버리고 값 계약이 같은 자체 날짜 피커로 드롭인 교체하며, 가입 페이지는 폼 로직을 건드리지 않고 투 컬럼으로 재설계하고 다크 모드 반전 함정과 입력 정제까지 다룬다.런칭 이후, 첫인상이라는 다음 싸움1~3편에서 한 과제 채점 플랫폼의 핵심 기능 — 채점 파이프라인, 교사 승인 흐름, 다국어 전환과 배포 정리 — 을 만들고 시리즈를 일단락했다. 그런데 막상 런칭하고 며칠 지켜보니, 기능이 도는 것과 제품이 좋아 보이는 것은 별개의 문제라는 게 분명해졌다.기능은 잘 돈다. 교사가 가입하고, ..

알림을 읽음/안읽음이 아니라 미결·확인중·조치완료 상태와 이력을 가진 일감으로 모델링한다. 플러그인 detector 엔진과 message 지문 dedup, 클라이언트 필터가 100건 윈도에서 무너진 한계를 서버사이드 필터·안정 정렬·일괄 확인으로 옮긴 과정, 데이터 소스 seam까지 다룬다.2편: 알림은 토스트가 아니라 "일감"이다1편에서 웹·앱이 공유하는 백엔드 API를 다뤘다. 이번 편은 그 위에 올라간 기능 중 가장 공들인 알림(alerts) 시스템이다. 백엔드의 이상 감지 엔진과, 그것을 소비하는 관리자 웹(Next.js 16 + React 19)을 함께 본다.대규모 사업장 시스템에서 "알림"은 화면 구석에 잠깐 떴다 사라지는 토스트가 아니다. 관리자가 처리해야 할 일감의 목록이다. 연속 결근, ..

추출구 5개 자동 드립 머신의 태블릿 컨트롤 패널을 빌드 없는 브라우저 Babel과 CDN React로 만든다. 5열 그리드 잠금, 진행률 링 대신 단면도 애니메이션, getBrewSnapshot 한 함수로 큰 화면과 미니 화면을 동기화한 시간 모델, 공전 주전자 vs 고정 물줄기 정렬 버그까지 다룬다.시리즈를 시작하며핸드드립 커피를 자동으로 내려주는 기기의 태블릿용 컨트롤 패널 데모를 만들었다. 실제 장비는 추출구(스파웃)가 다섯 개 달린 자동 드립 머신인데, 영업·전시 자리에서 "이 기기는 화면에서 이렇게 동작합니다"를 장비 없이 보여줄 프로토타입이 필요했다. 그래서 두 가지 제약이 처음부터 못 박혀 있었다. 첫째, 백엔드 없이도 돌아가야 한다 — 데모를 위해 서버를 운영하고 싶진 않았다. 둘째, 화..

부품 유통 관리 ERP 프로토타입을 React와 Express로 만든 기록. 회계·인사·영업·구매·재고·생산 6개 모듈 경계를 API prefix로 강제하고, 집계 전용 대시보드 엔드포인트, 인메모리 데이터 계층과 prefix ID, 다국가 통화 분리, 재고 알림 재계산과 작업지시 상태 머신, YAML 한 장 배포와 CORS·SPA rewrite까지 다룹니다.프로토타입에 ERP를 통째로 욱여넣기여러 나라에서 부품을 수입해 국내에 공급하는 유통 업무를 가정하고, 그 업무 흐름을 한 화면에서 다루는 웹 ERP 프로토타입을 만들었다. 회계·인사·영업·구매·재고·생산 — 보통 ERP라고 부르는 영역 6개를 모듈로 나눠 한 시스템에 담았다. 백엔드는 Express, 프론트엔드는 React로 짰고, 마지막에 클라우..