BUILT WITH PURPOSE

기술의 이름보다,
어떻게 쓰는지가 중요하니까.

서버부터 데이터와 사용자 화면까지. 프로젝트의 목적에 맞춰 선택한 기술과 실제로 구현한 방식을 소개합니다.

01 / ENGINEERING NOTES

QWERP 통합 ERP

상품·재고·발주·거래처·정산과 조직·전자결재·쇼핑몰 주문을 하나의 업무 흐름으로 연결합니다.

서버와 애플리케이션

PHP 8.1+Composer PSR-4Apache

PHP로 화면·JSON API·업무 서비스 계층을 구성합니다. PSR-4 자동 로더로 기능을 모듈화하고, Apache 설정으로 소스·설정 경로의 웹 접근을 제한합니다. Composer 미지원 환경을 위한 자체 자동 로더도 제공합니다.

데이터와 업무 정합성

MySQL / MariaDBPDO트랜잭션

상품·재고·발주·결재·정산 데이터를 관계형 DB에 저장합니다. PDO 바인딩 쿼리, 트랜잭션과 MySQL 행 잠금으로 여러 업무 단계가 함께 변경되도록 처리합니다. SQLite 호환 경로는 개발·회귀 검증에 사용합니다.

업무 화면과 외부 도구

JavaScriptjQueryBootstrapKakao 우편번호

대시보드, 검색 목록, 입력 폼, 모달과 Ajax 요청을 구현합니다. 주소 검색에는 Kakao 우편번호 도구를 연동하고, 회사·직원별 메뉴와 기능 접근을 구분합니다.

브라우저 문서 인식

ONNX Runtime WebPP-OCRv5Tesseract.jsPDF.js

사업자등록증 PDF를 Canvas 이미지로 변환하고 한국어 모델과 보조 OCR로 주요 항목을 읽습니다. 결과가 충돌하거나 신뢰도가 낮은 항목은 재확인 대상으로 표시해 신청 입력을 보조합니다. OCR 추론은 사용자의 브라우저에서 실행합니다.

운영과 배포

PHP CLI배치 대기열소스 패키징

운영사 승인, 상품 공급, 파트너 업그레이드와 정산 반영을 재시도 가능한 대기열로 처리하는 배치를 제공합니다. 운영사별 소스 루트, 변경 패키지, 업로드 미러 검사와 PHP 회귀 검증 도구를 구성했습니다.

02 / ENGINEERING NOTES

도매 ERP · DDM ERP

도매 업무의 거래처·품목·발주·입고·출고·반품·거래명세서·정산을 하나의 흐름으로 연결한 멀티테넌트 ERP입니다. 회사별 데이터 범위와 직원별 업무 권한을 서버에서 확인합니다.

서버 · 운영 환경

Rocky Linux 9.8Apache 2.4PHP 8.4PHP-FPMOPcachesystemd

Apache가 웹 요청을 받아 PHP-FPM으로 전달하고, PHP가 업무 API와 관리자 화면을 처리합니다. OPcache로 PHP 실행 코드를 캐시하며, systemd로 문서 전송 작업자와 별도 서비스를 관리합니다. Linux 권한·TLS·로그·백업 및 복구 절차를 함께 운영하는 구조입니다.

업무 프로그램 · API

PHP서비스 계층PHP ViewJSON API

업무 규칙을 출고·거래·회사·인증 등의 서비스로 나누고, PHP View에서 화면을 구성합니다. JSON API가 거래처·품목·발주·출고·반품·명세서·정산 요청을 검증합니다. 부분 입고·부분 출고와 취소·반품의 상태 변화를 업무 이력에 연결합니다.

데이터베이스 · 업무 일관성

MariaDB 10.11InnoDBPDO트랜잭션행 잠금

공유 데이터베이스에서 인증된 회사 범위를 기준으로 데이터를 분리합니다. 입고·출고·재고 이동과 감사 기록을 트랜잭션으로 처리하고, 수량·금액·주문 잔량을 서버에서 검증합니다. 입금 배분·미수금·반품 차감·환불 기록을 정산 잔액으로 연결하고 중복 처리를 방지합니다.

