4년차 프론트엔드 개발자 이성준

프로필

  Name: 이성준
  Age: 1994.05.27
  Phone: 010-8262-3777
TypeScript 기반의 Vue와 React를 사용하여 개발 커리어를 쌓아왔습니다.
백오피스 개발부터 신규 서비스 오픈, 사내 디자인 시스템 개발 참여 등 다양한 경험을 하며 제가 FE 개발자로서 부족하다고 느끼는 부분을 채워가며 성장하고 있습니다.
저는 팀 내에서 유익한 개발 지식을 공유하는 데 즐거움과 보람을 느끼고 있습니다.
제 모토는 “내가 선택한 행동에 후회가 없도록 최선을 다하자”입니다.

 커리어

팀리부뜨(teamreboott) | 2023.10.16 ~ 2024.12.31

팀리부뜨는 인공지능(AI) 기반의 무역 및 사무 자동화 솔루션을 개발하는 스타트업입니다. ’askyour.trade’는 AI를 활용해 무역 업무에서 발생하는 비정형화되고 반복적인 작업을 자동화하여 효율성을 극대화하는 솔루션입니다.
제품개발팀 | Front-end developer

전자도장 - 메뉴개발 | askyour.trade

2024.09 - 2024.12
메일, 로컬 PC에서 등록한 PDF 파일을 이미지 편집을 통해 도장을 삽입할 수 있는 기능입니다.
다수의 문서와 페이지에 반복적인 작업을 이전 이력을 저장하여 업무의 편의성과 처리 속도를 향상시키는 것을 목표로 기획·개발되었습니다.
[작업]
PDF 파일의 페이지를 canvas를 통해 도장 이미지 삽입 기능 개발
다량의 페이지 작업시 일괄 도장찍기 기능
[주기술]
fabric.js
pdf.js
zustand

채널톡 도입 | askyour.trade

2024.08 - 2024.08
사용자 피드백을 받을 수 있는 인터페이스를 제공. 채널톡 무료플랜을 서비스에 도입하여 메신저와 연동 작업 수행
[성과]
사용자 문의를 통해 내부 피드백 기능 확대
실시간 문의 답변 및 가이드 제공
사용자 문의 팀에 공유 간편화

수입화물진행정보(유니패스) 관리 - 메뉴개발 | askyour.trade

2024.07 - 2024.08
관세청에서 운영하는 유니패스를 자사 서비스에 더욱 간편하게 이용 가능하도록 실제 무역업 종사자들의 인터뷰를 통해 UI/UX 기획 및 설계, 개발
사용자가 관심 있는 수입화물을 등록하면 주기적으로 최신화 진행 및 변경점 알림과 하이라이트를 노출합니다. 화물에 대한 메모 기능과 간편한 팝업 UI를 제공하여 모니터링을 효율적으로 이용할 수 있도록 하였습니다.
[작업]
PDF 파일의 페이지를 canvas를 통해 도장 이미지 삽입 기능 개발
다량의 페이지 작업시 일괄 도장찍기 기능
[성과]
서비스 이용자 수 증가
[기술]
react-query
Notification API
framer-motion
zustand

메일 주소록 | askyour.trade

2024.05 - 2024.05
수신한 메일 정보를 이용하여 메일 발신 시 참고할 수 있도록 주소록을 개발하였습니다.
웹 스토리지를 이용하여 관리하였고, 수신받은 메일의 최신 정보를 각 메일 계정마다 구분하여 관리하였습니다. 관리되는 데이터는 암호문을 통해 일반적인 상황에서 읽을 수 없도록 하였습니다.
[성과]
메일 발신 시 주소록을 통해 이메일 작성의 오타율 방지 및 수신자 식별 가능
[기술]
zustand
crypto-js : AES

메일 서비스 & 메일 어시스트 모듈 개발 | askyour.trade

2024.01 - 2024.04
메일 서비스에서 제공하는 AI번역, AI무역용어 번역, 메일초안생성, 오타검사, 문맥교정, 뉘앙스 등의 기능을 신규 메뉴로 분리하여 메일 계정 미등록 사용자가 사용가능하도록 이용범위 확대 작업
랜딩페이지를 개발하여 서비스 소개, 게스트 이용자들에게 내부 기능을 체험할 수 있는 메뉴를 추가하였습니다.
[작업]
메일 수신, 발신, 회신, 전달 기능, 서명 기능 개발
한/영 무역 용어 번역기, 메일 초안 작성, 오타 검사기, 본문 뉘앙스 수정 컴포넌트를 개발하여 메일 발신 화면, 기능 단독 메뉴, 랜딩 페이지에서 재사용
SSE와 Notification API를 이용하여 유저가 서비스 접속시 메일 수신 알림 기능 개발
[성과]
AI기능 사용량 증가
기능 체험에서 회원가입까지 연결되는 케이스 (회원 수 증가)
askyour.trade 의 첫 기능으로 해당 서비스를 기반으로 베타 유저 유입을 유도
[기술]
froala-editor
SSE
Notification API
react-query
zustand

