"복잡한 문제를 구조화하고, 성능을 극대화하는 것이 제 강점입니다"

성능 최적화 | 레거시 전환 | 고난도 UI/UX 구현

Skills & Expertise

Languages

TypeScript
JavaScript
Java
Python

Scroll to see details

Languages

  • JavaScript, TypeScript React 및 Next.js 프로젝트에서 주력으로 사용
  • Java, SQL 백엔드 API 개발 및 데이터베이스 연동 경험
  • HTML, CSS 반응형 UI 구현 및 스타일링 경험

Frameworks & Libs

React
Next.js
Vue.js
Spring

Scroll to see details

Frameworks & Libs

  • React, Next.js, React Native 경력의 웹/모바일 서비스 개발에서 다수의 프로젝트 경험
  • Vue.js 학부생 시절 대부분의 웹 프로젝트에 활용
  • Spring REST API 개발 및 서버 구축 경험
  • Material-UI, Vuetify, Bootstrap UI 컴포넌트 라이브러리 활용

State Management

MobX
Redux

Scroll to see details

State Management

  • MobX 대규모 상태 관리 최적화 및 성능 개선 경험
  • Vuex Vue 프로젝트에서 상태 관리 적용
  • Recoil/Zustand 최신 React 상태 관리 라이브러리 활용

API & Communication

Axios
GraphQL

Scroll to see details

API & Communication

  • Axios RESTful API 통신 구현 및 비동기 데이터 핸들링
  • Apollo GraphQL 기반 API 연동 경험

Performance

WebWorker
Optimization

Scroll to see details

Performance

  • WebWorker 무거운 연산을 백그라운드에서 처리하여 UI 성능 개선
  • IntersectionObserver, Lazy Loading 이미지 및 콘텐츠 로딩 최적화
  • 이미지 압축 로직 웹페이지 로딩 속도 향상을 위해 적용

Testing & CI/CD

Jest
Actions
Travis

Scroll to see details

Testing & CI/CD

  • Jest 유닛 및 컴포넌트 테스트 적용
  • GitHub Actions CI/CD 자동화 구성 및 배포 파이프라인 구축
  • Travis CI 간단한 프로젝트에서 사용 경험

Tools & Collaboration

Git
JIRA
Figma

Scroll to see details

Tools & Collaboration

  • Git, JIRA, Notion 프로젝트 협업 및 문서화, 애자일 프로세스 경험
  • Figma, Slack UI/UX 설계 및 실시간 커뮤니케이션

Cloud & Deploy

AWS
Vercel
Netlify

Scroll to see details

Cloud & Deploy

  • AWS (S3, Lambda, DynamoDB) 서버리스 애플리케이션 구축 및 운영 경험
  • Netlify, Vercel 빠른 프로토타이핑 및 배포 환경 구성

Experience & Education

2014.03

아주대학교 입학

사이버보안학과 14학번

2015.06 ~ 2017.06

군 입대

공군병장 만기전역

2019.07 ~ 2019.08

청년 IT 인재육성(웹개발자) 수료

SK C&C, 경기도·경기경제과학진흥원 주최

2020.01 ~ 2020.06

㈜팩타고라 인턴

모바일 개발팀 - React Native 앱 개발

2020.08

아주대학교 졸업

사이버보안학과

2020.09

우아한 테크러닝 3기

React&TypeScript by 우아한형제들

2021.08 ~ 2023.11

티맥스오피스 연구원

SuperOffice 웹 문서 편집기 개발

2023.11 ~ 2025.02

티맥스가이아 연구원

노코드 App 제작 플랫폼 GAIA 개발

2025.03 ~ 현재

관악연구소 프론트엔드 개발자

LG CNS 생성형 AI 이미지 플랫폼 개발

Featured Projects

실제 서비스 환경에서의 성능 최적화와 복잡한 기능 구현에 집중한 주요 프로젝트들입니다.

Smart Vet Clinic
Featured

Smart Vet Clinic

동물병원 예약 및 진료 관리 시스템

동물병원의 업무 흐름과 데이터 구조를 직접 분석해 기획부터 개발까지 단독으로 진행한 데이터 대시보드 프로젝트입니다. 추상적인 요구사항을 실제 업무 관찰을 통해 구체화했고, EMR 데이터 구조를 파악해 시계열·환자 이력 중심의 화면을 설계했습니다.

Key Contributions

  • 프론트엔드 환경 구축, 데이터 파이프라인 연동, 배포까지 전 과정 단독 수행
  • 시계열 차트, 대량 데이터 뷰어 등 데이터 시각화 및 정제 기능 구현
  • AI를 활용한 대화형 테이블·차트 생성기 구축으로 데이터 활용성 향상
ReactTypeScriptTailwind CSSRecharts
LG CNS 생성형 AI 이미지 플랫폼
Featured

LG CNS 생성형 AI 이미지 플랫폼

기업용 생성형 AI 이미지 생성 및 편집 플랫폼 (COP) 개발