관리자 화면 · 반응형 UI

HTMLCSSJavaScript ES ModulesjQuery 일부Bootstrap 일부

ES 모듈과 공통 CSS로 관리자 화면을 구성하고 비동기 요청으로 업무 데이터를 갱신합니다. PC·태블릿·모바일 레이아웃, 작업 탭과 개인 도구함 상태 유지, 인쇄 화면과 다국어 UI를 구현합니다.

거래명세서 · 파일 처리

Headless ChromePopplerPHP GD작업 대기열

거래명세서 HTML을 Headless Chrome으로 PDF 출력하고 Poppler로 이미지 변환한 뒤 PHP GD로 압축합니다. 작업 시간과 동시 작업 개수를 제한하고 문서 스냅샷과 발송 이력을 연결합니다. 문서 생성과 발송을 별도 작업자로 처리하는 구조를 갖췄습니다.

문자 · 이메일 · 외부 연결

ALIGO SMS/MMSPostfixDovecotRoundcubeGoogle Calendar OAuth

출고 알림과 거래명세서를 문자·이메일로 전송하고, 문자 공급자 접수와 실제 전달 결과를 구분합니다. Postfix·Dovecot·Roundcube로 전송과 웹메일 기능을 구성하며, Google Calendar OAuth 연결 코드를 통해 업무 캘린더 계정 연동을 지원합니다.

별도 서비스 · 업무 보조

Node.js 24MeshCentralPython OCRbwip-js

Node.js와 MeshCentral로 원격지원 연결을 구성하고 Python 작업자로 문서 OCR을 처리합니다. PHP 웹 요청과 별도 프로세스로 역할을 나누며, bwip-js는 업무 도구함의 바코드 생성에 사용합니다.

인증 · 권한 · 변경 관리

PHP 세션CSRFOTPArgon2id메뉴별 권한Git

비밀번호를 Argon2id로 해시하고 세션·OTP·로그인 시도 제한을 적용합니다. 회사·메뉴·조회/등록/수정/삭제 권한을 API에서도 검사합니다. 격리 데이터베이스 회귀 검사, 배포 체크섬 대조와 백업·복구 문서로 변경을 관리합니다.

03 / ENGINEERING NOTES

유틸리티 전산 · 모두툴

계산·이미지·PDF·텍스트·개발·네트워크 도구를 하나의 워크스페이스로 구성한 플랫폼입니다. 브라우저의 파일 처리와 PHP 서버의 회원·운영 설정·공식 데이터 연동을 연결합니다.

호스팅 · 서버 프로그램

카페24 웹호스팅PHP 8.4PDOSQLiteMySQL

PHP로 페이지·인증·운영 API를 제공하며 공개 웹 폴더와 비공개 앱·설정·저장소를 분리합니다. 로컬 SQLite와 운영 MySQL을 PDO 공통 연결로 지원하고, prepared statement로 회원·설정·즐겨찾기·감사 기록을 관리합니다.

브라우저 도구 엔진

JavaScript ES ModulesCanvasWeb WorkerWeb CryptoFile API

도구별 모듈을 필요한 시점에 불러오고 브라우저에서 계산·파일 읽기·이미지 편집·결과 다운로드를 처리합니다. Canvas로 이미지 변환과 미리보기를, Worker로 GIF 인코딩 등을 실행합니다. Web Crypto를 비밀번호와 무작위 추첨에 사용하며, 이미지·문서 원본의 서버 전송이 필요 없는 도구를 구현했습니다.

PDF · 문서 처리

pdf-lib 1.17.1Mozilla PDF.js 6.4.299fflate 0.8.2

pdf-lib로 PDF 생성·병합·페이지 추출·회전·메타데이터 편집을 처리하고 PDF.js로 페이지 썸네일과 이미지 변환을 제공합니다. 여러 결과 파일은 fflate로 ZIP 또는 Gzip으로 저장합니다.

이미지 · QR · 바코드

