미리보기

무역사무 솔루션 스타트업.

askyour.trade 서비스 오픈

• Headless UI 라이브러리를 활용한 사내 디자인 시스템 도입

• 메일, 메일 어시스트 모듈, 화물 모니터링, 전자도장 기능 개발

이커머스 기업.

위메프 상품 카탈로그 어드민 유지보수

• Vue 마이그레이션: Vue 2 → Vue 3 버전 업그레이드

• 프로젝트 개발 도구 제작: 페이지 및 메뉴 개발을 위한 CLI 자동 생성 툴 개발

위메프 여행·레저 유지보수

• 공연 티켓 프로젝트 마이그레이션: JSP → Vue 전환 (팀 내 개발 환경 및 스펙 통일화)

위메프 특가 상품 프로세스 개선 스쿼드 참여

• 등록 절차 간소화, 중복 더미 데이터 개선, CS 문의 감소 성과 달성

메일 서비스 개발

아웃룩 UI를 참조하여 메일 서비스를 개발하고, 한영 번역, 초안 생성, 오타 검사 등 부가 기능을 적용했습니다.

• 레이아웃 기반 라우팅을 설계하여 화면 구조 최적화

• Froala Editor를 커스텀하여 메일 에디터로 활용 (서명 및 템플릿 기능 개발)

• 메일 어시스트 컴포넌트를 발신 화면, 수신 화면, 사이드바, 랜딩 페이지에서 재사용 가능하도록 구현

• SSE와 Notification API를 활용하여 서비스 접속 시 실시간 수신 메일 알림 기능 개발

• 메일 발신 시 API 담당자와 협업하여 본문 내 인라인 이미지를 Content-ID로 변환 후 formData로 전송하는 방식 적용

• Web Storage를 활용한 클라이언트 기반 주소록 개발

수입화물진행정보 모니터링 페이지 개발

관세청 유니패스를 참고하여 실시간 모니터링 기능과 간결한 UI를 갖춘 페이지를 서비스 내에 개발

• 첫 출시 후 사용자 피드백을 반영하여 UI/UX 개선 및 v2 배포

• 주기적인 조회 API 호출 로직 구현

• 하이라이트 및 알림 기능 개발: Zustand를 활용한 State Change Notification 방식 적용

• Window와 Popup 간 상태 동기화 로직 구현

전자도장 기능 개발

• 메일 첨부파일 또는 업로드한 PDF에 도장 이미지를 페이지별 삽입하는 기능 구현

• Fabric.js, PDF.js를 활용하여 PDF 페이지를 이미지화하고, Canvas 기반 편집 기능 개발

주요 작업

• Composition API: Optional API → Composition API로 전환

• 전역 상태 관리: Vuex → Pinia로 마이그레이션

• 코드 구조 개선: 기존 Mixin → Hook 기반 리팩토링

성과

• Composition API 도입으로 TypeScript 추론 기능 향상 및 더 유연한 개발 환경 구축

• Vue 3의 Proxy 방식 활용으로 객체 기반 상태 변화 감지 최적화

• Vuex에서 Pinia로 전환하여 보일러플레이트 코드 감소 및 상태 관리 간소화

기술 스택

• Vue 3, Pinia

어드민 특성상 유사한 레이아웃의 화면 개발 이슈가 반복적으로 발생하는 문제를 해결하기 위해, 반복적인 작업을 자동화하는 CLI 도구를 개발 및 적용

주요 작업

• 반복적으로 생성되는 파일과 코드를 분석하여 자동화 가능 범위 정의

• 신규 파일이 필요한 경우, EJS 기반 템플릿 코드 작성 및 동적 생성

• 기존 코드에 새로운 로직을 주입해야 하는 경우, 정규식을 활용하여 CLI 입력값을 기반으로 코드 자동 삽입

• CLI를 통해 화면 정보를 입력하면 Menu, Layout, Router, Store 등 각 경로에 맞는 파일을 자동 생성 및 코드 추가

성과

• 개발 리소스 절감 및 생산성 향상

• 반복 작업 제거로 인해 신규 개발자가 쉽게 적응할 수 있도록 가이드 역할 수행

• 일관된 코드 구조 유지 및 개발 효율성 증가

기술 스택

• Hygen, Vue

특가 상품 등록 프로세스를 간소화하고, 파트너사의 서비스 사용 경험을 개선하기 위한 스쿼드 체제 팀에 합류

주요 작업

• 특가 상품 등록 메뉴 통합으로 프로세스 일원화

• 상품 검수 자동화를 통해 운영 효율성 향상

• 특가 상품 예약 오픈 시스템 도입으로 사전 등록 기능 추가

• 등록된 특가 상품의 재사용 기능 구현

성과

• 특가 상품 더미 데이터 축적 감소

• 상품 리뷰 시스템 통합으로 관리 편의성 향상

• 파트너사의 특가 상품 등록 문의 횟수 감소

기술 스택

• React, Recoil

캘린더 플랫폼 개발 (프로젝트 리더)

• 사용자 일정 관리 및 공유 기능 제공, 보다 빠르고 편리한 일정 조율 서비스 개발

• Front-end 개발 80% 담당 (Vue.js 및 Vuetify 활용)

• Docker 및 Docker Hub를 활용한 배포 환경 구축

• FE 배포: Nginx 기반 운영

JavaScript 알고리즘 스터디 진행

• 기본적인 자료구조 개념 설명 및 구현 방법 학습

• 알고리즘 풀이 방법 및 효율적인 접근 방식 공유

다룬 알고리즘 및 자료구조

• 탐색(Search): 이진 탐색(Binary Search), DFS & 백트래킹(Backtracking)

• 순열 & 조합: 순열(Permutation), 조합(Combination)

• 수학적 개념: 소수 판별(Prime Number)

• 그래프 & 트리: Union-Find, 최소 신장 트리(MST)

  • 프림 알고리즘(Prim)

  • 크루스칼 알고리즘(Kruskal)

• 기타 최적화 기법: 슬라이딩 윈도우(Sliding Window)

• 자료구조: 연결 리스트(Linked List)

SSAFY(Samsung Software Academy For Youth)는 삼성에서 운영하는 소프트웨어 개발자 양성 과정으로, 약 1년간 집중적인 교육과 실무 프로젝트를 수행하는 프로그램입니다.

알고리즘 문제 해결 능력 향상, 풀스택 웹 개발, 팀 프로젝트 경험, 협업 툴 활용 등을 중점적으로 학습했습니다.