이민회

Front-end Engineer

About Me

“I can do anything, but I cannot do everything”

모든걸 다 할 수는 없지만 무엇이든 할 수 있습니다.

배움의 욕심, 배움에 대한 실현, 지식의 나눔과 협업을 목표로 하는 개발자 입니다.


Front-End 개발을 좋아합니다.

  • 사용자 경험 증대에 보다 앞장 설 수 있는 점에 매력을 느껴 Front-End 개발자를 시작하게 되었습니다.
  • 사용자 입장을 고려하고 디자이너와 소통하며 보다 좋은 사용자 경험을 끌어내려고 노력합니다.
  • 항상 새로운 것을 공부하며 좋은 서비스를 개발하기 위해 노력합니다.

레거시 시스템이 두렵지 않습니다.

  • APM(Apache, PHP, MySQL) 기반의 레거시 웹 서비스 운영 경험
  • 네트워크 접근 제어 솔루션 관리자 콘솔 마이그레이션 경험 (JQuery → ExtJS)
  • 광고 플랫폼 사이트 고도화 및 마이그레이션 (JQuery → React)

협업 능력이 저의 제일 큰 장점 입니다.

  • 좋은 개발 문화를 만드는데 앞장서며 관리 및 협업 도구를 잘 쓰고싶어합니다.
  • JIRA Sprint 리더 경험이 있으며 Wiki 문서 작성하고 좋아요 👍🏻 받는 것을 좋아합니다.
  • Git을 자유자제로 사용할 수 있습니다.

동료들도 저의 고객입니다.

  • 저와 동료들 모두가 개발하는데 집중할 수 있는 환경을 만드는 것은 저의 고민 거리 중 하나 입니다.
  • 효율적으로 일하고 싶습니다.
  • 때문에 DevOps에 관심이 많습니다.

주요 관심 파트 : Front-End , Back-End

Skill

현재 업무에 사용 중이거나 혹은 사용했던 기술 혹은 도구들입니다.

Front-End

  • HTML, CSS, JavaScript, TypeScript
  • React, Redux, Redux-Saga, React-query, Next.JS
  • styled components, emotion, Material-UI
  • Sencha, jQuery, Sass
  • npm, yarn, yarn berry
  • ESLint, Prettier

Back-End

  • NodeJS, Express, NginX, Apache2
  • PHP
  • MySQL, MariaDB, Oracle, MS SQL, Redis
  • Swagger

DevOps

  • AWS, GCP
  • Git, Make, Gradle, GNU Bash Script, Docker
  • Bamboo, Jenkins
  • AWS CDK, Terraform
  • Vagrant, Chef

Etc

  • C, C++, Python
  • Robot Framework, Autoit

Project

아래는 주요 프로젝트 입니다.

마이데이터 Front-End mobile WebView 서비스 개발

11번가
21.08 ~ 22.11

❏ 프로젝트 개요

  • 11번가가 마이데이터 사업자로 참여함에 따라 고객에게 신용 정보를 기반으로 데이터를 제공

❏ 역할

  • 머니한잔(마이데이터) FE 서비스 신규 개발
  • 마이데이터 홈페이지 FE 신규 개발
  • 마이데이터 Back Office 신규 개발
  • Storybook을 통한 디자인 시스템 구축
  • 마이데이터 회원 - 11번가 회원 연동
  • 11번가 App에서 제공하는 Scheme 연동
  • 사용자 정보제공동의 시 공동인증서, 사설인증서 연동
  • 앱 위변조 솔루션 적용
  • FE 모노레포 구성, PnP 적용
  • Client Logging 구성

❏ 사용 기술

  • TypeScript, React, Next.js
  • Storybook, Emotion
  • Recoil, React-Query
  • Jest, Cypress
  • AWS CloudFront, EC2, ELB, Nginx
  • Sentry
  • Yarn berry, Mono Repo

❏ 성과

광고 플랫폼 웹 사이트 개발
(Front-End)

Motov
20.09 ~ 21.07

❏ 프로젝트 개요

  • 광고 플랫폼을 버전 2.0에서 3.0 개발을 진행하면서 플랫폼 자체를 새롭게 개발하여 고도화하는 프로젝트
  • TTD(Taxi Top Driver)라고 불리는 택시 상단에 올라가는 디스플레이에서 송출할 광고를 관리하는 사이트 개발
  • OpenDirect 규격에 따른 사이트 개발

❏ 역할

  • 광고주들이 광고를 관리할 수 있는 ‘광고주 사이트’ Front-End 개발
  • Zeplin을 통한 디자이너와 소통을 통한 UX 디자인 참여
  • ‘광고주 사이트’ Front-End 빌드 및 배포
  • 상태 관리 라이브러리 변경 (Redux -> Recoil)

❏ 사용 기술

  • HTML, CSS, JavaScript, TypeScript
  • React, Recoil, Redux, Redux-Saga
  • Styled Component, Material UI
  • NodeJS, Express
  • ESLint, Prettier

❏ 성과

  • 광고주 광고 사이트 초기 단계부터 설계 및 개발

