이력서 📄
소개
웹 프론트엔드 개발자 민병현입니다. 오랜 기간 Pure JavaScript, jQuery를 거친 이후 현재 React + TypeScript 스택을 주력으로 개발하고 있습니다. 저만의 색채를 습득하기 위해 급진적으로 변화하는 FE 기술을 쫓아 움직이고 있습니다.
UI/UX에 대한 관심이 많아 내가 편한 코드보다, 모든 사용자가 어떤 환경에서라도 편하게 사용할 수 있는 웹 서비스를 만드는 것을 최우선 과제로 생각합니다. 또한, C++를 이용한 게임 개발 및 네이티브 개발을 진행한 경험의 영향으로 퍼포먼스 이슈에 대해 민감하게 생각하며 개발하고 있습니다.
워커홀릭인 탓에, 개발을 처음 접했던 10년 전 그때 그 순간부터 많은 시간을 개발하는 데에 쏟았습니다. 제가 몸 담은 곳이 저의 노력으로 성장할 때, 타인이 제가 만든 작업물로 큰 도움을 받았을 때, 그 무엇보다 큰 성취감을 느끼는 개발자 입니다.
해당 페이지의 내용은 아래 QR 코드를 스캔하시면 모바일 및 데스크톱에서도 열람 가능합니다.
기술
Web Development
· JavaScript
· TypeScript
· Flow
· CSS3
· SASS (SCSS)
· PHP
· GraphQL
· Gatsby
· NodeJS
· React
· Redux
· Recoil
· NestJS
· NextJS
· MUI
· CSS-in-JS
Native / Graphics Development
· C/C++
· C#
· DirectX
· OpenGL
· WebGL
· Unity
· Rust
· Go
DevOps & Infrastructure
· Jenkins
· GitHub Actions
· Docker
· Docker Swarm
· AWS
· Pulumi
· MySQL
· Git
경력
2024. 05. ~ 현재
주식회사 채널코퍼레이션Frontend Developer Lv.4
- B2B SaaS CX 메신저 '채널톡' 웹 서비스 개발
- 입사 6개월 후, 잠재력을 인정 받아 준 리드급 포지션인 IC Lv. 4로 새로운 직책을 맡게 되었습니다. 이후, '채널톡' 웹 서비스의 다양한 제품 개발을 전반적으로 담당하게 되었습니다.
- 2024년 공개된 '워크플로우'의 프론트 제품 개발을 혼자서 끝까지 담당 하였으며, 이를 통해 Mobile 및 Backend 팀과의 협업 및 팀원들과의 커뮤니케이션 능력을 크게 향상 시킬 수 있었습니다.
- 실질적으로 고객사가 이용하는 '데스크' 제품의 데스크톱 Electron 앱 개발에 기여하였으며, Win32 API를 활용한 Windows-specific 알림 센터 기능을 성공적으로 구현, 배포 하였습니다.
- '프론트' 제품의 특성을 고려하여, E2E 테스트를 도입하여 개발 생산성을 높이고, 최대한 많은 기기 및 OS, 브라우저에서 동작하는 테스트 환경을 구축 하였습니다.
- DevOps 팀과 협업하여, 각 PR에 대해 Vercel-like CI/CD 환경을 구축하여, 개발 외 팀원이 쉽게 feature-scope 배포 결과물을 열람할 수 있도록 하여 생산성을 증진 하였습니다.
2023. 10. ~ 2024. 05.
주식회사 채널코퍼레이션Frontend Developer Lv.3
- B2B SaaS CX 메신저 '채널톡' 웹 서비스 개발
- 엔드 유저가 고객사에 문의를 위해 접근할 수 있는 '채널톡'의 '프론트' 제품을 개발 하였습니다. 수 많은 브라우저 및 디바이스에서 동작하는 환경을 고려하여 크로스 브라우징 구현을 매우 깊게 진행 하였습니다.
- 단독 웹 앱이 아닌 고객사 홈페이지에 직접 설치되는 플러그인 형식인 제품의 특성 상, 설치 되어 있음에도 최대한 격리된 환경에서 작동하도록 strict-sandboxed 환경에서의 인사이트를 쌓을 수 있었습니다.
- 2024년 공개된 '앱 커맨드' 기능의 프론트 제품 개발을 전부 담당하였으며, WYSIWYG 사용이 현실적으로 어려움을 들어 기본 DOM 트리 및 이벤트를 이용하여 최대한 위지윅과 같은 경험을 구현 하였습니다.
- 유저가 모바일 및 데스크톱 환경에서 이미지를 더 유려한 경험으로 열람할 수 있도록, pinch-zoom, swipe 등의 인터렉션을 최대한 활용한 이미지 갤러리를 구현 하였습니다.
- '프론트' 제품의 경우, 실제로 유저가 인터렉션 하지 않음에도 많은 리소스 번들을 다운로드 하는 단점을 보완하기 위해, lazy-loading 및 code-splitting을 적극적으로 도입하여 bundle size optimization을 진행 하였습니다.
2021. 01. ~ 2022. 11.
동아회원권거래소Web Fullstack Developer
- 자사 대표 웹페이지 개선 및 내부 솔루션 유지보수
- 기존에 사용하던 레거시 PHP 5.*, jQuery 기반의 코드를 React + TypeScript로 리팩토링 하였으며, 이를 통해 코드의 가독성 및 유지보수성을 크게 향상 시킬 수 있었습니다.
- 최적화 되지 않은 장문의 SQL 쿼리에 대해 최적화를 수행하여 기존 5초 대의 SQL 처리 속도를 0.1초대로 단축 시킬 수 있었습니다.
- SEO가 적용되지 않은 웹 페이지 전반에 대해 마케팅 효과를 위한 SEO 최적화를 진행하였으며, 포털 검색 엔진 상위 노출을 통해 유입량을 크게 증가 시킬 수 있었습니다.
- 업무 환경의 특성으로 인해, 모든 사내 개발 업무를 혼자서 진행 하였으며, 이를 통해 개발자로서의 기술적 능력을 크게 향상 시킬 수 있었습니다.
프로젝트
개요
다양한 소스에서 음원을 재생할 수 있도록 하는 크로스 플랫폼 음악 플레이어 데스크톱 앱 프로젝트입니다.
설명
- Electron을 이용하여 크로스 플랫폼 데스크톱 앱을 개발하였으며, 이를 통해 Windows, macOS, Linux 환경에서 동일한 경험을 제공할 수 있었습니다.
- 유저가 다양한 소스에서 음원을 재생할 수 있도록, YouTube, SoundCloud, Spotify 등의 API를 활용하여 음원을 스트리밍 할 수 있도록 하였습니다.
- NodeJS를 기반으로 대부분의 데이터 처리를 진행하였고, 퍼포먼스적인 이점을 취하기 위해 Rust를 활용한 라이브러리를 개발하여 사용하였습니다.
- Electron의 고질적인 문제인 IPC를 강력한 타입으로 보완하기 위해 GraphQL을 활용하였으며, Main 프로세스를 NestJS로 작성하였습니다.
- 추가적으로, 음원 및 앨범 데이터를 취득할 수 있는 별도의 서버를 NestJS로 개발하여 배포하였습니다.
사용 기술
Electron
NodeJS
Rust
React
TypeScript
GraphQL
NestJS
개요
개인용 인터넷 커뮤니티 아카이빙 모바일 어플리케이션으로, 설정한 필터 및 기간 마다 커뮤니티의 글을 크롤링 하여 백업하는 프로젝트입니다.
설명
- Flutter를 사용하여 개발하였고, 이를 통해 개발 생산성의 이점을 확보할 수 있었습니다.
- Android OS의 Task Scheduling API를 활용하여 유저가 앱을 닫은 상태에서도 주기적으로 크롤링을 수행할 수 있도록 구현 하였습니다.
- 유저가 설정한 필터 및 기간에 따라, 커뮤니티의 글을 크롤링 하여 백업하는 기능을 구현 하였으며, 이를 통해 유저가 원하는 글만을 백업할 수 있도록 하였습니다.
사용 기술
Flutter
Dart
Android
개요
Hot Module Replacement와 유사한 기능을 이용하여 다수의 알고리즘 챌린지 서비스 의 문제들을 풀기 위해 도움을 받을 수 있는 NodeJS 기반 CLI 툴입니다.
설명
- chokidar를 이용한 파일 변경 모니터링을 이용하여, 파일 변경 시 자동으로 테스트 케이스의 입력 값을 주입하여 실행하고 결과를 출력하도록 하였습니다.
- vm2를 통한 sandbox 환경을 이용하여 child process를 이용하지 않는 방식으로 사용자의 코드를 실행하도록 하였습니다.
- CLI 옵션을 통해 유저가 사용할 개발 언어를 선택할 수 있도록 하였으며, ts의 경우 esbuild 이용한 빠른 트랜스파일을 통해 개발자의 편의성을 높였다.
- GitHub Actions을 통해 NPM 배포를 자동화하여 개발 경험을 높이고, 유저가 최신 버전을 쉽게 사용할 수 있도록 하였습니다.
사용 기술
NodeJS
TypeScript
GitHub Actions
개요
다양한 SNS 및 온라인 서비스에서 팔로우 및 언팔로우 변동 사항을 원하는 채널로 수신할수 있도록 하는 NodeJS 기반 CLI 프로젝트입니다.
설명
- OOP를 통한 여러가지 SNS 및 온라인 서비스의 API를 추상화하여 설계하였고, 이를 통해 쉽게 개발할 수 있도록 하였습니다.
- 유저가 원하는 채널로 수신할 수 있도록, JSON 설정 파일을 이용한 설정 방법을 제공하여 유저가 쉽게 사용할 수 있도록 하였습니다.
- Docker Image로 빌드된 아티팩트를 제공하여 유저가 쉽게 deploy 하여 사용할 수 있도록 하였습니다.
- GitHub Actions를 통해 배포를 자동화 하였으며, 추가적으로 Docker Image 빌드 및 배포를 자동화 하여 개발 경험을 증진 하였습니다.
사용 기술
NodeJS
TypeScript
Docker
GitHub Actions