• 연락처 : 010-9249-6853

• 이메일 : [email protected]

• 지역 : 서울, 한국

• 포트폴리오 :

  이자영 | 포트폴리오

👩🏻‍💻 간단 소개글

• 2018년부터 스타트업을 포함해 프론트엔드 개발자로 제품을 만들어왔습니다.
• 사용자에게 좋은 경험을 주는 서비스에 ****관심이 많습니다.
• 디자인 시스템에 관심이 있고 성능 개선 및 생산성 기여에 욕심이 있습니다.
• 무엇보다도 동료들과의 명확하고 효율적인 커뮤니케이션과 긍정적인 태도가 완성도 있는 개발을 이끈다고 생각합니다.
• 지식을 공유하며 함께 성장하는 삶을 지향합니다.
• 한 번 자리에 앉으면 잘 일어나지 않을 정도로 집중도가 높은 편입니다.

🛠️ 기술

프론트엔드

• HTML, CSS(SCSS)
• React.js, Next.js
• TypeScript, Javascript

협업 & 툴

• Slack
• Figma
• Git, Github, Bitbucket, Vscode
• Jira, Confluence

💻 경력사항

Frontend Engineer

비주얼 24.10 -

(재직중)

아몬즈 웹 서비스 개발/운영 (2024.10 - )

악세서리 커머스 웹 사이트(유저, 어드민, 셀러)를 개발/운영합니다. https://www.amondz.com https://m.amondz.com

• 자동 회수, 오늘 도착 스크럼 작업 참여
• 전자상거래 퍼널(ga, gtm) 정확도를 높히기 위한 개선 작업
• 고전적인 폴더 구조에서 기능 중심 폴더 구조(FSD: Feature-Sliced Design) 아키텍처로 마이그레이션 작업
• 레거시 코드 모던화 작업(클래스형 컴포넌트 함수형으로 변경, dependabot 활용하여 종속성 패키지 버전업 등)
• Nextjs, React, Typescript, styled-component, redux, zustand, storybook, turborepo, vercel, npm, github-action

아몬즈 디자인 시스템 개발/운영 (2024.10 - )

디자이너 1명과 프론트 개발 1명, 앱 개발 2명 체재로 아몬즈에 적용되는 디자인 시스템을 개발합니다.

• 타이포그래피, 컬러 팔레트 등 디자인의 기초 요소를 재구성하는데 참여
• 유지보수 및 개발 생산성을 위한 headless ui 제안 및 적용
• 기술 스택 : React, Typescript, styled-component, storybook, npm, vercel, github-action

Frontend Engineer

엔웨이코리아(nWayKoreaCo.,Ltd) 22.01 - 24.01 (2년)

wreck league 게임 웹사이트 개발/운영 (2022.01 - 2024.01)

wreck league 게임 소개 및 NFT 리스팅 하는 웹사이트 개발에 기획 초기 단계부터 오픈까지 참여했습니다. wreck league 디자인 시스템을 포함하여 성능 최적화를 중점적으로 맡아 성능 측정 및 개선, 전체적인 모션 구현을 전담하여 진행했습니다. https://wreckleague.xyz/

• 번들 사이즈와 러닝 커브를 고려하여 react-spring, lottie 도입과 인터렉션 구현
• 사내 디자인 시스템(Combine)을 확장하여 wreck league 디자인 시스템(WLDS : wreck league design system) 개발
• UX 기획 단계에서도 동료들과 사용자 중심으로 고민하며 커뮤니케이션에 참여
• 어셋(image, video) 용량 최적화로 프로젝트에 로드되는 리소스의 용량을 90%~70% 감축
• DOM size, 번들 사이즈 측정 및 개선으로 lighthouse 기준 페이지별 LCP 평균 10% 감축
• safari, firefox, chrome, metamask app, window PC 크로스브라우징
• 기술 스택 : React, Typescript, Recoil, emotion, react-query, web3.js, Sentry, github action, yarn workspace

디자인 시스템 Combine 개발/운영 (2022.01 - 2023.12)

디자이너 2명과 프론트 개발 1명 체재로 디자인 시스템을 개발했습니다. 모노레포를 활용하여 글로벌한 디자인 시스템 Combine과 프로덕트 별 디자인 시스템을 구축했습니다.

• 디자이너와 협업하여 사내 공통 디자인 라이브러리 개발(Storybook)
• cypress로 컴포넌트별 유닛 테스트를 작성
• yarn workspace monorepo 로 프로덕트별 디자인시스템 구축
• 컴포넌트 별 커스텀 훅 정의 및 공통 모듈 개발
• npm private 레파지토리, lerna로 package 버전 관리
• 기술 스택 : React, Typescript, emotion, rollup, storybook, cypress, yarn workspace, Lerna, github action

Crypto Currency Wallet 개발/운영 (2022.01 - 2022.09)

커스터디얼 월렛 웹과 회원가입 및 인증을 할 수 있는 사이트를 운영했습니다. 개선해야할 사항으로 리렌링 문제를 제기하여 전체적으로 점검 및 업데이트했습니다.

