프론트엔드 개발자

이범진

프론트엔드 개발자 이범진입니다.

성실함

책임감

협업 지향

솔루션 지향

자기 주도적

<ul><li>상태 관리 고민<ul><li>Controlled Component와 Uncontrolled Component의 장단점을 분석하고, 서버 상태와 클라이언트 상태의 효과적인 관리 방안 모색.</li><li>상태 관리를 위한 적절한 라이브러리 선택에 대한 고민.</li></ul></li><li>타입 체크 라이브러리 도입<ul><li>안정적인 소프트웨어 개발을 위해 컴파일 및 런타임 환경에서의 타입 체크를 위한 라이브러리 도입.</li></ul></li><li>MSW(Mock Service Worker) 활용<ul><li>백엔드 개발과 병렬적으로 진행하기 위해 MSW를 도입하여 API 요청을 모킹.</li><li>브라우저 환경과 서버 환경의 동작 원리를 이해하고 이를 효과적으로 활용.</li></ul></li></ul>

REACT-TDD

JavaScript 및 React, Next.js 개발<ul><li>프로그래밍 경험<ul><li>JavaScript에서 React, Next.js까지 직접 구현해 보며 발전 과정 학습.</li><li>SCR, SSR, ISR, SSG 등의 개념 및 MVVM 패턴 이해.</li></ul></li><li>팀 프로젝트 경험<ul><li>다양한 Git Flow 전략을 배우고, 팀원들과의 효과적인 커뮤니케이션 능력 향상.</li></ul></li></ul>

프로그래머스 데브코스

TOIEC

ENGLISH

<ul><li>장바구니 로직 구현<ul><li>클라이언트와 서버에서 장바구니 데이터를 관리하여 사용자 경험을 최적화.</li><li>로그인 시 서버에서 장바구니 정보를 불러오고, 로그아웃 시 로컬 스토리지에 임시 저장.</li></ul></li><li>Error Boundary 및 Suspense Boundary 적용<ul><li>에러 발생 시 사용자에게 향상된 피드백 제공.</li><li>비동기 로딩 상태에서 로딩 스피너를 표시하여 사용자 경험 개선.</li></ul></li><li>Zod를 통한 런타임 에러 처리<ul><li>API 응답의 데이터 유효성 검사를 강화하여 명확한 에러 처리를 구현.</li><li>개발자와 사용자 모두에게 유리한 에러 관리 체계 구축.</li></ul></li><li>대용량 이미지 최적화<ul><li>Intersection Observer API를 활용한 lazy loading 구현.</li><li>페이지 초기 로딩 속도 개선 및 성능 최적화.</li></ul></li></ul>

shoping-cart 프로젝트

소상공인을 위한 음식 판매 플랫폼 개발<ul><li>인증 및 인가 로직 구현<ul><li>복잡한 로그인 상태를 처리하고, 사용자 인증 및 인가 체계를 구축하여 보안 강화.</li></ul></li><li>컴포넌트 기반 설계<ul><li>다른 개발자들이 쉽게 사용할 수 있도록 컴포넌트 기반으로 설계.</li><li>서버 컴포넌트와 클라이언트 컴포넌트를 효과적으로 구현하여 유지보수성 향상.</li></ul></li><li>Controlled Component와 Uncontrolled Component 고려<ul><li>사용자 입력<a target="_blank" rel="noopener noreferrer nofollow" href="http://적용.Next"> 처리 방식에</a> 대한 고민을 통해 최적의 컴포넌트 설계 적용.장바구니 로직 구현<ul><li>클라이언트와 서버에서 장바구니 데이터를 관리하여 사용자 경험을 최적화.</li><li>로그인 시 서버에서 장바구니 정보를 불러오고, 로그아웃 시 로컬 스토리지에 임시 저장.</li></ul></li><li>대용량 이미지 최적화<ul><li>Intersection Observer API를 활용한 lazy loading 구현.</li><li>페이지 초기 로딩 속도 개선 및 성능 최적화.</li></ul></li></ul></li><li>Next.js 도입<ul><li>LCP(Largest Contentful Paint)와 CLS(Cumulative Layout Shift) 성능을 향상시켜 사용자 경험 개선.</li></ul></li></ul>