
미리보기
- 직업
- 프론트엔드 개발자
- 이름
- 허준영
- 이메일
- hjy0951@gmail.com
- 간단소개
- 안녕하세요. 프론트엔드 개발자 허준영입니다. 팀원들과의 원활한 협업을 위해 항상 먼저 소통하려 노력하며, 함께 문제를 해결하고 나아가는 과정을 중요하게 생각합니다. 단순히 의견을 나누는 것을 넘어, 서로의 입장을 이해하고 더 나은 방향을 함께 고민하는 개발자가 되고자 합니다. 협업은 결과 이상의 가치를 만들어낸다고 믿기에, 언제나 열린 자세로 팀에 기여하려 노력하고 있습니다. 내가 만든 서비스가 사용자와 상호작용하며 실제로 동작하는 모습을 보며, 단순한 개발을 넘어 사용자 경험에 가치를 더할 수 있다는 점에 큰 매력과 보람을 느껴 시스템 엔지니어링에서 프론트엔드 개발로 전환하게 되었습니다.
기술 스택
- 기술 스택
- React
- Next.js
- TypeScript
- JavaScript
- HTML/CSS
경력
- 회사명
- 삼성전자
- 직책 • 부서
- CL2 (사원) • System LSI사업부 Platform개발팀
- 근무 기간 (근무 형태)
- 2020.09. - 2022.06.
- (1년 10개월 | 정규직)
- 담당 업무
2020년 상반기 삼성전자 DS 부문 신입 공채 입사
모바일 GPU 커널 드라이버 개발
메모리 파트를 전담하며, 디버깅 편의성을 높이기 위한 기능을 개발하고, 제품에 맞는 효율적인 메모리 할당 방식을 적용하였습니다.
GPU 성능을 측정하는 벤치마크 테스트 과정에서 간헐적으로 메모리 공간이 가득 차 시스템이 멈추는 현상이 발생하였습니다. 이때 기존의 경우, 문제가 발생한 메모리 자체를 본뜬 덤프를 직접 보며 디버깅을 진행해야 했기에 시간이 오래 걸린다는 문제가 있었습니다.
이를 개선하기 위해, GPU의 메모리 할당 로직을 분석하여 프로세스 ID별 메모리 사용량을 추적할 수 있는 노드와 다양한 크기의 페이지가 혼용되는 구조에서 페이지 테이블 현황을 조회할 수 있는 노드를 추가하였습니다. 해당 노드를 쉘에서 실행하여 실시간으로 메모리 정보를 확인하면서 디버깅 시간을 크게 단축시켰습니다. 이를 통해 메모리 누수를 확인하여 빠르게 문제를 해결해 나갈 수 있었습니다.
고객사 이슈 대응 TF
제품 상용화 이후, GPU 커널 외에도 그래픽 엔진 및 유저 드라이버 등 다양한 영역에 대해 고객의 스마트폰 사용 환경에서 발생하는 모든 관련 이슈를 재현, 분석, 해결하는 TF팀으로 활동하였습니다.
이슈 재현 시나리오를 기반으로 로그를 확보하고, 이를 통해 문제 발생 조건을 구체화하였습니다. 이후, 기존 동작에 영향을 주지 않도록 조건 분기를 활용하거나 동일한 동작을 하는 수정 함수로 대체하여 문제 지점을 보완하였습니다. 또한, 수정된 함수에 로그를 삽입하고 재현 테스트를 반복하며 수정 효과를 검증하였습니다.
이러한 문제 해결 프로세스를 통해 커널 외 영역까지 포함한 다양한 이슈를 효과적으로 해결해 나갈 수 있었습니다.
프로젝트
- 프로젝트명
- 다함께 정하는 모임 장소 서비스, Kok
- 소속/기관명
- 디자이너와 프로그래머의 만남 (이하 디프만)
- 프로젝트 기간
- 2025.01. - 진행 중
- (5개월)
- 프로젝트 설명
Turborepo, TypeScript, Next 15, vanilla-extract, TanStack-Query, Zustand
모두가 함께 정하는 중간장소 서비스입니다. 프론트엔드 4명, 백엔드 3명, 디자인 3명으로 구성된 팀에서 출발지 설정 기능 및 모임 장소 후보지 추가 기능을 주로 개발하였습니다.
지도 패키지 구조 개선 및 유지보수성 향상
모노레포 내 별도 패키지로 관리되던 네이버 지도 모듈이 기능 확장에 따라 하나의 컴포넌트에서 과도한 책임을 갖게 되었고, 이로 인해 로직이 복잡해지며 수정 포인트가 증가하는 문제가 있었습니다.
TanStack Query의 QueryClient 패턴에서 영감을 받아 지도 객체를 Context로 관리하고, 해당 객체를 통해 다양한 지도 기능을 정의 및 주입할 수 있도록 구조를 개선했습니다. 이로써 네이버 지도 패키지의 의존성을 줄이고, 기능 확장 시 코드 변경 범위를 최소화할 수 있어 유지보수성과 확장성이 향상되었습니다.
코드 리뷰 Pn룰 적용
사이드 프로젝트를 진행하며 코드 리뷰를 진행할 때, 리뷰 의도를 파악하기 어려워 커뮤니케이션 비용이 증가하는 경우가 존재했습니다.
따라서 코드 리뷰의 우선순위와 중요도를 명확히 하기 위해 Pn룰을 적용하여 의사소통의 효율성을 높였습니다. 또한 PR에 어떤 리뷰가 추가되었는지 한눈에 파악하기 위해 GitHub Actions로 Pn 라벨링 자동화를 추가하였습니다.
기술 스택
- 프로젝트명
- 수영 기록 아카이빙 서비스, Swimie
- 소속/기관명
- 디프만
- 프로젝트 기간
- 2024.06. - 2024.11.
- (6개월)
- 프로젝트 설명
TypeScript, Next 14, Panda CSS, React-Query, Jotai, Storybook
수영인들을 위한 수영 기록 서비스입니다. 프론트엔드 4명, 백엔드 3명, 디자인 3명으로 구성된 팀에서 달력에서 일별 수영거리의 목표 대비 기록 시각화를 확인할 수 있는 메인 페이지와 다른 유저들의 수영 기록을 확인할 수 있는 피드 페이지를 주로 개발하였습니다.
GitHub Actions 활용
자동으로 리뷰어를 지정하고, PR의 타입, 리뷰가 필요한 PR의 라벨을 자동으로 부착하여 명시적으로 확인할 수 있도록 하였습니다. 또한 빌드 테스트를 진행하여 배포 시 에러를 사전에 방지하였으며, 스토리북 자동 배포를 통해 디자이너와 효율적으로 소통하고자 하였습니다.
svg와 path를 활용한 물결 모양 시각화
svg 태그 내부에서 path 태그의 명령어들을 활용하여 사용자의 수영 거리의 목표 대비 기록의 비율을 계산하여 물결 모양 디자인에 맞게 시각화하는 컴포넌트를 구현하였습니다.
사용자 경험 개선
구현된 서비스에서 컨텐츠가 갑자기 바뀌거나 페이지가 현재 로딩중이라는 별도의 표현이 존재하지 않아 이를 인식하기 어려워 사용자 경험이 떨어진다는 인식을 받았습니다. 따라서 스켈레톤, 로딩바, 로띠 등을 제안하고 도입하여 사용자가 끊기는 느낌 없이 서비스를 사용하는 인상을 받을 수 있도록 경험을 개선하였습니다.
기술 스택
- 프로젝트명
- 목표 기반 인생지도 서비스, 반디부디
- 소속/기관명
- 디프만
- 프로젝트 기간
- 2023.11. - 2024.03.
- (5개월)
- 프로젝트 설명
TypeScript, Next 14, Tailwind CSS, React-Query, Jotai, Storybook, React-Hook-Form
자신의 목표를 세우고 인생 지도를 만들 수 있는 서비스입니다. 프론트엔드 4명, 백엔드 3명, 디자인 3명으로 구성된 팀에서 프론트엔드 개발자로, 자신의 목표를 설정하는 목표 설정 플로우와 다른 유저들이 올린 목표들을 확인할 수 있는 피드 페이지를 주로 개발하였습니다.
Atomic Pattern 도입
첫 디자인 직군과 협업을 하며 프로젝트 초반 디자인 수정이 빈번하다는 것을 느꼈습니다. 따라서 Atomic Pattern을 도입하여 원자 컴포넌트에 디자인 시스템을 반영하여 코드 재사용성을 높이고 변경에 유연하게 대처하려 노력하였습니다.
Google Analytics 활용
1차 MVP 이후 GA를 통해 가입자는 늘어나지만, 유저들의 재방문이 거의 없다는 것을 파악하고, 이를 팀에 공유하여 추가 기능 개발의 필요성을 어필하였습니다. 이후 팀원들과 사용자 간 소통을 할 수 있는 피드, 댓글, 이모지 기능 등을 기획하고 추가하여 약 700명의 유저를 유치하며 동아리 우수상을 수상할 수 있었습니다.
기술 스택
- 프로젝트명
- 고양이 SNS, Kitty Mark
- 소속/기관명
- 네이버 부스트캠프
- 프로젝트 기간
- 2022.10. - 2022.12.
- (3개월)
- 프로젝트 설명
TypeScript, React, React-Query, Recoil, styled-component
고양이를 위한 SNS입니다. 프론트엔드 2명, 백엔드 2명으로 구성된 팀에서 프론트엔드 개발자로, 인스타그램처럼 모든 게시글들을 확인할 수 있는 메인 페이지, 위치 정보가 담긴 게시글들을 확인할 수 있는 지도 페이지를 주로 개발하였습니다.
클라이언트 번들 사이즈 축소
첫 서비스 접근시 로딩 시간이 길어 라이트하우스를 통해 성능을 측정해본 결과, 번들 파일의 용량이 크다는 문제가 발생하였습니다. 따라서 React Loadable을 통한 코드 스플리팅과 gzip 압축을 활용하여 main.js의 크기를 기존 대비 약 31%로 축소하였습니다.
과부화된 서버의 블로킹 문제 해결
Apache JMeter를 이용한 부하테스트 결과, 싱글 스레드로 동작하는 NestJS 서버에 블로킹이 발생하는 것을 확인하였습니다. 따라서 PM2를 통해 서버 클러스터링과 이때 발생한 데이터 일관성 문제를 redis에 유저 세션 정보를 저장하는 공유 메모리 방식의 IPC를 통해 해결하였습니다.
기술 스택
포트폴리오
교육
- 소속/기관
- 아주대학교
- 종류 | 전공명/전공계열
- 대학교(학사) | 디지털미디어학과,소프트웨어학과(복수전공)/정보통신대학
- 재학 기간 (재학 상태)
- 2014.03. - 2020.02. (졸업)
대외활동
- 활동명
- 네이버 부스트캠프 웹・모바일 7기
- 소속/기관
- 네이버 커넥트재단
- 활동 연도
- 2022
- 활동 상세 설명
네이버 커넥트재단에서 주관하는 네이버 부스트캠프는 미션과 프로젝트 위주의 개발 부트캠프입니다. 학습 과정에서 혼자 고민하는 과정도 필요하지만 네트워킹과 피드백을 중요하게 생각합니다. 도메인을 변경하면서 비슷한 환경의 사람들과 함께 학습하고 성장하기 위해 참여하였습니다.
챌린지 과정에서 매일 미션을 통해 JavaScript와 CS 지식에 대해 학습하고, 코드 리뷰를 통해 매주 다른 팀원들과 함께 학습하며 성장하였습니다. 위를 바탕으로 멤버십 과정에서 매주 짧은 스프린트를 통해 전반적인 웹 개발을 경험하였습니다. 그리고 학습한 내용들을 바탕으로 6주간 팀 프로젝트를 통해 결과물을 만들어 낼 수 있었습니다.
- 활동명
- 디프만 14~16기
- 소속/기관
- 디프만
- 활동 연도
- 2023
- 활동 상세 설명
디프만은 16주간 디자이너와 개발자가 서비스 기획부터 런칭까지 함께 경험하는 성장추구형 커뮤니티입니다.
14기(2023.11)부터 16기(2025.04)까지 참여하였으며, 여러 개발자분들뿐만 아니라 디자이너분들과의 협업 경험을 기르고 여러 직군의 사람들과의 네트워킹을 위해 처음 시작하게 되었습니다.
프론트엔드 4인, 백엔드 3인, 디자인 3인으로 구성된 팀에서 협업과 효율적인 개발 프로세스에 대한 방법론에 대해 고민하였습니다. 그리고 프로젝트를 통해 기술적으로 성장할 수 있는 기회를 얻고자
새로운 기술을 적극적으로 도입했습니다. 기술을 익히면서 기본기를 바탕으로 한 문제 해결 능력을 검증할 수 있었습니다.
또한 직접 15기 운영진으로 참여하여 다른 개발자들은 어떤 개발 방향성과 가치관을 가지고 있는지, 또 어떻게 학습하는지를 직접 보면서 제 자신의 방향성 설정에 있어 성장하고 싶어 참여하였습니다.