채용공고 올리기

김영수님을 응원해보세요!

지금 만족하고 있어요
성실함
책임감
유연함
자기 주도적
적응력

미리보기

기본 정보

이름
김영수
직업
프론트엔드 개발자
간단 소개

저는 7년차 프론트엔드 개발자로 TypeScript 언어를 기반으로 최신 기술을 활용해 이커머스 플랫폼을 최적화해왔습니다. React, Next.js, Angular 등 다양한 프레임워크에 능숙하며 특히나 성능 최적화에 관심을 가지며 지속적인 학습과 성장을 추구합니다. 특히나 프론트엔드 마이그레이션 프로젝트를 주도하며 팀의 성장을 이끌었고, 노랑풍선 IT 본부 최우수 사원으로 선정된 바 있습니다.

자기소개

자기소개

첫 회사에서 JavaScript로 솔루션 기반 Form 개발을 주 업무를 시작으로 트랜디 한 프론트엔드 기술 스택을 활용하는 회사에서 더욱 넓은 경험과 전문성을 기르고 싶었습니다. 개인 스터디를 통해 프론트엔드 개발자로 전향하게 되었고, 현재는 자유여행 이커머스 플랫폼 서비스를 제공하는 회사에서 프론트엔드 개발자로 근무하고 있습니다.

주어진 업무를 효율적으로 처리하거나, 더 많은 개발 역량을 쌓는데 흥미와 열정을 느낍니다. 주도적이고 적극적으로 프로젝트에 참여한 결과 결제, 환불/ 취소와 관련한 이커머스 도메인의 핵심 사이클에 대한 기능 개발에 참여하면서 현재 자유여행 프론트엔드 파트 선임 개발자로 업무를 수행하고 있습니다.

스스로의 성장을 즐길 뿐만 아니라, 회사 및 팀의 성장에 기여하는 것에 보람을 느낍니다. 팀원 모두 새로 적용하는 기술 스택에 빠르게 적응할 수 있도록, 스스로 학습하며 경험한 시행 착오와 유용한 외부 정보를 노션에 정리하여 공유하는 방식으로 팀 업무 능력 향상에 기여했습니다.

업무를 능숙하게 처리 하려는 욕심이 있어, 새로운 기술을 도입 시 퇴근 이후 웹 사이트에 존재하는 클린 코드 강의들을 공부하여 업무 수행에 차질이 없도록 노력합니다. 최근에는 유연한 코드를 만들기 위해 디자인 패턴에 대해 공부하고 있으며, 프레임워크에 제약 받지 않는 개발을 위해 TypeSciprt로만 디자인 패턴을 구현해보면서 성장을 목표로 학습을 꾸준히 이어가기 위해 노력하고 있습니다.

기술 스택

기술 스택

TypeScript, JavaScript, Node.js, React, Next.js, Angular, redux-toolkit, MobX, react-query, Java, Android

경력

회사명

노랑풍선

직급 | 부서 | 근무 유형

Front End 개발 | IT본부 프론트개발2팀 | 재직 중

근무 기간

2022.01. ~ 재직 중 (2년 11개월)

담당 업무

자유여행 플랫폼의 프론트엔드 개발 및 운영을 맡고 있습니다. Angular2, Next.js 프레임워크 기반 프론트 서비스를 운영하며 재직 기간동안 600건에 달하는 이슈 처리, 기능 개선, UI 개편 등을 전담 하며 전보다 더 나은 사용자 경험을 제공하였습니다.

프론트엔드 마이그레이션(Angular ⇒ React)를 위해 사내 React 스터디 구성하고 코드 리뷰를 통해 팀원들과 같이 성장 해 나아가고 있습니다. SEO 최적화로 사용자에게 미리보일 컨텐츠를 보다 매력적으로 제공하여 트래픽 증가로 연결 시켰고, Next.js 프레임워크의 기능들을 적극적으로 사용하기 위해 Pre-Rendering과 이미지 로딩 최적화 등을 통해 유저에게 보다 나은 사용 경험을 제공하기 위해 노력했습니다.

최근에는 화면 성능 개선을 위하여 성능 매트릭스 기반 화면 개선 등 보다 사용자에게 빠르게 컨텐츠를 노출 시킬 수 있도록 주도적으로 업무를 수행하고 있습니다.

또한, 프로젝트 내에서 유효성 체크와 금액 관련 로직이 많아 테스트 코드 작성이 중요했기 때문에 Jest 기반으로 테스트 코드 작성하는 문화를 확산하는 데에도 기여하고 있습니다.

