이설란

소개

JavaScript를 베이스로 한 프론트엔드 개발자

브레이브 모바일의 O2O 서비스 숨고의 웹 프론트엔드챕터 팀원
숨고의 신규 피처 개발 및 전반적인 서비스 운영을 담당하는 5개의 스쿼드(CT, Core, X, God, Edge, Growth)중 Growth 스쿼드에 소속되어 기존 유저들의 반복적인 방문 활성화, 리텐션 제고를 일으킬 수 있는 다양한 업무를 진행중

서비스 회사의 개발자는 서비스 컨텍스트에 대한 이해도가 기술 못지않게 중요하다고 생각합니다. 신규 피처 개발 및 서비스 운영 중 발생하는 다양한 이슈를 마주함에 있어서 관련 백그라운드 및 레거시, Why에 대한 이해 등 피처 및 이슈 하나하나를 개별로 보는 것이 아닌 요소들 간의 유기적 연관성을 파악하며 개발하려 노력합니다.

브레이브 모바일에서는 프로덕트 사이드에서는 Vue.js, Vue-server-renderer, Vuex, Typescript, bootstrap vue, 백오피스에서는 React, Redux, React Query, Typescript 등을 활용하여 개발중입니다.

경력

브레이브 모바일(숨고)

웹프론트엔드챕터/팀원

2022.2 - 재직중

고수/유저 사이드 GNB 개선 @Growth

2022.6 - 진행중

고객 사이드에서는 Use case 성격에 따른 계위 정리를 통해 사용자가 숨고에서 제공하는 서비스가 무엇인지 보다 직관적이고 명시적으로 파악할 수 있도록 GNB 개선 진행: A/B 테스트 구현을 통해 가설과 실제 유저 행동이 일치하는지 앰플리튜드 지표를 통해 지속적으로 확인; 트래커 구현 및 개발 완료 후 통합 테스트 / QA 대응
고수 사이드에서는 고수의 활동이 요구되나 활동량이 미미한 서비스 (마켓, 커뮤니티)에 대한 활동량 증진을 위해 GNB 개선 진행: A/B 테스트 구현을 통해 가설과 실제 유저 행동이 일치하는지 앰플리튜드 지표를 통해 지속적으로 확인; 트래커 구현 및 개발 완료 후 통합 테스트 / QA 대응

즉시발급 및 코드형 쿠폰 신규 작업 @Growth

2022.6 - 2022.7

숨고를 이용하는 고객의 적극적인 거래 시도를 이끌기 위해 즉시 발급 및 코드형 쿠폰 신규 작업
백오피스 관리자가 즉시 발급 및 코드형 쿠폰을 백오피스에 신규로 등록하거나 수정 및 삭제 할 수 있도록 구현 프로덕트 숨고 고객이 즉시 발급 및 코드형 쿠폰을 쿠폰함 진입 시 발급 및 조회할 수 있도록 구현 쿠폰 코드형의 경우 점유인증 구현(핸드폰 인증이 독점적으로 된 유저에게만 쿠폰 발급)

구글인앱결제 기능 구현 @CT

2022.4- 2022.5

2022년 4월 1일부로 구글 인앱결제 의무화 적용
이에 따라 숨고 프로덕트에서 고수가 구글 인앱 충전/환불 내역을 조회 할 수 있도록 프론트 개발
백오피스에서 관리자가 구글 인앱 충전/환불 내역을 조회하고 부분 환불 처리할 수 있도록 프론트 개발

숨고 사내 자체 트래커 숨래커 구현

2022.4

앰플리튜드로 전송되는 이벤트 트래커를 세그먼트에서 사내 트래커인 숨래커로 점진적으로 교체하여 비용 절감 및 이벤트 프로퍼티의 유연함 증대, 산재되어 있는 데이터 통합의 효과를 기대
플랫폼 챕터에서 제공해주는 숨래커의 api 스펙에 맞춰 기존 트래커에 숨래커 identify, track 메서드 추가 구현
기존 세그먼트와의 의존성은 없이 개발

사내 블로그 서비스 페이지 제작

2022.2 - 2022.4

숨고 구성원들의 다양한 인사이트를 외부와 공유하여 숨고의 브랜드 이미지를 향상시키고 좋은 인재 채용에 도움을 주며 동시에 사내 인사이트를 내부 DB화 할 수 있는 숨고 사내 블로그 서비스 페이지 제작
Vue, TypeScript, Tailwindcss, Grdisome(Vue, JAM Stack기반의 정적사이트 생성기 프레임워크), GraphQL 기반 구현
블로그의 작성자 및 포스트는 AWS S3 활용. AWS S3 API를 활용하여 작성자 및 포스팅 조회 구현