광고 플랫폼 CI/CD 구축
(DevOps)

Motov
20.09 ~ 21.07

❏ 프로젝트 개요

  • 서비스들의 빌드 및 배포 자동화 구축
  • 데이터베이스 마이그레이션 관리 체계 구축

❏ 역할

  • 서비스 버전 업데이트 체계 구축 및 자동화
  • 사내 Git flow 정의
  • 기존의 CI/CD 서버에서 마이그레이션 (Jenkins ➡ AWS CodePipeline)
  • 서비스 환경 별 빌드 및 배포 프로세스 Pipeline화 (AWS CodePipeline, AWS CodeBuild, AWS CodeDeploy)
  • AWS RDS(Aurora) 마이그레이션 자동화 구축 (flyway)
  • Blue/Green 무중단 배포 (Nginx, Docker)
  • JIRA 이슈 스프린트 리더
  • AWS CDK를 이용한 IoC화 진행

❏ 사용 기술

  • Jira, Confluence, Bitbucket
  • Git, NPM, Yarn, Gradle, Bash, Docker
  • Jenkins, Nginx, Slacek WEB API, Flyway
  • AWS CodePipeline, CodeBuild, CodeDeploy

❏ 성과

  • 광고 플랫폼 서비스의 Pipeline 구축
  • 광고 플랫폼 서비스 별로 Pipeline IoC화 완료 (AWS CDK)
  • 광고 플랫폼 서비스 별로 Pipeline Event 알림 Slack Bot을 IoC화

광고 플랫폼 Cloud Architecture Design (DevOps)

Motov
20.09 ~ 21.07

❏ 프로젝트 개요

  • 광고주 플랫폼의 AWS Cloud Network Architecture 설계 및 구축
  • IoC(Infrastructure as Code)를 통한 클라우드 관리를 위한 개발

❏ 역할

  • AWS Cloud Architecture 설계 및 구축
  • AWS Session manager를 통하여 보안 접근 가능하도록 구축
  • 초기 IoC는 Terraform으로 진행
  • 추후 AWS에 Native한 CDK를 이용한 IoC 진행

❏ 사용 기술

  • AWS CDK, Terraform
  • AWS 네트워크 관련 Resource
  • AWS Session Manager

❏ 성과

  • 광고 플랫폼의 초기 Network Architecture Design
  • 광고 플랫폼 서비스 구조의 보안성을 높이면서 Cloud Computing에 보다 쉽게 접근 할 수 있도록 설계

NAC 관리자 웹 서비스 개발
(Front-End / DevOps)

NetMan
18.01 ~ 19.05

❏ 프로젝트 개요

  • 웹 서비스 기반 OS 형태의 네트워크 관리자 콘솔 개발
  • 기존의 Window 기반의 네트워크 관리자 콘솔은 배포와 수정이 어려움 발생
  • Spring Cloud 도입

❏ 역할

  • web frontend 개발
  • API 설계 참여 (swagger)
  • 개발 환경 구축 가이드 문서 통합 (confluence)
  • Git 레포지토리 관리 (서브모듈 구성 관리)
  • 지속적인 통합 및 배포 가능하도록 구성 및 관리 (bamboo 프로젝트 구성 및 스크립트 개발)
  • MFC/C#으로 개발된 기존의 네트워크 관리 애플리케이션을 웹 서비스 앱으로 마이그레이션(또는 신규 개발)
  • 빌드 및 배포 자동화 구축 (bamboo)

❏ 사용 기술

  • HTML, CSS, Sass, JavaScript, Sencha ExtJS6, jQuery, ESLint, Prettier
  • Git Submodule, Swagger, Confluence, Bamboo, Chef

❏ 성과

  • 웹 서비스 앱 (대시보드, 네트워크 관리, DHCP 관리 앱) 개발
  • CI / CD 도입
  • Front End 코딩 스타일 통합 (ESLint, GitHook)

Manager Server Team CI/CD 프로세스 개선 및 관리
(DevOps)

NetMan
19.01 ~ 20.09

❏ 프로젝트 개요 / 목표

  • 빌드, 패키지, 테스트 및 배포 프로세스 개편 및 관리
  • 서버 장비에 탑재될 소프트웨어 설치 패키지 개선
  • 설치 패키지의 신뢰성 확보 (기존 Bash Script로 제작된 패키지의 예외 처리 부족으로 인한 신뢰성 부족)
  • 형상 관리 도구와 CI/CD 서버 구축을 통한 자동화 프로세스 도입

❏ 역할

  • make와 bash Script를 통하여 서비스 빌드 개선
  • Docker Image 제작을 통하여 빌드 및 개발 환경 통합
  • 형상 관리 도구 사용 (Chef)을 통한 패키지 신뢰도 개선
  • 가상머신을 보다 쉽게 관리 할 수 있는 Vagrant와 스크립트 작성으로 자동화 테스팅 환경 구축
  • 지속적인 통합 및 배포 도구(Bamboo) 도입으로 CI/CD 서버 구축

❏ 사용 기술

  • Git, Swagger, Confluence, Bamboo
  • Docker, make, Chef, Vagrant, Bash