어드민 프로젝트 신규 개발 | askyour.trade 어드민

2023.12 - 2024.01
askyour.trade 서비스의 어드민은 사내 서비스 운영팀에서 서비스 운영, 문의 등을 관리하기 위해 기획되어 프로젝트 세팅부터 오픈까지 개발에 참여하였습니다.
UI 프레임워크를 적극 활용하여 짧은 기간 안에 적은 리소스로 개발하는 것을 목표로 하였습니다.
[기술]
react
material ui

위메프(We Make Price) | 2020.07.20 ~ 2023.05.19)

위메프는 가격 중심의 이커머스 플랫폼입니다.
백오피스개발팀 | Front-end

위메프 특가 상품 프로세스 개선 및 파트너 UX | 파트너 어드민

2023.01 - 2023.03
위메프 특가 상품 등록 프로세스를 간편화하고 파트너사의 서비스 사용 경험을 개선하기 위해서 만들어진 스쿼드 체재 팀에 합류
기존 특가 상품 등록 조건은 까다롭고, 복잡한 절차와 불친절한 가이드로 인하여 이용 만족도가 낮은 상태였습니다. 이를 개선하기 위해 등록에 필요한 메뉴를 통합하고, 상품 검수 자동화 및 이미 등록된 특가 상품을 예약 오픈 시스템을 통해 재사용할 수 있도록 개선하였습니다.
[작업]
특가 상품 등록 메뉴 통합
상품 검수 자동화
등록된 특가 상품 예약 오픈 시스템 도입
[성과]
특가 상품의 더미 데이터가 줄어들었습니다. 이를통해 상품 리뷰 통합까지 개선되었습니다.
파트너사의 특가 상품 등록 문의 횟수가 줄어듬
등록된 특가 상품 재사용 가능
[기술]
react
recoil

신규 페이지 템플릿 생성 CLI 도구 개발 | 상품카탈로그 어드민

2022.09 - 2022.11
어드민 특성상 비슷한 layout을 가진 화면 개발 이슈가 자주 요청되는 것을 확인하였습니다. 반복적인 작업에대한 CLI 도구를 개발하기로 하였습니다.
같은 패턴으로 생성되는 보일러플레이트 코드와 반복적으로 추가되는 코드를 확인한 후, CLI를 통해 화면에 대한 정보를 입력받으면 Menu, Layout, Router, Store 등 각 경로에 맞는 파일을 생성하고 코드를 추가해주는 도구를 개발하여 프로젝트에 적용하였습니다
[작업]
반복적으로 생성되는 파일과 코드를 파악
신규 파일이 필요한 경우 ejs 를 사용한 template 코드를 작성하여 개발
기존 코드에 새로운 코드를 주입해야 하는 경우 정규식을 이용하여 cli를 통해 전달받은 인자를 통해 동적으로 코드 생성 및 주입
[성과]
개발 참여시 프로젝트 러닝커브를 줄어들었습니다.
개발 가이드 역할 수행
리소스 감소 및 개발 속도 상승
[기술]
Hygen

신입 FE 오리엔테이션 발표 & 팀내 알고리즘 스터디

신입 오리엔테이션의 FE팀을 소개하고 업무가 어떻게 진행되는지 알려주는 발표를 진행하였습니다. 팀내에서 JavaScript 언어를 이용하여 자료구조와 알고리즘 문제를 풀어보는 스터디를 주도하였습니다.

ESLint 개선 | 상품카탈로그 어드민

2022.01 - 2022.02
프로젝트내에 lint 설정 오류를 확인하고 개선 작업을 수행하였습니다.
이전 담당자의 개인 패키지를 import하여 린트를 설정하는 방식이었지만, 퇴사 이후 버전업되면서 내부에서 버전업이 강제되는 코드에 의해 설정이 현재 프로젝트와 맞지 않게 되었습니다. 이로 인해 해당 프로젝트를 이용하던 개발자들이 린트 설정을 끄거나 규칙을 무시하며 코드를 관리하게 되었고, 이 문제를 해결하기로 결정하였습니다.
호환되는 버전을 찾아 세팅 부분을 export 하고 내부 협의를 통해 스타일 변경 후 프로젝트에 적용하였습니다.
[성과]
프로젝트 코드 품질 향상 및 스타일 통일
[기술]
ESLint

점진적 마이그레이션 Vue2 -> Vue3 | 상품카탈로그 어드민

2021.09 - 2022.01
Vue3 에서 핵심적으로 사용중인 Composition API를 현재 프로젝트에 도입하여 mixin 과 기능 일부를 hook 기반으로 변경하며 점진적인 버전 업그레이드 작업을 수행
[작업]
Composition API : optional compositional
vuex -> pinia
mixin -> hook
[성과]
Composition API를 도입하면서 TS 추론기능 향상 및 hook 기반으로 더 유연한 개발이 가능
vue3 의 proxy 방식은 객체기반의 상태 변화를 감지하는데 더 효과적으로 작동
전역 상태관리를 vuex에서 pinia로 수정하면서 보일러플레이트 코드 감소
[기술]
Vue
pinia