사내 백오피스에 블로그 관리 CMS 구현

2022.2 - 2022.4

테크팀 뿐만이 아닌 모든 직군의 사내 구성원이 낮은 복잡도와 높은 접근성으로 사내 블로그 게시물을 작성하게 하기 위한 백오피스 블로그 관리 CMS 구현
React, TypeScript, MUI 기반 구현
AWS S3 API를 활용하여 블로그 내 작성자 및 포스트의 CRUD 구현
Github REST API를 활용하여 백오피스 => 블로스 서비스 페이지 레포에서의 배포 트리거 구현

레진엔터테인먼트

프론트개발팀/팀원

2020.7 - 2022.1

(중장기) 레진코믹스 서비스 리액트 포팅

2021.7 - 2022.1

KR, US, JP 삼국 사업부의 독립적인 요구 사항을 반영하기 위한 다중 서비스 아키텍처 설계
기존 서비스의 페이지 또는 기능을 신규 서비스로 이관 및 개발하며 점진적으로 기존 Ruby on Rails, JavaScript 서비스 코드들을 신규 서비스 서버 / React, TypeScript로 전환하는 작업 진행 중

전화번호 수집 및 성인인증 마일스톤

2021.7 - 2021.8

내 정보에 휴대폰 관리 영역 추가: 유저가 직접 휴대폰 번호 추가 및 삭제 가능
한국 IP로 한국 로케일 레진 서비스에 접속한 성인 유저 중 성인인증 기간이 1년이 경과한 유저에 한하여 재 인증 구현: 유저 인증 정보를 관리하는 Rails의 쿠키 로직 수정 및 추가
GA 구현 및 개발 완료 후 통합 테스트 / QA 대응

결제페이지 리뉴얼 마일스톤

2021.6 - 2021.7

신규 유저 및 기존 유저들의 결제를 촉진시키고 정기 결제를 지속적으로 유도하기 위한 결제(코인 충전) 페이지 개선 개발
기존 코인 상품 그룹의 순서가 정적으로 배치되어 있던 구조에서 백오피스 관리 툴을 통해 서버 에서 내려주는 순서대로 상품그룹을 노출시킬 수 있는 로직으로 개선
상품 그룹 및 개별 상품에 타이머 스펙이 추가되어 판매 효과 촉진 지원
GA 구현 및 개발 완료 후 통합 테스트 / QA 대응

정보구조개선 마일스톤

2021.1

컨셉에 따라 작품을 그룹핑하여 제공할 수 있는 신규 추가 메뉴(전시 메뉴) 화면 개발: 레진코믹스 KR 로케일 기준 로맨스, 소년, 드라마, BL, 후방 주의(성인 전시 메뉴)
회원/비회원/관 변경에 따른 성인 전시 메뉴 진입 로직 구현
GA 구현 및 개발 완료 후 통합 테스트 / QA 대응

태그 마일스톤

2020.10

고객이 태그를 통하여 주도적으로 취향에 맞는 작품을 빠르게 찾을 수 있도록 제공
에피소드 목록, 에피소드목록 > 작품 정보에 태그 정보 추가
태그 상세 페이지 신규 개발
GA 구현 및 개발 완료 후 통합 테스트 / QA 대응

디자인피버

비주얼인터랙션 디벨롭먼트/선임

2017.8 - 2020.2

디자인 삼성 운영

2017.8 - 2020.2

디자인 삼성의 약 50개의 컨텐츠 구축
HTML, CSS, JavaScript, SVG, Canvas, Shader 등의 기술을 활용한 다양한 모션 및 인터랙션 구현

슈퍼셀 운영

2020.1 - 2020.2

클래시로얄 및 클래시오브클랜 공식 KR 웹 페이지 운영
슈퍼셀 내부 서비스의 다양한 이벤트 페이지 제작: HTML, CSS, JavaScript를 활용하여 게임 서비스 플랫폼의 성격에 맞는 독특하고 창의적인 모션 및 인터랙션 구현
데이터의 운용이 필요한 이벤트 페이지(모의고사 형식의 유저의 답변 목록을 받아야 하는 페이지, 유저의 게임 데이터를 표현하는 페이지 등)의 경우에는 Vue.js, Vuex로 구현

삼성 디벨로퍼 사이트 구축

2019.10 - 2020.2

삼성 개발자 사이트 리뉴얼 구축 서포트
Adobe XD 및 Bootstrap 사용

Samsung galaxy RSVP 운영

2019.1 - 2020.2

삼성 갤럭시 시리즈 출시 기념 unpack 행사 이벤트 페이지 제작