❏ 성과

  • 기존보다 잦은 휴먼 에러를 제거
  • C/C++ 서비스 빌드 자동화 도입
  • 패키지 제작 자동화 도입, 제작 시간 단축, 설치 테스트 자동화
  • 설치 패키지의 신뢰성을 높이고 비지니스 개발에 집중 할 수 있도록 CI/CD 서버 도입
  • Git Flow 도입으로 협업 환경 개선
  • 개발 환경 통합

네트워크 인증 및 자산 신청 서비스
관리자 설정 서비스
개발 및 유지보수
(Full Stack)

NetMan
19.01 ~ 20.09

❏ 프로젝트 개요

  • 웹 서비스 기반의 네트워크 관리자 콘솔(설정/관리 기능) 개발 및 유지보수를 담당

❏ 역할

  • 웹 서비스 개발 및 유지보수 (Apache2, PHP, MySQL, JavaScript, Jquery, JQ Widget)

❏ 사용 기술

  • Apache2, PHP, MySQL
  • HTML, CSS, JavaScript, jQuery, JQ Widget

❏ 성과

  • PHP 7 버전 업그레이드에 따른 소스 마이그레이션
  • 기존의 HTML, PHP, JavaScript가 같이 쓰였던 소스를 MVC 패턴을 기반으로 분리하여 개선
  • PHP 기반의 Restful API로 변환하여 재사용성과 확장성 마련

Experience

Coupang

Rocket Growth
Front-End Engineer

22.11 ~ 현재

11번가

SK Payment 데이터팀
Front-End Engineer

21.08 ~ 22.11

  • SK Payment 마이데이터 Front-End 서비스 개발
  • SK Payment 마이데이터 디자인 시스템 구축
  • 22’ SKT 주니어보드 활동 (22.01 ~ 22.12)
    • SK 계열사(ICT Family) ㅇ가ㅇ 제품 Mobile APP UX 개선

Motov

광고 플랫폼 개발팀
Front-End/DevOps Engineer

20.09 ~ 21.07

  • 광고 플랫폼의 Web 사이트 개발 (Front-End)
  • 광고 플랫폼의 CI/CD 구축 (DevOps)
  • 광고 플랫폼의 Cloud Architecture 설계 및 IoC 개발 (DevOps)
  • AWS Cloud 관리자
  • 사내 세미나 활동 및 외부 활동
    • AWS StartUp Team과 소통하여 지속적인 Cloud 아키텍쳐 개선 (20.09 ~)
    • AWS Network 아키텍처 구성 및 세미나 (21.02.15)
    • 광고 플랫폼 아키텍쳐 구성 및 배포 (21.02.17)
    • AWS IAM 계정 사용 정책 세미나 (21.03.30) (포스팅 바로가기)
    • AWS Session Manager를 이용한 보안 접속 방법 세미나 (21.03.30)
    • 신규 CI/CD 프로세스 세미나 (21.04.12)

NetMan

Manager Server 팀
WEB/DevOps Enginner

18.01 ~ 20.09

  • 네트워크 접근 제어 솔루션(NAC)의 관리 서버팀에서 근무
  • Web기반 OS 형태의 네트워크 매니저 서비스 신규 개발 (Front-End, DevOps)
  • 팀의 전반적인 CI/CD Process 개편 및 자동화 적용
  • PHP 기반의 WEB 서비스 개발 및 유지보수
  • C++ 기반의 Linux App/서비스 개발 및 유지보수
  • Atlassian의 Software 관리자 (JIRA, Confluence, Bambbo)
  • 연구소에 사내 메신저 도입(KakaoTalk → HipChat → Slack → MS Teams)
  • 2018.10 우수 사원 선정 (블로그 포스팅 바로가기)

NetMan

인턴십

17.03 ~ 17.09 (FullTime)
17.09 ~ 17.12 (PartTime)

  • ICT 인턴십 프로그램을 통한 인턴십 활동 (FullTime)
  • ICT 인턴십 종료 후 학교 수업과 회사를 병행 (PartTime)
  • 각종 서비스의 테스팅을 위한 Tool 및 테스팅 자동화 구축
    • Python을 이용한 C 구조체 커스텀 패킷 발생기 제작 (17.03 ~ 17.05)
    • Robot Framework를 이용한 Windows 단말 테스팅 자동화 (17.05 ~ 17.07)
    • Vagrant를 이용한 Windows OS 단말 원격 테스팅 자동화 (17.08 ~ 17.12)

Resource

개인 블로그

https://minemanemo.tistory.com

  • 개인 기술 블로그 입니다.
  • 업무 중 발생한 트러블 슈팅 내용, 새롭게 공부한 내용 등 개발에 관련된 내용을 주제로 포스팅 합니다.
  • 사내 Wiki에 적은 글 중에서 공유하면 좋을 것 같은 내용은 옮기기도 합니다.
  • 최대한 머리가 아닌 글로 기억하려고 노력합니다.
  • 주중 일 평균 150명 방문자 블로그 입니다.