마이그레이션 JSP -> Vue.js | 공연티켓MO

2020.10 - 2020.12
위메프 공연티켓 프로젝트는 JSP환경으로 구성되어있습니다. 팀내에서 관리되는 프로젝트를 Vue.js로 통일하여 관리하기 위하여 마이그레이션 작업을 진행하였습니다.
[성과] 페이지별로 작업을 분리하여 진행하였고, 홈화면과 설정화면을 맡아서 진행하였습니다.

숙박 상품 날짜별 가격보기 기능 개발 | 여행레저PC

2020.08 - 2020.09
국내 숙박 상품의 상세 페이지에서 “날짜별 가격보기” 버튼의 기능으로, 캘린더에서 체크인 하고자하는 날짜를 선택하면 체크아웃 가능한 날짜와 최저 금액을 노출합니다.
[성과] 신입으로 입사하여 처음맡은 기능단위의 업무로 디자이너와 퍼블리셔, back-end 개발자와 협업하여 진행하였습니다.
[기술]
Vue (v2)
vue-property-decorator (vue-class-component 기반) : Vue의 optional 방식에서 TS추론 기능 한계를 개선하기위해 사용
vuex-class
TypeScript

 보유 기술

Language
JavaScript
TypeScript
HTML
CSS
Java, JSP
Framework
Vue.js
React.js
전역 상태 관리
Vue.js : Vuex, Pinia
React.js: Recoil, Zustand
react-query
CSS Tool
Styled-component, Tailwind, SCSS
Code formmat
ESLint, Prettier
Build Tool
Vite
Router
vue-router, react-router-dom
Design system
Storybook
Editor
Froala-editor
Animation
framer-motion
Chat
chart.js
PDF
pdf.js, pdf-lib
Form
readt-hook-form, zod
Canvas
fabric

교육

SSAFY (2019.07 ~ 2020.06)

전공자의 경우 Java 언어 교육하고 주언어로하여 Algorithm 문제의 대한 해결 능력을 키어주는 교육기관입니다. 1차 교육이 끝나면 2차로 수료중인 학생들과 협업 프로젝트를 진행합니다.
삼성 소프트웨어 아카데미 2기(구미) 수료.

일정 공유 서비스 - Helpromise | 깃헙

2020.05.11 ~ 2020.06.05
개인의 일정을 관리하고 다른 사용자와 일정을 공유할 수 있는 그룹을 생성할 수 있습니다. 또 구글 캘린더의 정보를 그대로 가지고올 수 있도록하여 사용의 편의성과 확장성을 늘렸습니다.
Vue.js로 화면을 만들었고 Vuetify의 기본 템플릿을 적극 이용하였습니다.

동행자 포함 개인 맞춤 음식점 추천 서비스 - 요기딱

2020.03 ~ 2020.05
음식점 빅데이터를 이용하여 사용자 맞춤 음식점을 추천해주는 시버스입니다. 빅데이터에 부족한 정보는 크롤링을 통해 채워넣었습니다. Django를 이용하여 restful api를 만들고 Vue.js로 화면을 제작하였습니다.

재능 역경매 - Somebody

2019.12 ~ 2020.02
필요한 재능,능력의 발품을 팔면 그의 해당되는 유저들이 흥정을 통해 거래를 매치시켜주는 서비스입니다. 필요한 재능을 사려는 유저(구매자)들은 흥정을 하는 유저(판매자)의 스펙을 확인할 수 있는 자료를 볼 수 있고, 마음에 드는 대상과 매칭할 수 있습니다. Spring boot서버와 Vue.js 화면 AWS배포를 사용하였습니다.

안전 식품 먹거리

2019.11 ~ 2019.12
안전 식품을 관리하는 서비스로 식품들의 영양소를 통계 자료를 통해 보여주고, 유저가 섭취할 목록을 선택하면 영양성분과 알레르기 유발 식품들을 확인시켜줍니다. 기존의 SpringMVC와 JSP로 작업 중이던 프로젝트에 Springboot + Vue.js 프로젝트를 합치는 작업을 하였습니다.

금오공과대학교 (2013.03 ~ 2019.08)

컴퓨터 소프트웨어공학과 졸업

스터디

알고리즘 스터디
SSAFY | 2019.07 ~ 2020.06
Java Algorithm
알고리즘 스터디 리드
백준 & 프로그래머스 & SW Expert Academy 문제를 시간내에 풀고, 코드리뷰, 풀이를 공유하였습니다.
Notion 페이지를 통해 서로의 코드를 공유

자격증

정보처리기사
한국산업인력공단
2019.05.22 취득