감각있는 프론트엔드 개발이 필요하신가요?
소통에 답답함을 느낀적 있으신가요?
책임감 없는 개발자에게 지치셨나요?
미대 졸업의 장점을 살려
사용자 친화적인 프론트엔드 개발이 가능합니다.
사용자 친화적인 프론트엔드 개발이 가능합니다.
기획/디자인/개발 경험이 있어
협업 시 원활한 소통이 가능합니다.
협업 시 원활한 소통이 가능합니다.
프리랜서 및 인하우스 근무경험프로젝트 완료율 100%
인물소개
기본 정보
이지연
93년생 / 여자
직업프론트엔드 개발자
레벨3년
활동지역서울, 경기
소속/이력
주식회사 호윤
프론트엔드 개발
2020.11 – 2024.05 (3년 1개월)
플랫폼개발팀 소속
다양한 웹 서비스와 이벤트 페이지의 퍼블리싱 및 프론트엔드 구현 담당
이화여자대학교
학사
2020.03 졸업
도자예술학과 전공
핵심 역량
- 실제 문제를 파악하고 해결하는 실전형 개발자입니다.
- 프론트엔드 개발 뿐 아니라 기획, 디자인의 경험까지 있는 올라운더 입니다.
- 스타트업 창업 멤버로서 사업 성장에 기여하고 팀을 리딩한 경험이 있습니다.
- 원만한 대인관계와 긍정적인 팀워크를 강점으로 다양한 협업 프로젝트를 성공적으로 수행했습니다.
- 새로운 기술을 습득하고 실무에 적용하는 데 익숙합니다.
이런 것들을 중요하게 생각합니다.
- 적응력책임감소통효율성
- 서비스를 이용 할 사용자의 입장에서 생각합니다.
- 프로젝트를 문서화하여 관리합니다.
- 프레임워크, 라이브러리 사용 시 공식 문서 정독의 중요성을 알고있습니다.
보유 기술
프론트엔드
HTML5
CSS3 (SASS)
JavaScript
TypeScript
React
- 웹표준을 지키고, 크로스 브라우징에 대응합니다.
- SCSS 문법, css 방법론, 애니메이션 기법을 활용할 수 있습니다.
- SPA/SSR/CSR 하이브리드 아키텍처를 설계하고 구현합니다.
- 상태 관리(React Query) 및 전역 상태 최적화가 가능합니다.
- 다양한 라이브러리 사용 경험이 있습니다.
디자인
Figma
Adobe XD
Photoshop
Illustrator
- 개발을 이해함으로써 디자인 구조를 최적화합니다.
- 사용자 중심의 디자인을 구현합니다.
- 웹 접근성 및 사용성을 고려한 인터페이스를 설계합니다.
클라우드/배포
AWS S3
CloudFront
Route53
Vercel
- AWS S3, CloudFront, Lambda@Edge를 활용하여 이미지를 최적화하고 CDN을 운영했습니다.
- 보안 스트리밍 (AWS Signed Cookie) 구현한 경험이 있습니다.
- 클라우드 기반 CI/CD 파이프라인 구축 및 배포 자동화 (Vercel) 경험이 있습니다.
- 실시간 모니터링 (Sentry) 및 로그 분석을 통한 서비스 안정화를 추구합니다.
협업 도구
GitHub
CodeCommit
Notion
Slack
Jira
- Git을 기반으로 프로젝트 형상 관리를 합니다.
- Jira, Notion을 활용하여 애자일 프로젝트를 관리하고 이슈를 트래킹 합니다.
- Slack을 통한 실시간 커뮤니케이션 및 비동기 협업 문화를 구축합니다.
- 문서화 및 지식 공유를 통한 팀 생산성을 향상시킵니다.
프로젝트
전체목록
개인 포트폴리오 사이트
2025.06- Cursor 에디터 기반 AI 생성 및 수정
- Next.js 기반의 SSR/CSR 하이브리드 구조
- Framer Motion, GSAP 등 다양한 애니메이션 효과 적용
Next.jsTypeScriptTailwindVercelCursor
기여도: 100%
[SyncMaster] 멀티 디바이스 관리 솔루션
2024.06 – 2024.07- Figma 디자인 시스템 구축
- Next.js 기반의 퍼블리싱 작업
Next.jsTypeScriptFigma
기여도: 100%
[200sec] 성인 OTT 서비스 웹/Admin 개발
2023.11 – 2024.01- HLS 기반 비디오 플레이어 커스터마이징 및 재생 안정성 확보
- CloudFront + Lambda@Edge로 실시간 이미지 리사이징 처리
- AWS Signed Cookie 기반의 보안 스트리밍 적용
- Cypress 테스트 자동화, Sentry 에러 로깅 및 모니터링
- Admin 관리자 페이지 전체 구축 (콘텐츠 등록/수정, 회원 관리, 통계 등 포함)
ReactTypeScriptAWSMUICypressSentry
기여도: 100%
쿠폰/포인트 선물 서비스 앱/Admin 개발
2023.09 – 2023.10- Flutter 기반 앱 UI/UX 개발
- Admin 관리자 페이지 전체 구축 (쿠폰 및 포인트 등록/수정, 선물, 회원 관리, 통계 등 포함)
- 주문 내역/회원 포인트 상태 조회 및 수기 지급 기능 구현
ReactTypeScriptFlutterMUI
기여도: 100%
[지구오락실 x 더현대 팝업스토어] 이벤트 페이지
2023.06- 모바일 중심 반응형 이벤트 페이지 퍼블리싱
- 브랜드 가이드에 맞춘 UI 애니메이션 설계 및 구현
HTMLCSSJavaScript
기여도: 100%
[플레이조커/룰루플레이] OTT 서비스 웹/Admin 개발
2022.12 – 2023.03- 회원 8만 명 이상 대상 OTT 플랫폼 프론트엔드 전체 구현
- 다양한 성인 인증 흐름과 콘텐츠 필터링 기능 개발
ReactAWSMUIHTMLCSSJavaScript
기여도: 100%
[회이팅] 모바일 웹 쇼핑몰
2021.09 – 2021.10- 모바일 웹 퍼블리싱 총 57페이지, 짧은 기간 내 고품질 마감
HTMLCSSJavaScript
기여도: 100%
[EaseEnd] 회사 공식 웹사이트 개발
2021.08 – 2021.09- BreakPoint 3개 기반 반응형 웹 구조 설계 및 구현
- 4종 디자인 대응 구조로 퍼블리싱 자동화
HTMLCSSJavaScript
기여도: 95%
사내 내부 관리자 페이지
2021.04 – 2021.08- 매출 대시보드, 상품 등록, 테이블 기반 필터링 기능 구현
ReactHTMLCSSJavaScript
기여도: 50%
[타이어로] 쇼핑몰 개발
2020.11 – 2021.03- 반응형 쇼핑몰 구축
- CSS 디자인 시스템 기초 구성 및 문서화
jQueryHTMLCSSJavaScript
기여도: 80%
문제/해결 경험
이미지 최적화 & 로딩 퍼포먼스 개선
- S Situation
- 대용량 원본 이미지(1920x1080)를 썸네일에 그대로 사용해, 페이지 초기 로딩 시 데이터 트래픽 과다 및 사용자 체감 속도가 저하되는 문제 발생.
- T Task
- 이미지 트래픽 최적화와 UX 개선 작업이 필요한 상황
- 개발 리소스가 한정된 환경에서, 서버 증설 없이 효율적으로 문제를 해결할 방안을 설계·실행해야 했음.
- A Action
- AWS S3·CloudFront·Lambda@Edge를 활용한 이미지 실시간 리사이징 파이프라인 구축
- 썸네일 요청 시 Lambda@Edge에서 필요한 크기로 실시간 변환해 반환, S3 오리진의 대용량 이미지 직접 요청을 차단
- React Query를 도입,
- 데이터 캐싱 구조 설계로 불필요한 서버 트래픽 최소화
- UI 상에서는 스켈레톤·프리로딩 등 사용자 체감 속도 개선
- AWS S3·CloudFront·Lambda@Edge를 활용한 이미지 실시간 리사이징 파이프라인 구축
- R Result
- 썸네일 영역의 평균 로딩 속도 60% 이상 단축
- 페이지 트래픽 감소로 월간 CDN 비용 절감, 서버 자원 부담 최소화
- 사용자 이탈률 감소 및 첫 화면 진입률 개선
HLS 스트리밍 오류 및 CORS 문제 해결
- S Situation
- HLS 영상 스트리밍에서 일부 사용자 환경에서 재생이 불가 하다는 민원이 간헐적/반복적으로 발생.
- Sentry 에러 로깅을 통해 AWS Signed Cookie 방식의 스트림 영상 재생 시 CORS 에러가 간헐적으로 감지됨.
- T Task
- 재현이 쉽지 않은 간헐적 이슈를 추적해 근본 원인을 규명하는 것이 필요함.
- AWS 및 CDN 설정을 조정해 서비스 안정성을 확보해야 하는 상황.
- A Action
- Sentry를 통한 에러 모니터링 및 사용자 로그 분석
- CORS 에러 발생 시점, 요청/응답 헤더 상세 추적
- 원인 분석 결과
- 미디어 컨테이너(원본 S3) 요청에서 간헐적으로 필수 헤더 누락 현상 확인
- AWS S3·CloudFront·Lambda@Edge 설정 검토
- 원본 요청 시 Header를 누락 없이 항상 전달되도록 AWS 정책 및 캐시 설정 수정
- 인증 쿠키·Signed URL 동작 방식 점검 및 CORS 정책 재설계
- 재현 테스트·실서비스 적용 후 Sentry 로그를 실시간 모니터링
- Sentry를 통한 에러 모니터링 및 사용자 로그 분석
- R Result
- HLS 영상 스트리밍의 CORS/재생 오류 해소
- 사용자 불편·민원 건수 급감하여 고객센터 및 운영팀 업무 감소
- Sentry 기반 실시간 모니터링 체계를 구축하여 향후 장애 조기 발견/대응 가능성 향상
- "서비스 장애 → 원인 규명 → 설정 최적화"까지 End-to-End 문제 해결 경험
영입하기
이지연
프론트엔드 개발경기도 화성시
부족한 부분을 채워드리겠습니다