이러한 노력과 열정 덕분에 23년도 IT 본부 최우수 사원으로 선정 되었습니다.

회사명

클립소프트

직급 | 부서 | 근무 유형

Full Stack 개발 | 컨설팅부 시스템 개발팀

근무 기간

2017.10. ~ 2021.12. (4년 3개월)

담당 업무

금융, 병원, 공공기관 등 다양한 도메인에 솔루션 연계 업무를 맡았습니다. Vanilla JS와 jQuery 스펙을 기반으로 업무 별 요구 사항을 웹 뷰어의 Form 개발을 주도적으로 진행하고, 사용자 요구사항에 맞춰 전자문서의 인터렉션에 대해 구현하였습니다.

대표적으로 기존 전자동의서 앱에서 환자 정보를 보여주는 페이지를 서버에서 만들었던 SSR 방식을 CSR 형태로 변경하여, 사용자에게 보다 빠른 인터렉션을 제공 하였으며, 입원, 응급, 외래 환자들을 탭 별로 조회 및 전자동의서 등록을 할 수 있도록 SPA 페이지로 구현 하였습니다.

또한, 데이터 조회에 사용되던 기존의 데이터베이스를 API 서비스 형태로 변경하여 데이터 관리 포인트를 간소화했습니다. 모바일 전자동의서 앱의 버전 업데이트 기능을 IIS 서버와 연계하여 APK 파일을 자동으로 다운로드할 수 있도록 로직을 추가하여 유지보수성을 크게 향상시켰습니다.

프로젝트

프로젝트명

자유여행 전시 화면 폼 관리 라이브러리 도입

소속/기관명

노랑풍선

프로젝트 기간

2024.06. ~ 2024.07.

프로젝트 내용

담당 역할

  • 폼 관리 라이브러리 도입 결정 및 구현 주도

  • 폼 관리 라이브러리와 기존 시스템 간의 통합 개발

  • 기술적 방향성 제시 및 팀원 간의 협업 지원

스킬 셋

  • 프로그래밍 언어: TypeScript

  • 프레임워크 및 라이브러리: React 18, Next 12, React-Hook-Form

업무 내용

  • 다양한 공급사별 폼 개발 요구사항에 유연하게 대응하기 위해 React-Hook-Form 라이브러리를 도입하여, 폼 상태 관리 및 검증 로직을 일원화했습니다.

  • 라이브러리를 통해 상태 관리 및 Validation Check를 통합하고, 포커스 이동 등의 반복적인 로직을 자동화하여 코드 복잡도를 30% 감소시키고 개발 생산성을 20% 향상시켰습니다.

  • 기존 제어 컴포넌트 방식에서 비제어 컴포넌트 방식으로 전환하여 불필요한 화면 리렌더링을 줄이고, 사용자 인터페이스 반응 속도를 40% 개선했습니다.

  • 도입된 폼 관리 시스템을 다른 도메인에도 점진적으로 적용할 계획을 수립하여, 장기적인 유지보수 및 확장 가능성을 높였습니다.

프로젝트명

자유여행 전시 화면 이미지 최적화

소속/기관명

노랑풍선

프로젝트 기간

2024.03. ~ 2024.04.

프로젝트 내용

담당 역할

  • 이미지 최적화 솔루션 평가 및 도입

  • 성능 개선 목표 설정 및 결과 분석

  • 프로젝트 문서화 및 최적화 전략 전파

스킬 셋

  • 프로그래밍 언어: TypeScript

  • 프레임워크 및 라이브러리: React 18, Next 12, Next/Image, Sharp

업무 내용

  • 자유여행 전시 화면에서 이미지 로딩 속도 문제를 해결하기 위해 Next.js의 Image 컴포넌트를 활용하여 Lazy Loading 방식을 적용, 페이지 로딩 속도를 50% 향상시켰습니다.

  • images.minimumCacheTTL 설정을 최적화하여 이미지 캐싱 기간을 늘리고, 이를 통해 사용자 경험을 개선하고 서버 요청을 30% 감소시켰습니다.

  • WebP 및 AVIF 포맷을 도입하여 이미지 용량을 평균 25% 줄이고, 이미지 품질을 유지하면서 네트워크 비용을 절감했습니다.

  • 최적화 작업을 통해 CLS (Cumulative Layout Shift) 지표를 크게 향상시켜, 페이지 안정성을 강화했습니다.

