만든 것

Pado AI 사내 플랫폼

팀별로 흩어져 있던 AI 활용을 한곳으로 모은 사내 플랫폼. 프롬프트를 자산으로 관리하고 검증하는 환경을 만들었습니다.

• 프롬프트 엔지니어링 전용 에디터 개발
• 프롬프트 버전관리 시스템 설계
• Cisco SkillSpector 프롬프트 스캐너 추가
• meta agent rule of two 규칙 스캐너 개발

Next.js · React · TypeScript · ts-pattern · Zustand · Tailwind · shadcn(base ui) · Framer · Prisma · TanStack Query

EC 물류진단 대시보드

카페24 프로 매일배송 서비스의 사용 전후 데이터를 차트로 보여주고 미래 예측값까지 함께 제공하는 대시보드. 2.3일 만에 개발해 배포했습니다.

• Recharts로 14종 커스텀 그래프 개발
• 드래그 가능한 비교 슬라이더
• Codex를 사용한 JSX 생성

Next.js · React · TypeScript · shadcn · Tailwind · React Query · Recharts

AI Driven E2E Testing

블랙박스 테스트만으로 웹 품질을 담보할 수 있을지 확인한 연구. 7가지 기능 테스트 전략을 정의하고 AI가 시나리오를 직접 생성·실행하는 시스템을 만들었습니다.

• 몽키 · 페르소나 · 목적 기반 · 탐색적 · 회귀 리스크 · 상태 전이 · 경로 조합 7종 전략 정의
• Ollama와 Gemma3 로컬 세팅
• 결과 페이지 제너레이터 구현

TypeScript · Playwright · Ollama · Gemma3

AI Driven ESLint Plugin

컨벤션 문서 자체를 린팅할 수 있다면 어떨까에서 출발한 연구. 별도 플러그인 설치 없이 자연어로 쓴 규칙을 이해하고 자동으로 린팅하는 기능을 구현했습니다.

• Ollama와 Gemma3 로컬 세팅
• ESLint 플러그인용 프롬프트 및 기능 구현

ESLint · TypeScript · Ollama · Gemma3

에디봇 렌더

회원가입만으로 상품 상세페이지가 자동 생성되도록, API 요청만으로 Playwright가 에디봇 편집을 대신 수행하는 백엔드 서버를 만들었습니다.

• 환경별 동작 차이를 흡수하는 체이닝 패턴 environment 함수 개발
• 로깅과 3회 재시도 retry 함수로 저사양 환경의 제어 실패 방지
• 파드 3개 제한을 위한 Redis 락 구현, RabbitMQ 무한루프에 Backoff 전략 적용
• Docker에서 종료되지 않는 Playwright를 좀비 프로세스로 만들어 최적화
• 엘라스틱서치 기반 로깅과 그라파나 대시보드 구성

Next.js · TypeScript · Prisma · Redis · amqplib · Docker · Playwright · winston

ChatGPT 프롬프트 최적화 툴

프롬프트를 작성할 때마다 품질 편차가 생기는 문제를 줄이기 위한 사내 공유 도구. 작성 → AI 최적화 → 평가 → 개선을 반복합니다.

• Confluence에서 ImportMap으로 React 프로젝트 구성
• LocalStorage를 useRecoilState처럼 사용하도록 추상화

ImportMap · React · styled-components · TypeScript · TanStack Router · OpenAI API

CS AI 자동화

CS팀과 운영팀을 거치며 지연되던 기술문의 처리를, AI와 TF-IDF 알고리즘으로 분류·검색해 단축했습니다.

• React에서 TF-IDF 검색 알고리즘으로 문답 검색 구현
• n8n에서 TF-IDF로 Confluence 링크 생성
• OpenAI API로 기술문의와 일반문의를 분류하는 프롬프트 엔지니어링

ImportMap · React · TypeScript · OpenAI API · Slack API · Jira API · n8n

IT 커뮤니티 코파운드

개발자·디자이너·기획자를 위한 질의응답과 채팅 커뮤니티. 디자이너·프론트·백엔드 6인팀을 이끌고 주말 프로젝트로 개발했습니다.

• PC·모바일 모노레포 프로젝트 구성
• WYSIWYG 에디터 구현
• 아토믹 디자인과 컴파운드 컴포넌트 디자인 시스템 구축
• Stackflow로 모바일 버전 화면 개발
• GitHub Actions로 CI 구축, LetsEncrypt 적용

Yarn Workspace · React · Zustand · Emotion · Next.js · TypeScript · Stackflow · NextAuth

라이센스 관리 시스템

소프트웨어 크랙 문제에 대응하는 온라인 인증 서비스. 미국·일본·한국 개발자가 디스코드로 라이브 코딩하며 함께 만들었습니다.

• C++로 작성된 암호화 모듈과 연동
• 동접자 계산 알고리즘, BitFlag 2중 권한 확인
• 느린 접속 환경을 위한 스켈레톤 컴포넌트 및 UX 구조 연구
• 한국어 · 일본어 · 중국어 제공
• PHP REST 프레임워크(phpExpress)와 ORM(phpSequelize)을 직접 만들어 오픈소스화

Nuxt.js · Vuetify · PHP · JWT · i18next · 암호화

Entum 라이센스 관리 · C# 빌더

개발자의 소프트웨어를 보호하는 두 가지 방법 중 Electron 빌더를 담당했습니다. 인증된 계정에서만 암호화된 소스를 내려받아 빌드합니다.

• 웹 인증 라이센스 정보를 Electron 내에서 암호화해 전역 상태로 관리
• 인증 계정에서 암호화된 소스 다운로드 후 빌드 실행
• i18next로 7개 국어 번역 적용
• GitHub을 이용한 자동 업데이트 구현

Nuxt.js · Vuex · Electron · C# · .NET · RSA · JWT · Vuetify

AI 관제 시스템

세창화학 생산설비의 센서 빅데이터를 LSTM으로 학습시켜 미래에 발생할 장애를 사전 탐지하는 예지 보전 관제 시스템.

• LSTM 모델 및 Anomaly Detection 연구 개발
• Memoization과 Lazy 로드로 컴포넌트 지연 로드 구현
• 네비게이션 가드 및 BitFlag 2중 권한 확인
• 전역 함수·컴포넌트 사용을 위해 react-global-components를 만들어 오픈소스화

React · Redux · TypeScript · Express · Sequelize · Flask · TensorFlow · MySQL · Redis · InfluxDB

권역별 대기개선 통합관리 시스템

환경부 환경 정책의 효과와 영향, 연구 자료를 공유하고 환경 데이터를 입력·평가하는 시스템의 유지보수.

• 디자인 교체 작업
• 엑셀 다운로드 및 업로드 구현
• 프로젝트 리팩터링, 코드 퍼포먼스 개선, SQL Injection 보안 작업

Spring Boot · Thymeleaf · Oracle

바이럴 마케팅 통합 도구

호스팅 회사의 네이버 블로그 게시글을 티스토리로 옮기고 새로운 마케팅 활로를 찾는 업무.

• 네이버 블로그 · 티스토리 · 페이스북 · 인스타그램 통합 관리 도구 개발
• 네이버 블로그에서 티스토리로 데이터 이전 도구 개발

AutoIt · 마케팅 자동화