PROJECT_ID: SHDOMI8599
Performance-Driven
Engineer
실시간 데이터 스트리밍 환경에서 렌더링 최적화와 아키텍처 추상화를 통해 사용자 경험을 혁신하는 프론트엔드 엔지니어입니다. 브라우저의 한계를 돌파하고 복잡한 문제를 단순하게 만드는 것에 몰입합니다.
CAREER
METRICS_ANALYSIS
System Performance
9,000 CMT
팀 구성
BE 1명 / FE 1명 / WD 1명
TOTAL_SERVICES
11 LAUNCH
PRODUCTION_BUGS
0 CRITICAL
TOTAL_COMMITS
9,000+
CORPORATE_EXPERIENCE
NDUS INTERACTIVE // XOCIETY
웹 프로그래머 (FE)
핵심 역할
전담 퍼블리셔가 없는 구조에서 프론트엔드 개발과 퍼블리싱을 함께 맡아 여러 프로젝트를 운영했습니다.
팀 인력 구성
확장 기여
공통 스택
웹 퍼블리싱
전담 퍼블리셔 없이 진행된 구조에서 반응형 UI 구현과 퍼블리싱까지 함께 담당했습니다.
01
반응형 UI 구현과 퍼블리싱 전반을 주도했습니다.
02
프로젝트별 요구사항에 맞는 화면 구조와 스타일링을 설계했습니다.
03
운영 중 발견된 이슈를 빠르게 대응하며 화면 품질을 지속적으로 개선했습니다.
Draw & Guess (가제)
백엔드 개발자가 없는 상황에서 실시간 멀티플레이 파티 게임의 전체 아키텍처를 직접 설계하고 구현 중인 프로젝트입니다.
01
Google Quick Draw! 오픈 데이터를 활용해 AI가 그림을 그리고 사용자가 맞히는 핵심 프로토타입을 구현했습니다.
02
서버 봇 로직을 통해 즉시 플레이 가능한 자동 방 환경을 구축했습니다.
03
Next.js와 실시간 채널을 결합해 다중 사용자 상태 동기화 구조를 설계했습니다.
04
다중 접속 환경에서 캔버스 스트로크 렌더링 최적화를 지속적으로 진행하고 있습니다.
LIVE ROOM FEED
실시간 방 현황
현재 Draw & Guess 에서 돌아가는 방입니다. 클릭하면 바로 진입할 수 있습니다.
0개 노출 중
방 정보를 불러오는 중...
코인 에어드랍 사이트
바이낸스와 바이비트 동시 상장 일정에 맞춰 에어드랍 사이트를 기획하고 개발했습니다.
01
레퍼런스 서비스를 분석해 로그인부터 에어드랍 수령까지 전체 사용자 흐름을 설계했습니다.
02
프론트엔드 성능 최적화와 백엔드 협업으로 일평균 14,000명 이상이 사용하는 구조를 운영했습니다.
03
Sui Wallet Connect 기반의 커스텀 서명 플로우를 구현해 사용자가 직접 서명 후 토큰을 수령할 수 있게 했습니다.
Adidas NFT 쇼룸 사이트
아디다스 협업 NFT를 소개하는 쇼룸 사이트를 배포하고 유지보수했습니다.
01
Vercel Analytics 기반의 커스텀 이벤트 트래킹을 추가했습니다.
02
사업 측의 요구에 맞는 추적 지표를 정의하고 필요한 데이터를 제공했습니다.
Admin 사이트
게임 및 토큰 운영을 위한 내부 관리자 사이트를 기획하고 개발했습니다.
01
사업, 게임 개발, PMO 요구사항을 반영한 기능 기획 문서를 작성했습니다.
02
운영 가이드 문서를 작성했습니다.
03
Polygon 토큰 에어드랍 및 소각 기능을 구현했습니다.
04
초대 코드 생성, 삭제, 조회 기능을 구현했습니다.
05
게임 데이터 업로드 기능을 구현했습니다.
06
토큰 비율과 시즌 설정 기능을 구현했습니다.
07
개발용 강제 NFT 지급 도구를 구현했습니다.
08
유저 스테이킹 상태 조회 기능을 구현했습니다.
App 사이트
게임과 NFT 기능을 다양한 방식으로 사용할 수 있는 서비스 화면을 개발했습니다.
01
초대 코드 기능을 구현했습니다.
02
Twitter, Google OAuth2 기반 사전예약 기능을 구현했습니다.
03
NFT 스테이킹 기능을 구현했습니다.
04
Polygon에서 Sui로의 토큰 마이그레이션 기능을 구현했습니다.
05
게임 아이템을 실제 코인으로 전환하는 기능을 구현했습니다.
06
지갑 연동을 Ethers에서 Wagmi로 마이그레이션했습니다.
07
직접 컨트랙트를 호출하는 EVM NFT 민팅 기능을 구현했습니다.
08
MetaMask, OKX Wallet, Coinbase Wallet, Wallet Connect 기반 EVM 로그인을 구현했습니다.
통합 계정 사이트
유저 자산과 이벤트 정보를 조회하고 사용할 수 있는 통합 계정 사이트를 기획하고 개발했습니다.
01
기능 및 UI 기획 문서를 작성했습니다.
02
Epic Games OAuth2 로그인을 구현했습니다.
03
Wallet Connect 기반 계정 연동 기능을 구현했습니다.
04
프리미엄 배틀패스 결제 기능을 구현했습니다.
05
게임 전적 조회 기능을 구현했습니다.
06
게임 이벤트 결과 조회 기능을 구현했습니다.
Draw 사이트
Sui DApp Kit을 활용해 Sui 관련 기능을 사용할 수 있는 사이트를 기획하고 개발했습니다.
01
기능과 UI를 함께 기획했습니다.
02
Sui Connect 로그인을 구현했습니다.
03
NFT 뽑기 티켓과 뽑기 기능을 백엔드 API와 연동해 구현했습니다.
04
리더보드와 개인 랭킹 뷰를 포함한 Sui 트랜잭션 조회 기능을 구현했습니다.
게임 테스트 운영 페이지
게임 테스트 기간에 필요한 이벤트 및 지원 페이지를 개발했습니다.
01
인게임 이벤트 배너 웹뷰를 개발했습니다.
02
인게임 이벤트 슬라이드 웹뷰를 개발했습니다.
03
테스트 결과 페이지를 개발했습니다.
04
테스트 랭킹 리더보드 페이지를 개발했습니다.
05
이슈 공유 페이지와 일일 자동 업데이트 흐름을 개발했습니다.
브랜드 사이트
게임과 팀을 소개하는 브랜드 사이트를 개발했습니다.
게임 런처 기능
게임 플레이 가능 여부를 판단하는 런처 기능을 추가했습니다.
01
오픈 시간에 맞춘 카운트다운 기능을 구현했습니다.
02
NFT 보유 여부와 초대 코드 사용 여부에 따른 플레이 가능 체크를 구현했습니다.
TECH_STACK_LOG
STABLE
[FRONTEND]
React, Next.js, TypeScript, Web Worker, PWA
[STYLING]
Figma, MUI, Emotion, vanilla-extract
[STATE]
React-Query, Zustand
[BACKEND]
Node.js
[INFRA]
Vercel, GitHub Actions
Stack Proficiency
95%
LAB REPORTS
flowbit.exe
FlowBit
고빈도 실시간 WebSocket 데이터를 Web Worker로 처리하는 암호화폐 호가창(Orderbook) & 스테이킹 시뮬레이터 SPA 대시보드
arch.config
const architecture = { stack: ['React', 'TypeScript', 'Vite', 'MUI (Material UI)', 'Zustand', 'Web Worker', 'Vitest'], highlight: 'Web Worker로 메인 스레드 Long Task 0회 달성 (렌더 사이클 2~4ms)', devPeriod: '2026-03-25 ~ 2026-03-26' (2 days), features: [ 'Web Worker 기반 WebSocket 데이터 파이프라인 (Binance Stream)', 'React.memo / useMemo / rAF 쓰로틀링 렌더링 최적화', '낙관적 업데이트(Optimistic Update) 기반 모의 스테이킹 트랜잭션', 'Canvas 실시간 차트 (줌인/줌아웃, 터치 핀치, 과거 데이터 스크롤)', 'Vitest 단위 테스트 (Worker 파싱 + 스테이킹 PnL 4케이스)' ] };
// 아키텍처 코멘트: UI Layer, Logic & State Layer, Data & Pipeline Layer의 3계층 분리 구조. Binance WSS API에서 100ms마다 전달되는 호가 배열을 메인 스레드 Blocking 없이 처리하기 위해 순수 파싱/정렬 연산을 Web Worker로 위임. 낙관적 업데이트 기반 Zustand Store 설계로 1.5초 딜레이 상황에서도 0ms 즉각 UI 반응 확보.
steer-agent.exe
Steer-Agent
AI Agent를 중단(Stop)하지 않고 실시간으로 의도를 조율(Steer)할 수 있는 오픈소스 미들웨어 라이브러리
arch.config
const architecture = { stack: ['TypeScript', 'Node.js'], highlight: '실시간 의도 주입 미들웨어 설계 및 28개의 테스트 코드를 통한 견고한 오픈소스 패키지 배포', devPeriod: '2026-03-01' (1 days), features: [ 'Zero Dependencies (의존성 없는 순수 TS)', 'Reactive Steering (수행 중 실시간 조언 주입)', 'Event System 및 Token 최적화' ] };
// 아키텍처 코멘트: 실행 중단 없이 Agent Loop에 실시간 의도를 주입하는 미들웨어 설계. 즉각적인 Reactive 큐와 단계별 Preemptive 핀 기능을 지원하며, Intent 기반 리매핑으로 에이전트의 계획이 중간에 변경되어도 조언이 소실되지 않는 무결성 확보.
OPEN SOURCE
SDM_TERMINAL
CONNECTED: TRUE
> 시스템 프로토콜 초기화 중...
> 오픈소스 기여 내역 불러오는 중...
>[Roo-Code] PR - feat: add mid-task guidance support
대기열 메시지를 다음 API 호출 전에 주입하여 작업 중지 없이 의도 전달. 메인테이너와 DM 후 직접 제출한 PR.
>[OpenCode] Issue - Feature request: Add mid-task steering to loop execution
루프 실행 도중에 LLM 스트림 포인트 직전 큐를 drain하도록 제안, 기존 관련 이슈들의 근본 원인 해결책 제시.
> 모든 시스템 정상. 실행 준비 완료.
root@sdm:~$