프론트엔드 개발자

서연주

ENGLISH

서연주 Notion 포트폴리오

서비스 소개 | 농산물 직거래 웹 서비스 <a href="https://pure-market-client-kkobugi.vercel.app/">Pure Market</a> <a href="https://github.com/kko-bugi/pure-market-client">*소스코드</a> 작업 환경 | JavaScript, React 주요 역할
<ul>
<li>농산물 직거래 기능과 로그인 기능을 개발하고, loader와 errorElement를 사용하여 라우팅 설정(기여도 100%)</li>
<li>안전을 위해 액세스 토큰과 리프레시 토큰의 위치를 각각 로컬과 쿠키로 결정하고 interceptor를 작성하여 오류 방지</li>
<li>프론트엔드 리드를 맡아 생산성을 위해 아토믹 패턴을 도입하고, vercel로 CI/CD 구축</li>
</ul>

Pure Market

서비스 소개 | 인터벌 걷기 트레이닝 애플리케이션 Waki <a href="https://apps.apple.com/kr/app/id1638357652">*AppStore</a> &amp; <a href="https://play.google.com/store/apps/details?id=com.juice.timer">PlayStore</a> 작업 환경 | Dart, Flutter 주요 성과 | DAU 500+, 1만 다운로드, 사용자 평점 4.8 주요 역할
<ul>
<li>수익 창출을 목표로 6개월 간 격주 마다 신규 버전을 배포하고, 사용자 반응을 수집하여 서비스를 개선하는 과정 반복</li>
<li>제한적인 상황에서 부정적인 피드백 해소를 위해 스스로 수백 개의 로그 정보를 토대로 인사이트를 도출하고 해결책 제시</li>
<li>아쉬운 점 유지보수성 향상을 위해 시도했던 의존성 분리가 주관적 기준으로 진행되어, 디자인 패턴을 도입하고자 하는 아쉬움이 남음</li>
</ul>

Waki

서비스 소개 | AI를 이용한 실시간 학습 태도 모니터링 웹 서비스 STUDEEP <a href="https://github.com/YAPP-18th/ML-Team-Frontend">*소스코드</a> 작업 환경 | TypeScript, React 주요 역할
<ul>
<li>코드 재사용성 향상을 위해 아토믹 패턴을 도입</li>
<li>emotion을 사용하여 자체 디자인 시스템에 따라 CSS-in-JS 방식으로 스타일링</li>
</ul>

STUDEEP

작업 환경 | JavaScript 주요 역할
<ul>
<li>경기도여성비전센터 주관 <a href="https://www.gg.go.kr/woman-gusul/">여성활동 온라인전시관</a>을 5가지 브레이크 포인트를 기준으로 반응형 개발(기여도 100%)</li>
</ul>

작업 환경 | React, TypeScript 주요 성과 | 웹 사이트 성능 40% 향상, 상품 목록 페이지 로딩 지연 50% 감소 주요 역할 
<ul>
<li>포트폴리오 판매 사이트 <a href="https://topgimil.net/">TOPGIMIL</a> 내 PDF 문서 뷰어 기능 개선 (기여도 80%)<ul>
<li>백엔드 개발자와 협업하여 요구사항에 맞춰 라이브러리 코드 커스터마이징</li>
<li>iPhoneXR에서 문서가 로드되지 않는 현상이 발생하여 부분 렌더링을 적용해 해결</li>
</ul>
</li>
<li><a href="https://topgimil.net/">TOPGIMIL</a> 성능 40% 개선 (기여도 100%)<ul>
<li>이미지 사이즈 최적화 및 Code Splitting을 통해 주요 성능 저해 원인 해소</li>
<li>업무 수행 후에도 스피너, 스켈레톤 UI를 차례로 도입하며 사용자 경험 향상</li>
</ul>
</li>
<li>신규 커뮤니티 웹사이트 기초 작업 진행 (기여도 50%)<ul>
<li>사이트 성능을 고려하여 상태 관리 툴을 Context API에서 Recoil로 변경</li>
</ul>
</li>
</ul>