프로젝트명

자유여행 전시 화면 성능 개선

소속/기관명

노랑풍선

프로젝트 기간

2024.01. ~ 2024.02.

프로젝트 내용

담당 역할

  • Lighthouse를 통한 성능 분석 및 개선 주도

  • Pre-fetching 기술 도입 및 최적화 관리

  • 성능 개선 지표 설정 및 지속적 모니터링

스킬 셋

  • 프로그래밍 언어: TypeScript

  • 프레임워크 및 라이브러리: React 18, Next 12, Redux, React-Query

업무 내용

  • B2C 사이트의 성능을 진단하기 위해 Lighthouse 도구를 활용하여 페이지 로딩 시간과 사용자 경험을 평가하고, 이를 기반으로 성능 개선 계획을 수립했습니다.

  • Next.js의 Pre-fetching 기술을 통해 주요 콘텐츠를 사전 로드하여 페이지의 DOMContentLoaded 및 Load 시간을 평균 50% 단축시켰습니다.

  • 성능 최적화 결과, Lighthouse 점수를 59점에서 87점으로 향상시켰으며, 사용자 이탈률을 15% 감소시키고 페이지 반응성을 크게 개선했습니다.

  • 성능 지표를 지속적으로 모니터링하고, 발견된 문제들을 신속하게 해결하여 사용자에게 빠르고 안정적인 웹 경험을 제공하고 있습니다.

프로젝트명

자유여행 로그인 쿠키 프로세스 변경

소속/기관명

노랑풍선

프로젝트 기간

2023.09. ~ 2023.10.

프로젝트 내용

담당 역할

  • 클라이언트 및 서버 사이드 쿠키 관리 프로세스 설계

  • 보안 강화 요구사항 반영 및 HTTP Only 쿠키 전환 주도 개발

  • Express 기반 서버 아키텍처 설계 및 구현

스킬 셋

  • 프로그래밍 언어: TypeScript

  • 프레임워크 및 라이브러리: Angular 12, Rxjs, NgRx, Angular Universal, Express

업무 내용

  • 기존 클라이언트 측에서 관리하던 쿠키를 HTTP Only 쿠키로 전환하여 보안을 강화하고, Express를 활용하여 서버 사이드 렌더링 환경에서 안전하게 쿠키를 관리하는 구조를 구축했습니다.

  • 쿠키 제어 방식을 동기에서 비동기 방식으로 변경하여 로그인 프로세스의 효율성을 개선하고, 사용자 인증 속도를 30% 향상시켰습니다.

  • 클라이언트에서 서버 사이드로 쿠키 제어 로직을 이관하여, 보안성과 효율성을 동시에 높인 안전한 쿠키 관리 시스템을 구현했습니다.

프로젝트명

자유여행 호텔 상품 전시 마이그레이션

소속/기관명

노랑풍선

프로젝트 기간

2023.02. ~ 2023.08.

프로젝트 내용

담당 역할

  • 기존 호텔 도메인 분석 및 신규 시스템 설계 및 개발

  • 프로젝트 초기 개발 환경 세팅 및 팀 협업 주도

  • 결제 프로세스 설계 및 PG사 연동 개발

스킬 셋

  • 프로그래밍 언어: TypeScript

  • 프레임워크 및 라이브러리: Rxjs, NgRx, React 18, Next 12, Redux, React-Query

  • CI/CD: Nginx, Docker, Docker-Swarm

  • 기타 기술: Day.js, Styled Components, Jest, Figma

업무 내용

  • 유지보수가 되고 있지 않는 Angular 프로젝트를 분석 및 정리하여 Figma에 프로세스 정리를 했습니다.

  • 시스템 별 프론트엔드 기반을 통일화하여 업무 능률을 높이기 위해 중장기적 목표로 자유여행 시스템 프론트 영역을 Angular에서 React로 마이그레이션을 진행하고 있습니다.

  • 현 시스템의 무분별한 Store 사용으로 밀집되어 있는 코드를 풀기 위함과 신규 라이브러리(React-Query)를 도입하여 쿼리 인스턴스를 공유하고 API 요청 Request를 캐싱하여 불필요한 Fetching을 줄여 성능 개선을 했습니다.

프로젝트명

자유여행 시스템 공급사 화면 개발

소속/기관명

노랑풍선

프로젝트 기간

2022.10. ~ 2023.01.

