☎️  연락처

010-5598-3513

✉️  이메일

[email protected]

깃허브

https://github.com/edhz8

소개

기술스택 : TypeScript JavaScript React Vue

• 에자일방법론을 선호하여 짧은 단위로 계획을 세우고, 이에 맞춰 프로젝트를 단계적으로 개발합니다.

• 읽기쉽고 테스트하기 좋은 코드에 관심을 가지고 있습니다.

• 공부하고 고민한 결과를 문서로 남겨 팀원들과 공유하는 것을 선호합니다.

공부 기록물 링크

프로젝트

XOXO - 남이 꾸며주는 나만의 피드

깃허브

개발문서

https://github.com/boostcampwm-2022/Web02-XOXO

XOXO wiki

담당

프론트엔드

기술 스텍

TypeScript , React , SWR , Sass, Naver Cloud Platform

개발기간

6주

프로젝트 소개

• 일반적인 SNS와 반대로 사용자의 피드에 다른사람들이 사진과 글을 작성해줄 수 있는 사진중심 SNS입니다.

• 사용자는 피드의 공개일을 설정할 수 있습니다.

  그 전까지는 게시물을 볼 수 없고, 썸네일을 픽셀화 시켜 사용자에게 공개일을 기다리는 재미 선사합니다.

• 프로젝트의 지향점은 대용량 트래픽을 경험하는것이었고,

  이를 위해 FE 담당으로서 프론트엔드 성능개선, 이미지 최적화에 관심을 가졌습니다.

성과

• LQIP, lazy loading 기법을 적용한 이미지 캐러셀 컴포넌트를 직접 작성했습니다.
• 픽셀화 기능을 자체구현하여 이를 개선할 수 있었습니다.
• LightHouse를 통해 성능 지표를 참고하고 개선했습니다.
• 이미지를 압축하여 업로드 하도록 최적화 하여 업로드 속도를 기존대비 1/20로 개선했습니다.
• input 검증 코드에 함수형 프로그래밍을 시도하여 가독성을 높이고, 코드 중복을 줄였습니다.