프론트엔드 개발자

이서인

이유있는 코드를 쓰려고 노력하며 사용자 경험을 최우선하는 프론트엔드 개발자입니다.
인증 토큰 자동 갱신, 크로스 브라우징 이슈, 반응형 UI, 레이아웃 시프트 등 작은 디테일도 놓치지 않고, 개선해 사용자에게 더 나은 경험을 제공하기 위해 노력합니다.
프로젝트 진행 시 데일리 스크럼과 문서화로 동료들과 명확하게 소통하며 협업의 효율성을 높이고 있습니다.

성실함

책임감

협업 지향

목표 지향적

커뮤니케이션

<ul><li>JavaScript, React, TypeScript, Next.js, Git 등 프론트엔드 직무 역량 강화</li><li>실무와 유사한 팀 프로젝트 3개 진행과 1개 팀 리드, 사용자 중심 설계와 팀워크 중요성 체득</li><li>프론트엔드로서 백엔드 개발자와 원활한 소통 위해 백엔드 지식 이해도 향상 필요성 인식</li></ul>

[교육] 코드잇: 프론트엔드 개발자 양성 부트캠프

<ul><li>이웅모 강사의 'JavaScript 직강'에서 JavaScript 기초 수업 자료를 검토하고, 피드백 진행</li><li>직강 수강생의 출결과 과제 제출 현황을 관리하고, 수업 분위기 조성과 전달사항 공유</li></ul>

[외부활동] 모던자바스크립트 Deep Dive 저자 이웅모 강사님 조교

ENGLISH

기술 스터디 문서화

1일 1커밋 깃허브

기술 블로그

<ul><li>반려동물 용품을 더 저렴하게 공동구매할 수 있는 이커머스 사이트입니다.</li><li>참여 인원: 프론트엔드 5명 / 백엔드 2명 / 디자이너 1명</li><li>기술 스택: React, TypeScript, NEXT.js, SCSS, React-Query</li><li>관련 링크: <a target="_blank" rel="noopener noreferrer nofollow" href="https://pawing-market.vercel.app/">배포 링크</a> / <a target="_blank" rel="noopener noreferrer nofollow" href="https://github.com/Together-3team/petFrontend">GitHub</a> / <a target="_blank" rel="noopener noreferrer nofollow" href="https://vast-nephew-587.notion.site/Together-3team-738fbbd3583c48cdb3da37f05e29859d?pvs=4">기록 노션</a> / <a target="_blank" rel="noopener noreferrer nofollow" href="https://velog.io/@seoin1002/%ED%8F%AC%EC%9E%89%EB%A7%88%EC%BC%93-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-%ED%9A%8C%EA%B3%A0">회고</a></li></ul><ul><li>주문 상세 페이지의 레이아웃 시프트를 해결하기 위해 컴포넌트의 세로 고정값을 지정해 <a target="_blank" rel="noopener noreferrer nofollow" href="https://github.com/Together-3team/petFrontend/pull/319">CLS를 0.259에서 0.014로 94.6% 개선</a>, 안정적인 레이아웃과 향상된 UX 구현</li><li>카카오와 구글 OAuth 인증 구현, 쿠키에 access token을 저장하고, <a target="_blank" rel="noopener noreferrer nofollow" href="https://github.com/Together-3team/petFrontend/pull/313">Axios Interceptor를 통해 refresh token 자동 갱신</a>해 자동 로그인 기능을 추가해 사용자 편의성 강화</li><li>클라이언트가 AWS S3 버킷에 직접 이미지를 업로드하는 <a target="_blank" rel="noopener noreferrer nofollow" href="https://github.com/Together-3team/petFrontend/pull/202">presignedUrl 방식</a>을 도입해 서버 자원 절약과 업로드 속도 향상, 보안 강화</li><li>React-Query <a target="_blank" rel="noopener noreferrer nofollow" href="https://github.com/Together-3team/petFrontend/pull/318">쿼리 키와 로직을 분리</a>하여 데이터 패치를 효율적으로 관리하고, DX와 코드 생산성 향상</li></ul>

반려동물 용품 공동구매 웹앱 이커머스, 포잉마켓

<ul><li>리액트 개발 스터디 리드로 진행한 1인 개발 이커머스 사이트입니다.</li><li>기술 스택: React, TypeScript, Tailwind, React-Query, Redux-toolkit</li><li>관련 링크: <a target="_blank" rel="noopener noreferrer nofollow" href="https://react-shop-one-psi.vercel.app/">배포 링크</a> / <a target="_blank" rel="noopener noreferrer nofollow" href="https://github.com/Seoin02/React-Shop">GitHub</a> / <a target="_blank" rel="noopener noreferrer nofollow" href="https://vast-nephew-587.notion.site/5f1a8b83a82b49488169d118226c72a3?pvs=4">기록 노션</a> / <a target="_blank" rel="noopener noreferrer nofollow" href="https://velog.io/@seoin1002/Redux-%EC%9E%A5%EB%B0%94%EA%B5%AC%EB%8B%88-%EA%B5%AC%ED%98%84-TanStack-Query%EC%99%80-%ED%95%A8%EA%BB%98-%EC%82%AC%EC%9A%A9">회고</a></li></ul><ul><li><a target="_blank" rel="noopener noreferrer nofollow" href="https://github.com/Seoin02/React-Shop/pull/2">Redux를 도입</a>해 장바구니 상태 값을 localStorage에 저장하고, 장바구니 상품 상태를 전역으로 관리, UI에서 상품 수량과 가격을 실시간으로 업데이트해 사용자 경험 개선</li><li>변경이 거의 없는 특정 상품 목록을 React-Query로 캐싱해 동일 데이터 반복 요청을 최소화하고, UI 업데이트 속도를 향상시켜 UX 개선</li><li>Tailwind.config 파일을 활용해 화면 별 사이즈 지정 후 일관성있는 반응형 UI 구현, UX 개선</li></ul>

장바구니 기능을 구현한 이커머스, 리액트 샵

담당: 사회부, 경제부 기자 취재처: 인천시경제자유구역청, 인천관광공사, 인천시청, 인천교통공사, 한국철도공사 성과: 청년 사업 진흥 관련 감사패 수상프론트엔드 개발자로 직무 전환한 이유 <ul><li>3년 간 기자를 하며 더 나은 사회를 위한 문제 상황을 개선했고, 사회 문제 해결 적성 발견</li><li>프론트엔드 기술로 사회 문제를 해결하고, 사람과 세상을 이롭게 하는 가치를 프론트엔드 기술로 구현하기 위해 직무 전환 희망</li></ul>