프로젝트 내용

담당 역할

  • Iframe 기반 외부 공급사 신규 화면 개발

  • 결제 서비스 요구사항 수집 및 설계

  • 공통 서비스 아키텍처 설계 및 개발

스킬 셋

  • 프로그래밍 언어: TypeScript

  • 프레임워크 및 라이브러리: Angular 12, Rxjs, NgRx, Angular Universal

업무 내용

  • 외부 공급사 입점을 위한 Iframe 기반 신규 화면 개발을 진행했습니다.

  • 공급사 별 결제 옵션을 줄 수 있도록 쿼리 파라미터로 구분 값을 주어 공급사와 자사 간 구분 값을 주어 신규 결제 서비스를 개발했습니다.

  • Iframe Resizing 이슈를 해결하기 위해 iframe의 크기를 자동으로 바꿔주는 공통 서비스를 Event Listener를 활용하여 만들어 화면 별 이슈를 해결했습니다.

프로젝트명

자유여행 시스템 Angular 버전 업그레이드

소속/기관명

노랑풍선

프로젝트 기간

2022.08. ~ 2022.12.

프로젝트 내용

담당 역할

  • Angular 버전 업그레이드 계획 수립 및 실행

  • 빌드 및 배포 파이프라인 최적화

  • 개발 및 운영 환경 관리 및 개선

스킬 셋

  • 프로그래밍 언어: TypeScript

  • 프레임워크 및 라이브러리: Angular 12, Rxjs, NgRx, Angular Universal

업무 내용

  • 서비스 오픈 이후 관리되지 않았던 Angular 버전을 높여 사용성을 크게 향상시켰습니다.

  • Internet Explorer 지원 중단으로 ES 버전 타켓을 상향시키고, 불필요한 polyfill 코드를 정리하여 빌드 속도가 크게 향상되었습니다.

  • 컴파일 속도와 화면 랜더링에 대한 속도 개선을 위해 B2C, B2B, ADMIN 시스템의 Angular 모듈 버전을 9에서 15로 업그레이드 진행했습니다.

  • package.json을 개발/운영 환경에 필요한 항목들로 정리하여 빌드 속도를 향상시켰습니다.

  • 개발/운영 WEB 서버에 환경변수 설정 관리 및 nvm을 통해 Node 버전을 업그레이드했습니다.

프로젝트명

자유여행 시스템 모바일 통합 메인 개편

소속/기관명

노랑풍선

프로젝트 기간

2022.07. ~ 2022.10.

프로젝트 내용

담당 역할

  • 신규 모바일 메인 화면 UI/UX 설계 및 구현

  • Swiper를 활용한 사용자 경험 개선

  • 애자일 스크럼 프로세스 참여 및 실행

스킬 셋

  • 프로그래밍 언어: TypeScript

  • 프레임워크 및 라이브러리: Angular 12, Angular Universal, Rxjs, NgRx, Swiper

업무 내용

  • 패키지, 자유여행 UI/UX 통합을 위하여 신규로 메인 화면을 개발 하였습니다.

  • Swiper를 활용하여 PC에서도 이미지를 보기 용이하게 만들어 보다 나은 사용자 경험을 제공했습니다.

  • 기존에 개발했던 공통 팝업을 Swiper를 활용하여 메인 페이지에서 여러 개 이벤트들을 노출 시킬 수 있도록 추가 개발했습니다.

  • 프로젝트 수행 시 데일리 스크럼과 1주 스프린트로 계획하고 실천하면서 애자일 스크럼을 경험할 수 있는 계기가 되었습니다.

프로젝트명

자유여행 시스템 기획전 서비스 개발

소속/기관명

노랑풍선

프로젝트 기간

2022.02. ~ 2022.04.

프로젝트 내용

담당 역할

  • 캘린더 모듈 개발 및 모듈화

  • 백 오피스 연동을 통한 팝업 개발

  • 소셜 공유 기능 설계 및 구현

스킬 셋

  • 프로그래밍 언어: TypeScript

  • 프레임워크 및 라이브러리: Angular 12, Rxjs, NgRx, Angular Universal, Kakao SDK, Naver SDK