샌드박스 오피셜 사이트 구축

2019.4 - 2019.5

샌드박스 official site 구축 서포트
Vue.js로 구현

AIA Vitality 운영

2018.9 - 2018.12

AIA Vitality 이벤트 페이지 운영
구글 애널리틱스 기술 활용

디자인피버 공식홈페이지 운영

2017.8 - 2020.2

디자인피버 공식홈페이지의 포트폴리오 컨텐츠 운영

디지털다임

UI개발실/사원

2015.12 - 2017.7

네이처리퍼블릭 국/중문 및 글로벌 사이트 리뉴얼 구축

2016.6 - 2017.1

PC 국/중문 및 글로벌 사이트 메인 및 PC/Mobile 서브페이지 구축

풀무원 자회사 올가 홀푸드 리뉴얼 구축

2015.12 - 2016.7

컨텐츠 위주의 PC/Mobile 서브 페이지 구축

도미노피자 리뉴얼 구축

2016.9 - 2017.2

PC/Mobile 내 정보 페이지 및 서브페이지 구축

디지털다임 자사 서비스 트립앤바이제주 모바일 웹 구축

2017.1 - 2017.7

Mobile 서브페이지 구축

샌드박스 오피셜 사이트 구축

2019.4 - 2019.5

샌드박스 official site 구축 서포트
Vue.js로 구현

AIA Vitality 운영

2018.9 - 2018.12

AIA Vitality 이벤트 페이지 운영
구글 애널리틱스 기술 활용

디자인피버 공식홈페이지 운영

2017.8 - 2020.2

디자인피버 공식홈페이지의 포트폴리오 컨텐츠 운영

기술

HTML/CSS: 시맨틱 마크업을 준수합니다.; SASS(SCSS)와 같은 CSS Preprocessor를 사용할 수 있습니다.; Styled Component, Emotion, Tailwindcss, Mui등을 실무에 적용한 경험이 있습니다.; 크로스 브라우징을 지원하는 앱을 구현할 수 있습니다.; CSS의 transition, keyframe animation등을 활용하여 세련된 모션 및 인터랙티브 웹을 구현하는 데 익숙합니다.

JavaScript: ES2015 이후의 JavaScript 문법에 익숙합니다.; Vanilla JavaScript를 통해 DOM을 다루는데 익숙합니다.; .filter, .map과 같은 함수로 데이터를 다루는데에 익숙합니다.; 비동기 작업을 하는데 익숙합니다. (promise, async await)

TypeScript: TypeScript를 적극적으로 활용하는 팀에서 실무를 하고 있습니다.; TypeScript를 베이스로 한 Vue.js, React 코드를 구현할 수 있습니다.; Generic 문법을 활용할 수 있습니다.

SPA Framework: Vue.js, React를 활용하여 실무를 하고 있습니다.; React의 내장 훅과 커스텀 훅을 작성할 수 있습니다.; Redux, Vuex와 같은 상태 관리 라이브러리/프레임 워크를 사용한 경험이 있습니다.; React Query를 활용하여 서버 상태 작업을 한 경험이 있습니다.

Ruby on Rails: RoR 코드의 흐름을 이해할 수 있습니다.; MVC패턴을 이해하고 모델, 뷰, 컨트롤러의 역할에 맞게 코드를 작성 및 수정할 수 있습니다.; 라우트를 작성할 수 있습니다.

Google Analytics: GA를 강도 높게 활용하는 팀에서 업무한 경험이 있습니다.; GA의 다양한 이벤트 태깅의 역할을 의미에 맞게 정의하고 코드에 적용한 경험이 있습니다.; 애널리틱스 360의 GA Report 지표를 읽고 해석한 경험이 있습니다.

GIT: git flow를 적용하여 업무한 경험이 있습니다.; 충돌을 해결할 수 있습니다.; 코드리뷰 문화가 건강하게 정착된 팀에서 실무를 하고 있습니다.; github, gitlab CI/CD를 통한 배포 경험이 있습니다.; github API, github action을 활용하여 배포를 트리거한 경험이 있습니다.

그 외: A/B 테스트를 적극적으로 활용하는 조직에서 실무를 하고 있으며, A/B 테스트에 따라 앰플리튜드로 전송되는 지표들의 의미를 해석할 수 있습니다.; AWS S3를 활용하여 이미지, 이미지의 캐싱관리, A/B TEST, 블로그 데이터 관리 등을 하고 있습니다.; AWS ECS를 통한 배포 및 롤백의 경험이 있습니다.; RestAPI의 의미를 알고 Express를 활용하여 RESTful API를 작성한 경험이 있습니다.