실시간으로 움직이는
화면을 만듭니다

• Vue 3.5
• Quasar 2.x
• TypeScript 5.x
• Pinia 3.x
• Vue Router 4
• Vite 7.x
• Tiptap 3.x
• Chart.js 4.x
• PixiJS 8.x
• Socket.io-client 4.x
• VueUse
• PWA (Workbox 7)
• Playwright

• Vue 2 + Vuetify 기반 서비스를 Vue 3 + Quasar + TypeScript 로 전면 마이그레이션 (2025.12 ~ 2026.03 완료)
• 빌드 시스템을 webpack(Vue CLI) → Vite 로 전환, rollup-plugin-visualizer 로 번들 분석 환경 구축
• 상태 관리를 Vuex → Pinia 로 교체, 도메인별 스토어 분리 및 타입 안전성 확보

주요 기능 메모장, 차계부, 가계부, 주차장, 내문서, 게시판, 휴지통, 달력, 지도, 게임, 글꼴 커스터마이징, 모바일 지원, PUSH 알림

• Vue 2.7
• Vuetify 2.x
• Vuex 3
• Vue Router 3
• JavaScript
• Socket.io-client 4.x
• Chart.js 3.x
• PixiJS 8.x
• matter-js 0.20
• CKEditor4
• PWA (Workbox)
• SimpleWebAuthn
• crypto-js
• Playwright

• 메모·게시판·달력·가계부·차계부·코드북 등 10여 개 도메인을 아우르는 개인용 올인원 다이어리 설계 및 개발
• SimpleWebAuthn 으로 WebAuthn(패스키·생체인증) 로그인 흐름 구현
• PixiJS + matter-js 물리 엔진 기반 미니게임 9종 구현 (pinball, candy crush, tetris, snake, brick breaker 등)

주요 기능 메모장, 차계부, 가계부, 주차장, 내문서, 게시판, 휴지통, 달력, 지도, 게임, 글꼴 커스터마이징, 모바일 지원, PUSH 알림

• Express.js 5
• TypeScript 5.x
• Prisma 7.x (MariaDB)
• Redis (ioredis)
• MinIO
• JWT
• Socket.io 4.x
• web-push
• nodemailer
• sharp
• winston
• ssh2
• Mocha / Chai / Supertest
• Google GenAI

• Express.js 5 + TypeScript 기반 RESTful API 서버 설계 및 개발 (메모·가계부·달력·차계부·게시판·지도·게임 전 도메인)
• JWT 인증과 SimpleWebAuthn 서버 라이브러리를 활용한 WebAuthn(패스키) 인증 흐름 설계 및 구현
• Prisma ORM 으로 스키마 관리·트랜잭션 처리, MariaDB + Redis 이중 저장소 아키텍처 운영

주요 기능 다이어리 서버, DB 관리, 외부 API 호출

• React 18
• TypeScript
• Vite 7
• Tailwind CSS v4
• vite-react-ssg
• Swiper
• Firebase Hosting

• 제출과 열람이 편하도록 만든 단일 페이지 포트폴리오
• vite-react-ssg 로 정적 생성해 초기 렌더와 공유 카드(OG) 대응
• CSS light-dark() 기반 토큰으로 라이트·다크 두 모드를 한 벌의 값으로 관리

주요 기능 자기소개, 경력·프로젝트, 기술 스택, 라이트/다크 모드, 모바일 지원

• React
• Next.js
• TypeScript
• Recoil
• MUI
• Emotion
• Firebase

• Next.js 기반 React 쇼핑몰. 서버사이드 렌더링 학습을 목표로 개발
• 상태 관리는 Recoil, 레이아웃은 MUI, 스타일은 Emotion 으로 구성

주요 기능 Firebase 로그인/회원가입, 상품 목록·검색·카테고리 (Pagination), 오늘의 Hot 상품, 장바구니·찜 리스트·마이페이지, 결제 페이지(모의)·주문 목록, 관리자 상품/카테고리 관리, 상품 할인·할인 쿠폰