gif.js 0.2.0exifr 7.1.3node-qrcode 1.5.1bwip-jsDOMPurify

gif.js로 프레임·간격·반복 설정을 가진 GIF를 만들고 exifr로 EXIF·GPS·IPTC·XMP를 읽습니다. QR 코드에 색상·로고·문구를 적용하고 bwip-js로 여러 1D/2D 바코드를 생성합니다. SVG 변환 전 DOMPurify로 스크립트와 외부 참조 등을 정화합니다.

텍스트 · 개발자 도구

markedDOMPurifyjs-yamljsdiffsql-formatter

marked와 DOMPurify로 마크다운을 안전한 HTML 미리보기로 변환합니다. YAML/JSON 상호 변환, 텍스트 차이·Unified Diff, SQL 방언별 포매팅과 JSON·CSV 등의 데이터 정리를 도구별 입력·결과 화면으로 제공합니다.

공식 데이터 · 외부 API

한국은행 ECOS토스증권 Open API식약처 OpenAPI의약품안전나라PHP cURL

PHP 서버가 환율·주식·의약품 등의 외부 데이터를 조회하고 형식과 기준일을 검증합니다. 인증키는 비공개 설정에 보관하며 응답 캐시·호출 간격·오류 처리를 적용합니다. 공식 기준표 동기화는 검증 후 원자적으로 교체하고 실패 시 이전 자료를 유지합니다.

차트 · 지도 · 시각화

TradingView Lightweight Charts 5.2.1Leaflet 1.9.4CanvasSVG

캔들·이동평균·거래량·시세표를 연동하고 드래그·확대/축소·범위 유지를 구현합니다. Leaflet으로 IP 조회의 지역·통신망 결과를 지도에 표시하며, 도구별 결과를 표·차트·이미지로 제공합니다.

운영 관리자 · 소스 관리

CodeMirror 6LezerAcornNode.jsPHP proc_open

관리자가 도구 공개 상태·설명·디자인·검색 메타데이터와 API 연결을 제어합니다. CodeMirror에서 유틸리티 JavaScript 소스를 편집하고 Acorn·Node.js로 구문을 검사한 뒤 실행용 모듈을 발행합니다. 이 Node 실행은 소스 검사용이며 일반 도구에 상시 Node 웹 서버가 필요한 구조는 아닙니다.

프리즘카드 통합 · 배포 자산

React 정적 빌드PHP 인증 세션비공개 파일 저장소자체 호스팅 벤더 자산

프리즘카드의 빌드된 React 화면을 PHP 진입점으로 제공하고 회원 세션과 개인 카드 저장소를 공유합니다. 개인 업로드는 소유권을 검사하는 API로 제공합니다. 주요 브라우저 라이브러리와 글꼴은 고정 버전을 자체 제공하고 라이선스와 파일 지문을 유지합니다.

04 / ENGINEERING NOTES

업종별 예약 시스템

상담·숙박·미용실의 서로 다른 예약 항목과 운영 방식을 반영하고, 고객 신청과 운영자의 확정·취소·방문 완료 처리를 연결합니다.

예약 업무 처리

PHP서비스 계층업종별 모듈

상담·일반 예약, 펜션, 미용실의 예약·설정을 구분합니다. 예약 신청부터 확정, 방문 완료, 취소 요청과 취소까지 상태 전환을 관리합니다.

데이터와 운영 기록

MySQLPDOutf8mb4

예약 내역, 업종별 설정, 상태 변경 이력, 관리자 계정과 활동 로그를 저장합니다. PDO prepared statements를 사용해 입력값을 바인딩합니다.

관리자 컨트롤

PHP 관리자 화면메뉴별 권한

공유 관리 화면과 업종별 모듈로 예약 목록·상세·설정·디자이너·관리자·활동 로그를 구성합니다. 관리 계정에 허용된 메뉴를 기준으로 운영 기능을 구분합니다.

05 / ENGINEERING NOTES

네트워크 수당 전산

회원 마이오피스와 관리자 업무를 분리하고, 조직·주문·수당 정책·기간별 정산을 연결하는 네트워크 전산을 개발합니다.

