프론트엔드 개발자

장우현

조직과 제품이 달성 하려는 목표에 대해 고민하고 목표 달성을 위한 유연한 사고를 중요하게 생각합니다.

인프콘 2024

책임감

협업 지향

솔루션 지향

유연함

목표 지향적

두번째 인프런의 오프라인 컨퍼런스 인프콘 2023에서
<ul>
<li>발표자들을 모집, 발표자료 수집 및 피드백, 행사 운영 안내 및 발표 지원 업무를 담당</li>
<li>공식사이트 개발 과정에서 기능 기획과 설계 및 운영팀과 개발팀간의 소통 담당</li>
</ul>

인프콘 2023 기획&운영

인프런의 오프라인 컨퍼런스 인프콘에서 스프린트 단위 일정 추정 및 업무 프로세스를 통해 예측 가능성 높은 업무 프로세스 도입 경험을 주제로 발표

인프콘 2022 발표

인프랩 기술 블로그

개인 블로그

허니비즈 기술 블로그

<ul><li>교대 근무자의 스케줄 배치를 위한 페이지에서 유저들의 요구사항 충족과 경험 개선을 위한 리뉴얼 프로젝트 진행</li><li>ag-grid 라이브러리를 활용한 테이블 구현 및 성능 개선을 위한 최적화 작업 진행</li><li>임시 저장, 유효성 검사 기능 등의 구현을 위한 api 설계 논의 및 구현 </li></ul>

교대 근무자 스케줄 배치 페이지 리뉴얼

근무 기록 타각을 위한 위젯 개편

<ul><li>유저별로 각 시기에 부여 및 소멸되는 연/월차 내역을 보여주는 연차 상세 페이지를 개편하고 각 부여/소멸별 사유를 안내해주는 메세지를 보여줌</li><li>시기별/유형별로 다양하게 발생하는 분기에 대응하기 위해 Strategy 패턴을 활용하여 다양한 메세지를 구현</li></ul>

연월차 부여/소멸 사유 안내

<ul><li>기존에 Server Side Rendering으로 생성하던 페이지에 Static Site Generation을 적용하여 서버 자원 절약 및 응답 속도 개선</li><li>AWS Cloud Front를 활용한 CDN 캐싱으로 추가 개선 진행</li></ul>

정적 페이지 생성과 캐싱을 활용한 렌더링 성능 개선

<ul>
<li>구글 검색시 사용자 노출 확대를 위해 채용 공고에 대한 <a href="https://developers.google.com/search/docs/appearance/structured-data/intro-structured-data?hl=ko">구조화된 데이터</a> 개선</li>
<li>누락된 마크다운 속성 보강, 시멘틱한 html 구조로 개편 등 웹 접근성 개선</li>
<li>사이트맵 개선, 이미지 사이즈 최적화</li>
<li>Link tag prefetch를 통한 성능 최적화</li>
</ul>

서비스 SEO 개선

<ul>
<li>정적 자원중에서 용량상 가장 큰 비중을 차지하고 있었던 js파일들의 최적화 진행</li>
<li>@next/bundle-analyzer로 분석 후 모듈별로 chunk로 분리 후 lazy import 처리</li>
<li>2.17M -&gt; 1.17M 로 번들 사이즈 최적화</li>
</ul>

Next.js 앱 번들 사이즈 최적화

<ul>
<li>목적조직 단위로 팀이 분화되면서 셀 마다 공통적으로 사용하는 logger, fetch 로직 등을 공용 모듈화하는 프로젝트를 주도</li>
<li>성격이 다른 각 기능들을 모노레포와 turborepo, changeset, github packages registry를 통해 CI/CD과정에서 개발자의 리소스를 최소화 하면서 패키지를 관리</li>
</ul>

프론트엔드 공통 기능 모듈화

<ul>
<li>팀이 목적단위 조직으로 분화되면서 랠릿 Cell에 소속되어 MVP로 개발했던 랠릿 서비스의 사용자 경험 개선을 위해 b2b 전형절차 커스터마이징, 이력서/지원서 작성 페이지 개선 등 신규 기능 추가와 유지보수 업무 담당</li>
<li>엔지니어로서 단순히 기술적인 분야에만 관심갖지 않고 신규 서비스의 성공을 위해 기획과 마케팅 등 분야를 가리지 않고 서비스에 기여하기 위해 노력중</li>
<li>기업 담당자를 대상으로 가입을 유치하고 carrying capacity 측정을 위해 필요한 데이터 수집을 제안</li>
<li>초창기 개발 당시 다양한 인원들이 참여하면서 분화되었던 b2c, b2b, admin 각 프로젝트의 아키텍처와 사용하는 라이브러리의 일원화를 진행중이고, 라이트하우스를 통해 웹 접근성과 SEO 점수를 90점 이상으로 관리중</li>
</ul>

채용 서비스 랠릿 신규 기능 개발 및 유지보수

<ul>
<li>도메인이 다른 인프런과 랠릿 두 서비스의 계정을 통합하고 1회 로그인으로 두 서비스에 모두 로그인이 가능하도록 통합 인증 기능의 컨셉을 설계하고 개발</li>
<li>프로젝트 진행 과정에서 기존의 팀 업무 프로세스였던 워터폴 방식에서 프로젝트 일정의 예측 가능성을 높이고 안정적인 개발자 경험을 위해 스프린트 단위의 업무 프로세스를 도입하고 관련 경험을 팀내 및 외부에 공유</li>
</ul>

인프런-랠릿 통합인증 기능 개발