https://accounts.nwayplay.com, https://auth.nwayplay.com

• metamask 웰렛 연동 및 커스터디얼 월렛 화면 개발
• 디자인 시스템을 기반으로 emotion, styled-components를 사용해 스타일 구성
• 기술 스택 : React, Typescript, Recoil, emotion, styled-component, web3.js

Frontend Engineer

넥스트컬쳐 20.10 - 21.10 (1년)

요양간병서비스 연결 플랫폼 에리치 개발 (2021.05 - 2021.10)

요양/간병 기관과 환자에게 적절한 서비스의 제안 및 연결할 수 있는 서비스를 제공하는 반응형 플랫폼을 구축했습니다.

• page, component, util 등 프로젝트 폴더 구조 설계 참여
• styled-components 기반 재사용 가능한 컴포넌트 설계 및 개발
• 카카오, 네이버 로그인 적용을 위한 검수 통과 및 기능 개발
• next/bundle-analyzer 테스트와 dynamic import를 활용한 First Load JS 사이즈 감축
• 크롬, 사파리, 삼성 브라우저 크로스브라우징
• 카카오, 구글, 네이버, 로거 광고 스크립트 삽입 작업
• 기술 스택 : Next.js, Typescript, Redux-toolkit, styled-component

세상파일피드백 리포트 시스템 개발 (2021.03 - 2021.06)

사회문제 해결을 위한 플랫폼(세상파일)에서의 기부금, 운영과정 등을 투명하게 보고하기 위한 리포트 시스템을 구축하였습니다.

https://feedback.sesang-file.com

• 파일 첨부/다운로드, 댓글, 팝업, 테이블 등 컴포넌트 설계 및 개발
• SunEditor 기반의 게시판, export pdf 기능 구현
• 웹표준 / 접근성 권장 수준 적용
• ie11 크로스브라우징
• echart 활용하여 리포트 결과 그래프 구현
• 기술 스택 : React, Javascript, Redux-toolkit, SCSS, echarts.js

태양열 모니터링 관리자 사이트 개발 (2020.11 - 2021.02)

발전소 별 태양열을 모니터링 할 수 있는 어드민 시스템을 fuse react templete을 활용해 구축했습니다.

• Redux로 유저 권한 별 라우팅
• table, pagination, form 등의 컴포넌트 개발
• kakao map api 지도 구현
• csv export 기능 구현
• 기술 스택 : React, Javascript, Redux-toolkit, material-ui

Frontend Engineer

모비데이즈(Mobidays) 18.04 - 20.10 (2년 7개월)

Global AD Network Platform 개발/운영 (2018.05 - 2020.10)

국내외 130개 이상의 AD Network와 연동하고 트래픽을 처리하고 매체사와 광고주의 성과 및 효율를 극대화하는 플랫폼을 개발/운영하였습니다. 대시보드 내 신규기능 구현 및 사용성 개선 작업 및 유지보수를 했습니다.

• 테이블 조회 속도 및 사용성 개선을 위한 DataTables.js 도입
• ajax로 parameter 들을 Controller단에 전송해 동적 테이블 생성
• 대시보드 리포트 데이터 생성을 위한 쿼리문 튜닝
• 기술 스택 : HTML, CSS, Javascript, jQuery, JSP

디지털 마케팅 컨퍼런스 사이트 개발/운영 (2019.01 - 2020.09)

모바일 애드테크 컨퍼런스 맥스서밋 (2019, 2020), 맥스더크리에이티브 (2019 1st, 2019 2nd) 사이트 개발과 SEO 최적화 작업을 했습니다. 2019 맥스더크리에이티브 개발에 React를 도입하였습니다.

https://maxsummit.co/ , https://maxthecreative.co/

• maxsummit(맥스서밋) : HTML, CSS, Javascript, jQuery를 이용해 화면 개발
• maxthecreative(맥스더크리에이티브) : React,SCSS를 이용해 화면 및 모션 개발
• CI/CD 구축(git + Netlify docker)을 통한 코드 통합 과정 개선 및 배포 자동화
• SEO를 위한 meta tag 구현
• 유저 행동 트래킹을 위한 GA스크립트, 페이스북 픽셀 삽입
• 기술 스택 : React, HTML, CSS(SCSS), Javascript, React, jQuery

사내 채용관리 CMS 플랫폼 개발/운영 (2019.01 - 2019.02)

사내 홈페이지에서 하드 코딩으로 게시하던 채용공고의 불편함을 줄이고자 백오피스를 제안하여 개발하게 되었습니다. 인사팀에서 쉽게 채용 게시/수정을 할 수 있도록 단독 진행하여 개발했습니다.

• 로그인, 로그아웃 구현 및 validator 적용
• summernote.js 활용하여 에디터 개발 및 ajax로 동적 테이블 구현
• 기술 스택 : HTML, CSS, Javascript, jQuery, PHP