LG CNS 관악연구소에서 생성형 AI 기반의 이미지 플랫폼 프론트엔드 개발을 담당하고 있습니다. 마스킹, 자르기 등 고급 이미지 편집 기능을 웹에서 구현하고, 대용량 이미지 처리 성능을 최적화하는 데 주력하고 있습니다.

Key Contributions

  • Canvas API를 활용한 마스킹, 자르기 등 고급 이미지 편집 기능 구현 및 편집 로직 설계
  • WebWorker 기반 이미지 처리로 메인 스레드 부하 분산 및 렌더링 지연(Blocking) 현상 완화
  • 웹소켓 재연결 상태머신(State Machine) 설계로 연결 안정성 강화 및 예외 상황 처리 고도화
  • 산돌과의 협업을 통한 커스텀 폰트 기반 텍스트 편집기 개발
  • 공통 UI 컴포넌트 시스템 구축으로 디자인 일관성 확보 및 유지보수 비용 절감
ReactTypeScriptCanvas APIWebWorkerWebSocket
노코드 App 제작 플랫폼 GAIA
Featured

노코드 App 제작 플랫폼 GAIA

드래그 앤 드롭으로 앱을 제작하는 노코드 플랫폼 개발

티맥스가이아에서 사용자가 코딩 없이 앱을 만들 수 있는 노코드 플랫폼의 프론트엔드 코어를 개발했습니다. 런타임에서 컴포넌트를 동적으로 생성하고 배치하는 엔진을 구현하여 높은 자유도의 앱 제작 환경을 제공했습니다.

Key Contributions

  • 사용자 입력을 파싱해 런타임에서 컴포넌트를 자동 구성하는 동적 컴포넌트 할당 로직 개발
  • 렌더링된 개체 기반 코드 생성기를 설계하고 Injection 방식으로 재사용 구조 구축
  • 테이블·차트 편집기 설계 및 데이터 바인딩 구조 구현
  • 셀 구조 변경, UI 편의 기능 등 사용자 중심의 편집 기능 개선 및 UX 고도화
ReactTypeScriptStyled-components
Project Image Placeholder
Featured

SuperOffice 웹 문서 편집기

클라우드 기반의 실시간 협업 웹 오피스 개발

티맥스오피스에서 웹 기반의 워드프로세서 개발에 참여했습니다. 데스크탑 오피스 수준의 기능을 웹에서 구현하기 위해 DOM 조작과 렌더링 성능을 극한으로 최적화했으며, 복잡한 문서 포맷 변환 로직을 직접 구현했습니다.

Key Contributions

  • 이미지 압축·해시 기반 중복 탐지 알고리즘 구현으로 문서 로딩 속도 40% 개선 (특허 출원)
  • SVG·VML 기반 커브 좌표 계산 로직을 HWPX 스펙에 맞게 구현하여 렌더링 정확도 향상
  • EMF/WMF 등 외부 포맷을 내부 구조로 변환하는 미디어 컨버터 개발
  • WebWorker 기반 병렬 처리로 대용량 이미지 로딩·편집 성능 개선
  • Duotone, 선명도, 커스텀 필터 등 CSS 필터 기반의 고급 이미지 편집 기능 구현
ReactTypeScriptMobXSassWebpackWebWorker

Other Projects

개인 학습 및 토이 프로젝트 목록입니다.

꽃길

꽃길

온라인 부조금 송금 및 관리 웹 어플리케이션 (NH 농협 핀테크 공모전)

모바일 환경에 최적화된 웹 어플리케이션으로, Vue.js를 활용하여 부조금 송금 및 관리 서비스를 구현했습니다.

Vue.jsNode.jsMySQLAWS+1
  • Vuex와 JWT 토큰을 활용한 안전한 로그인 상태 관리 구현
  • Webpack, Babel을 활용한 ES6 도입 및 SCSS 번들링 환경 구축
Let Eat, Go

Let Eat, Go

음식점 구독 서비스 플랫폼

자영업자와 소비자를 연결하는 음식점 구독 플랫폼으로, 프론트엔드와 백엔드 전반을 담당하여 개발했습니다.

Vue.jsNode.jsMySQLAWS+1
  • AWS RDS, EC2, S3를 활용한 클라우드 인프라 구축 및 배포
  • TravisCI를 도입하여 빌드 및 테스트 자동화 파이프라인(CI/CD) 구축
Circus

Circus

온라인 스터디 모집 및 관리 플랫폼

교내외 스터디를 개설하고 참여할 수 있는 웹 플랫폼으로, RESTful API 설계 및 클라이언트 인증 로직을 구현했습니다.

Vue.jsNode.jsMongoDBBootstrap
  • RESTful API 설계 및 구현으로 프론트엔드-백엔드 데이터 통신 최적화
  • Session/Cookie 기반의 클라이언트 인증 및 보안 강화
한터리즘

한터리즘

아주대학교 학술소학회 한터 소개 페이지

학술 소학회 홍보 및 부원 신청을 위한 반응형 웹페이지를 개발했습니다.

DjangoMySQLAWSBootstrap
  • Bootstrap 기반의 반응형 웹 디자인 및 퍼블리싱
  • 사용자 인터랙션을 고려한 UI/UX 개선