<ul>
<li>초기에 context API와 recoil로 개발했던 이력서, 지원서 작성 페이지의 성능 개선과 개발자 경험 향상을 위해 사내 TF를 조직하여 react-hook-form 라이브러리를 사용하여 리팩토링을 진행</li>
<li>리팩토링 이후 추가적인 기능과 성능 개선이 이루어졌음에도 불구하고 7,000라인 이상의 코드를 줄여 가독성을 크게 개선하였고 개선 과정에서 얻은 경험과 인사이트를 사내 블로그에 글로 작성</li>
</ul>

랠릿 이력서, 지원서 작성 페이지 상태관리 로직 리팩토링

<ul>
<li>Next.js와 redux, class-transformer를 사용하여 개발한 채용 서비스 랠릿의 프로젝트 설계와 개발, 런칭에 주도적으로 참여</li>
<li>SEO와 사용자 경험 등이 특히 중요한 b2c 유저 서비스를 Next.js를 사용하여 서버사이드 렌더링으로 페이지를 구성</li>
<li>공통된 도메인을 공유하는 b2b, admin 서비스와 함께 개발 생산성을 향상시키기 위해 모노레포 구조로 프로젝트를 설계</li>
<li>b2b 서비스와 공유하는 디자인 시스템의 빌드 성능 개선을 위해 webpack 설정 최적화를 통해 빌드 시간을 92% 개선했고 이후 번들러 교체 등 지속적인 개선을 시도중</li>
</ul>

채용 서비스 랠릿 유저 페이지 신규 개발

<ul>
<li>온라인 강의 플랫폼 서비스에서 학습자들간의 커뮤니티 서비스를 새롭게 추가하기 위해 개인 프로필을 관리하고 커뮤니티 글을 작성하는데에 필요한 신규 기능들을 개발</li>
<li>개발자들의 코드 컨벤션을 일원화하고 코드 가독성을 개선하여 팀내 생산성을 높이기 위해 주기적으로 관련 내용을 안건으로 팀원들과 의논했고 eslint와 jsdoc을 개선</li>
</ul>

인프런 서비스 유저 프로필 페이지, 커뮤니티 페이지, 강의 큐레이션 페이지 개발

<ul>
<li>네이버 지도와 socket을 이용하여 운영팀에서 실시간으로 주문을 관제할 수 있는 React 서비스를 개발했습니다. 서비스 런칭 이후 당시 새로운 개념이었던 React hooks를 도입</li>
<li>복잡한 비즈니스 로직을 안정적으로 관리하고 코드 재사용성을 높이기 위해 사내에 Typescript를 도입하고 공통 비즈니스 로직을 모듈화하여 관리하는 시스템을 구축</li>
<li>prop drilling을 해소하기 위해 context API를 사용하여 Provider를 활용한 컴포넌트로 구조를 리팩토링</li>
</ul>

온디맨드 서비스 사내 직원용 관제 및 운영 서비스 개발 및 유지보수

계정당 하나의 가맹점을 관리하는 서비스 특성을 고려하여 redux를 이용한 중앙 상태 관리 기반의 서비스를 설계하고 개발. 코드 재사용성을 높이기 위해 공통된 UI를 컴포넌트로 개발하고 범용성을 위해 인터페이스와 사용성을 고민

온디맨드 서비스 가맹점 관리 서비스 개발

<ul><li>통합 HR 플랫폼 flex에서 근태관리 도메인의 프론트엔드 개발을 담당</li><li>월별 연차 부여/소멸 안내, 교대근무자 스케줄 배치시 휴무일 배치 기능, 세콤/캡스 출퇴근 타각 이후 근무 확정, 교대근무 스케줄 배치 페이지 리뉴얼 프로젝트 참여</li><li>JSCodeShift를 활용한 레거시 패키지 활용처 마이그레이션</li><li>Javascript 번들 사이즈 최적화를 위한 타입스크립트 린트룰 적용</li></ul>

<ul>
<li>IT 온라인 강의 플랫폼인 인프런과 채용 서비스 랠릿의 프론트엔드 개발을 담당</li>
<li>vanillajs로 개발된 인프런 서비스에 유저 프로필 페이지, 커뮤니티 페이지, 랠릿과 통합 인증 등의 기능을 추가하면서 생산성과 개발 경험 향상을 위해 jsDoc과 eslint 개선</li>
<li>신규 서비스인 랠릿의 초기 기획과 프로젝트 설계에 참여하여 Next.js로 b2c 서비스를 런칭했고, 현재는 서비스 고도화와 기능 개발을 담당</li>
<li>신규 프론트엔드 인원 채용과 온보딩 업무, 업무 프로세스 개선을 진행하고 있습니다. 2022년 코엑스에서 진행한 개발자 컨퍼런스 인프콘에서 업무 프로세스 개선 경험을 주제로 발표(<a href="https://youtu.be/e5NPC1y7ha4">https://youtu.be/e5NPC1y7ha4</a>)</li>
</ul>

<ul>
<li>음식 배달을 비롯한 온디맨드 O2O 플랫폼 서비스인 띵동에서 기존에 운영하던 주문과 음식점, 배달원을 지도에서 매칭하는 사내 관제 시스템과 어드민 서비스를 React로 마이그레이션 하고 사장님들이 사용하는 b2b 서비스를 신규 개발</li>
<li>사내 신규 인원 채용 과정에 참여했고 프론트엔드 팀원들간의 기술 지식 및 업무 경험 공유를 위해 사내 기술 및 업무 공유 시간을 만들어 지속적으로 운영</li>
</ul>