업무 내용

  • 자유여행 전시 영역에서 사용할 캘린더를 개발하고, 페이지에서도 사용할 수 있도록 모듈화했습니다.

  • 백 오피스와 연동하여 실시간으로 안내 팝업을 노출할 수 있도록 개발했습니다.

  • Kakao, Naver 오픈 라이브러리를 활용하여 기획전에서 사용자에게 공유하기 기능을 개발했습니다.

  • 입사 전 원할한 프로젝트 수행을 위해 개인 프로젝트로 Angular에 필요한 기본 지식을 미리 습득하여, 즉시 운영 업무를 수행할 수 있었습니다.

프로젝트명

P-HIS 시스템 구축 및 운영

소속/기관명

클립소프트/고려대학교 병원

프로젝트 기간

2020.03. ~ 2021.12.

프로젝트 내용

담당 업무

  • 전자동의서 SPA 페이지 신규 개발

  • 기존 앱 기능 고도화 및 유지보수

  • 시스템 간 인터페이스 협의 및 관리

스킬 셋

  • 프로그래밍 언어: Java 8, C#, JavaScript

  • 프레임워크 및 라이브러리: Android 10, .Net Framework, JQuery, Cordova, Swagger

  • 데이터베이스 및 서버: IIS, Oracle

업무 내용

  • 병원, 전자동의서 시스템 간 인터페이스 협의 및 관리를 했습니다.

  • Apache Cordova의 WebView 컴포넌트를 활용하여 입원 환자 조회 페이지를 구현했습니다.

  • 단위 테스트, 통합 테스트를 위해 DB 연동하여 모바일 환경 설정을 구현했습니다.

  • 약 200대의 테블릿에 전자동의서 앱을 Oracle DB로 앱 버전 관리를 하고, IIS 서버에 연계하여 APK를 자동으로 배포할 수 있도록 서비스를 구현했습니다.

프로젝트명

창구 Paperless 차세대 시스템 구축

소속/기관명

클립소프트/KDB 산업은행

프로젝트 기간

2018.07. ~ 2019.05.

프로젝트 내용

담당 업무

  • 전자동의서 폼 기능 설계 및 개발

  • Paperless 솔루션과의 연계 작업

  • 사용자 인터랙션 정의 및 공통 라이브러리 개발

스킬 셋

  • 프로그래밍 언어: Java8, JavaScript

  • 프레임워크 및 라이브러리: Android 10

  • 데이터베이스 및 서버: Apache/Tomcat, Oracle

업무 내용

  • 은행 서류를 요구사항에 맞춰 전자문서로 사용할 수 있도록 JavaScript과 Paperless 솔루션을 연계하여 폼 개발 했습니다.

  • 은행 전자 서식에 필요한 사용자 인터랙션을 정리하고, 추후 다른 SI 사이트에서도 사용할 수 있도록 공통 라이브러리를 개발 했습니다.

프로젝트명

SFA(Sales Forces Automation) 시스템 고도화

소속/기관명

클립소프트/NH 농협생명

프로젝트 기간

2018.02. ~ 2018.06.

프로젝트 내용

담당 업무

  • 전자 문서 파일 생성 및 인증 서비스 개발

  • Paperless 솔루션과의 연계 작업

  • 사용자 요구사항 수집 및 커스터마이징

스킬 셋

  • 프로그래밍 언어: Java8, JavaScript

  • 데이터베이스 및 서버: Apache/Tomcat, Oracle

업무 내용

  • 보험 서류를 전자문서로 사용할 수 있도록 JavaScript과 Paperless 솔루션을 연계하여 폼 개발을 했습니다.

  • 전자 서명 유효성 라이브러리를 사용하여, TimeStamp 기능을 구현했습니다.

  • 사용자 요구사항에 맞게 전자문서 솔루션 Viewer를 커스터마이징 했습니다.

  • Paperless 솔루션과 PDFWriter를 활용하여 전자 문서 파일을 만들고 FTP를 통해 서버에 저장할 수 있도록 서비스를 만들었습니다.

포트폴리오

URL

link

개발 정리

노션

교육

소속/기관명

학점은행제

종류 | 전공

대학교(학사) | 컴퓨터공학과

재학 기간 | 재학 상태

2019.03. ~ 2020.08. | 졸업

소속/기관명

인하공업전문대학교

종류 | 전공

대학교(전문학사) | 컴퓨터정보과

재학 기간 | 재학 상태

2012.03. ~ 2018.02. | 졸업

소속/기관명

영일고등학교

종류 | 전공

고등학교 | 문과

재학 기간 | 재학 상태

2009.03. ~ 2012.02. | 졸업

외국어

외국어명

일본어

점수

일상 회화 가능

댓글