서버와 데이터

PHPMySQLPDO

회원·조직 관계·상품 주문·수당 명세를 저장하고 관리자와 회원 화면을 구분합니다. 확장 소스는 PHP 8.2 이상과 MySQL을 운영 기준으로 두고 SQLite 개발 모드를 제공합니다.

수당 계산과 지급 흐름

PHP 정산 엔진트랜잭션지갑 원장

확장 소스에서 결제 주문과 수당 정책을 기준으로 기간별 검토 정산을 생성합니다. 자격·단계별 요율·공제·지급 상한을 적용하고, 관리자 확정 후 회원 지갑 거래 원장에 반영합니다.

조직 탐색과 관리 화면

D3.jsBootstrapJavaScript

기존 소스의 회원 조직도는 D3 계층 트리로 추천·후원 관계를 시각화합니다. 관리자 화면에서는 회원·주문·수당·게시판·보고서를 관리하고 회원은 자신의 수당과 조직을 확인합니다.

06 / ENGINEERING NOTES

PRISM 인터랙티브 카드

카드 탐색에 빛과 움직임을 더합니다. 포인터에 반응하는 홀로그램부터 계정별 카드 업로드, 브라우저 배경 분리까지 구현했습니다.

프론트엔드와 빌드

React 19TypeScriptNext.js 호환 App RouterVinextVite

React 컴포넌트로 카드 탐색·설정·업로드·프로필 UI를 구성하고 TypeScript로 데이터 구조를 관리합니다. Next.js 호환 라우트를 Vinext/Vite로 실행·빌드합니다.

인터랙션과 시각 효과

CSS 3DPointer EventsrequestAnimationFrame

마우스와 터치 좌표를 카드 기울기·광택·홀로그램 패턴에 연결합니다. 애니메이션 프레임과 CSS 변수를 함께 갱신해 빛의 반사와 움직임을 맞추고, 효과 세기를 사용자가 조절할 수 있게 했습니다.

브라우저 이미지 처리

ONNX Runtime WebU²-NetPWebAssemblyCanvas

오리지널 및 사용자 카드에서 캐릭터 배경을 분리합니다. 브라우저 추론으로 마스크를 생성하고 Canvas에서 투명 WebP로 합성해 입체 회전 보기에 활용합니다.

서버와 영속 저장

Cloudflare WorkersD1R2Drizzle

Workers에서 서버 라우트를 실행하고 D1에 프로필·카드 메타데이터, R2에 이미지를 저장합니다. 계정 소유권을 확인해 자신의 카드만 조회·삭제하며, SQL 바인딩과 Drizzle 스키마를 함께 사용합니다.

카탈로그와 UI 도구

Node.jsPythonTailwind CSSRadix UILucide

Node.js/Python 스크립트로 카드 카탈로그와 다국어 상세정보 인덱스를 준비·검증합니다. 페이지 단위 로딩과 캐시로 탐색 부하를 줄이고, Radix UI의 대화상자·설정 패널과 Lucide 아이콘으로 조작 화면을 구성합니다.

PHP 회원 기능 전환본

PHP 8.1+PDOMySQL / MariaDB

별도 PHP 전환본에 이메일/비밀번호 회원가입·로그인·로그아웃·프로필 저장을 구현했습니다. 카드 탐색·효과·업로드 전체 기능은 React/Cloudflare 앱에 있으며 PHP 전환 범위와 구분합니다.

이 페이지는 DDM_ERP, UTIL, project_alpha_anti, prism_1 및 관련 로컬 프로젝트의 소스와 운영 기록을 확인해 작성했습니다. 서버 버전은 저장소 기록 기준이며 현재 운영 서버를 실측한 결과는 아닙니다. 네트워크 전산은 확인한 두 구현의 역량을 함께 소개하며 연결 사이트의 실제 배포 버전은 별도 확인이 필요합니다.

당신의 업무에는 어떤 기술이 맞을까요?

필요한 기능과 운영 환경에 맞춰 함께 설계합니다.

기술·개발 상담
프로젝트 문의하기