웹 프론트엔드 개발자

이창혁

# Core Competencies

- HTML, CSS, Javascript, Typescript 및 React로 개발하는 것에 능숙
- Zustand, Redux, Recoil 등 다양한 상태 관리 라이브러리를 다루는데 능숙
- 프로젝트 초기 환경, CI/CD 파이프라인 및 테스트 자동화 환경을 구축하는데 능숙
- 프로젝트의 아키텍처를 고민하고 성공적으로 반영했던 경험 보유
- 유지보수성을 지속적으로 개선하고 렌더링 성능을 최적화한 경험 보유
- Next.js, Astro를 활용한 SSR 기반의 개발 경험을 쌓는 중
- Flutter, React Native를 활용한 모바일 앱 개발 경험을 쌓는 중

책임감

유연함

꼼꼼함

자기 주도적

문제 해결사

깃허브

개인 위키

요즘에 다시 만들고 있는 개인 블로그입니다.

<ul><li>대시보드 및 지도에서 로봇 상태 및 작업 현황을 실시간으로 관제하는 기능 개발</li><li>대용량 이미지 캐싱으로 지도의 초기 로딩 속도를 90%이상 감소시킴</li><li>메모이제이션을 통해 지도 구성 요소가 많아질 때 버벅이던 현상 최적화</li><li>엑셀 파일을 등록으로 물류센터 로봇의 작업을 생성하고 지시하는 기능 개발</li><li>다양한 형태의 그래프로 물류센터 로봇의 생산성 지표를 확인하는 기능 개발</li><li>FSD 아키텍처 도입으로 코드 유지보수성 개선</li><li>GitHub Action을 활용한 CI/CD 파이프라인 설계 및 구축</li><li>시맨틱 버저닝, 패치노트 작성, CI/CD 실패 및 슬랙 배포 공지 알림 자동화</li><li>핵심 기능에 대한 E2E 테스트 스크립트 작성 및 프리셋 구성</li><li>단위 테스트 커버리지를 0%에서 70%까지 채우는 과정에 기여</li><li>msw를 제안하고 도입하여 반복적인 모킹을 제거하고 테스트 작성 경험 개선</li></ul><code>TypeScript</code> <code>React</code> <code>Vite</code> <code>GraphQL</code> <code>Apollo Client</code> <code>Zustand</code> <code>Jest</code> <code>Storybook</code> <code>Sass</code> <code>Playwright</code>

물류센터 자율주행 로봇 관제 어플리케이션

<ul><li>송장 바코드를 스캔하여 라벨 프린터로 미리보기 없이 출력하는 기능 개발</li><li>다양한 레이아웃에 맞는 전용 프린터를 설정하는 기능 개발</li><li>송장 출력 결과 미리보기 기능을 개발하여 개발자 경험에 기여</li><li>GitHub Action을 활용한 CI/CD 파이프라인 구축</li><li>workflow dispatch를 통해 보다 편리하게 다양한 형상의 앱을 배포할 수 있도록 구축</li><li>설치 파일 배포 및 각종 알림 자동화</li></ul><code>Electron</code> <code>TypeScript</code> <code>React</code> <code>Vite</code> <code>GraphQL</code> <code>Apollo Client</code> <code>Zustand</code> <code>Jest</code> <code>Sass</code>

물류센터 송장 출력 어플리케이션

해외 주식투자 및 기업에 관한 정보를 제공하는 크로스 플랫폼 서비스를 만들고 있습니다. 개발 도중에 합류한 팀 프로젝트에요. 주로 Flutter를 사용하고 있습니다.<ul><li>메모리 캐시를 적용하여 API 호출 최적화 및 사용자 경험 개선</li><li>본격적인 디자인 반영 전 MVVM 아키텍처 도입을 제안하고 적용하여 유지보수성 개선</li><li>피그마에 정의된 디자인을 기반으로 모바일과 웹 환경을 고려한 UI 개발</li><li>기타 주요 기능 개발 및 버그 수정</li></ul><code>Flutter</code> <code>Dart</code> <code>Dio</code> <code>GoRouter</code> <code>GetIt</code>

Stockwhale(가제)

온라인 통신판매업자들이 현금흐름을 파악하는데 도움을 주는 서비스입니다. 프로젝트 초기부터 참여하면서 요구사항을 구체화했어요. 개발은 혼자 담당하고 있습니다.<ul><li>도메인 모델 설계 및 개발 관련 문서 작성</li><li>풀스택 SSR 웹 어플리케이션 및 서버리스 개발 환경 구축</li><li>쿠팡을 비롯한 커머스 API, 금융 및 세금 정보 API 연동<ul><li>아직 초기 단계라서 일부 API는 외부 기관에서 제공하는 테스트베드를 활용하는 중</li></ul></li><li>고정 API 확보를 위한 AWS 람다 CDK 구현<ul><li>링크:<a target="_blank" rel="noopener noreferrer nofollow" href="https://github.com/rheech22/cdk-static-lambda">https://github.com/rheech22/cdk-static-lambda</a></li></ul></li><li>LLM을 활용한 기능 개발 테스트 중</li></ul><code>Astro</code> <code>LangChain</code> <code>TypeScript</code> <code>React</code> <code>Tailwind CSS</code> <code>shadcn/ui</code><code>Turso</code> <code>Vercel</code> <code>AWS Lambda</code>

SellerLab(가제)

React, Typescript, Gatsby로 개발한 개인 위키입니다. 터미널에서 VimWiki로 문서를 작성하고 바로 배포할 수 있는 파이프라인을 구축했어요. 작년까지 공부한 것들은 틈틈이 올렸었는데 최근 다른 블로그를 다시 만들고 있습니다.<ul><li>모바일까지 고려한 반응형 디자인 적용</li><li>라이크/다크 모드 구현</li><li>검색 엔진 최적화 고려</li><li>VimWiki 인덱스 페이지 자동 생성</li><li>계층화된 문서 구조에 따라 경로 생성</li><li>문서에서 상위, 하위 문서 확인 및 네비게이션 가능</li><li>각 문서에서 변경 이력 확인 가능</li></ul><code>TypeScript</code> <code>React Gatsby</code> <code>Styled Component</code>

최근 다시 개발하고 있는 개인 블로그입니다. 제텔카스텐이라는 메모 기법에 관심이 생겨서 여러 시도를 해보고 있습니다. 현재 배포와 도메인 등록이 끝난 상태이지만 아직 프로토타입 수준입니다.<code>Next.js</code> <code>React</code> <code>TypeScript</code> <code>shadcn.ui</code> <code>TailwindCSS</code>

개인 블로그

<ul><li>로봇 자율주행 관제 및 물류센터 작업 관리를 위한 웹 어플리케이션 개발</li><li>바코드 스캔으로 다양한 양식의 송장을 출력하는 데스크탑 애플리케이션 개발</li><li>상세한 내용은 프로젝트 섹션을 참고해 주세요.</li></ul>