미리보기

플리에서 프론트엔드 팀 인턴으로 근무하며 2주 만에 Vue.js, Nuxt.js, Pinia 등의 새로운 기술 스택을 습득하여 프로젝트에 기여했습니다.

사용자 경험 개선

• 시맨틱 마크업과 ARIA 속성 적용으로 접근성 점수 70 → 90 향상

• 일관된 로딩 상태 관리 시스템 구축

크로스 브라우징 최적화

• 다중 이메일 클라이언트 호환 템플릿 시스템 개발

홈페이지

깃허브

개발 기간 - 2024.10 ~ 2024.12

플랫폼 - Web

개발 인원 - 4명 (팀 리더)

담당 역할

• 리로깅 서비스 핵심 기능 기획

• 메인 사용자 페이지 개발 전체 담당

성과

• Next.js 서버에서 JWT 토큰 관리로 XSS 공격 취약점 방어 및 인증 요청 응답 속도 향상을 달성했습니다.

• 런칭 이후 3주 만에 160명의 방문자와 1,050건의 조회수를 기록했습니다.

개발 환경

언어 - TypeScript

프레임워크 - Next.js

API, 라이브러리 - Zustand, React-hook-form, TanStack Query

홈페이지

깃허브

개발 기간 - 2023.09 ~ 2024.02 (6개월)

플랫폼 - Web

개발 인원 - 7인 프론트엔드 팀

담당 역할

• 사용자 페이지 - 쇼케이스 디테일 페이지

• 사용자 페이지 - 1대1 쪽지 페이지

• UI/UX디자인 가이드 작성

성과

• Next.js의 next/image를 활용해 이미지 확장자를 webp로 사용하여 이미지 용량 축소 및 레이지 로딩을 활용해 이미지 사이즈를 최적화하였습니다.
  - LCP: 10초 이상 → 1.8초 (약 82% 개선)

  - Performance 점수: 50점 → 79점 (약 30% 증가)

• 사용자의 편의성 증진을 위해 애플 HIG를 참고하여 UI/UX디자인가이드를 제작하였습니다.

개발 환경

언어 TypeScript

프레임워크 Next.js

API, 라이브러리 Zustand, react-hook-form, SWR

스터디, 지식품앗이 및 후기 DATABASE

• 42Seoul 커리큘럼 내 알고리즘, 운영체제, 네트워크 등 핵심 과제를 협업하여 해결하는 스터디를 개설하여 운영하였습니다.

• C/C++ 기반 시스템 프로그래밍과 컴퓨터 과학 기초 지식을 동료 학습 방식으로 학습

• 알고리즘/자료구조 학습을 통한 최적화된 프론트엔드 로직 구현 능력 향상

• Git 기반 협업 및 코드 리뷰 문화 경험

• C/C++을 통한 메모리 관리 및 최적화 학습으로 JavaScript 런타임에 대한 이해

• 페어 프로그래밍을 통한 커뮤니케이션 능력 향상