프론트엔드 아티클

새로운 기술 블로그가 추가되었어요

아임웹

필터 0

선택된 필터 없음

2022년 12월 14일

프론트엔드

올영라이브 템플릿화

올영라이브 이벤트 페이지를 반복 제작 부담을 줄이기 위해 모듈형 템플릿으로 전환한 사례를 소개했습니다. 고정 정보와 변경 요소를 분리해 등록만으로 페이지를 만들 수 있도록 구성했습니다.

지연 시간 없이 웹폰트 서빙하기 - Feat. Safari & Edge functions

웹폰트 서빙 시 발생하는 지연 시간을 줄이기 위한 방법을 다룹니다. Safari와 Edge Functions를 함께 고려한 서빙 접근을 소개합니다.

후기 개선 프로젝트가 끝이 아닌 시작인 이유

컬리 후기 서비스의 탐색 UX와 레거시 문제를 개선한 Phase 1 사례를 소개했습니다.\n초기 정리, 협업 커뮤니케이션, 단계적 로드맵 수립이 핵심이었습니다.

SwiftUI NavigationView로 Coordinator Pattern 사용하기

SwiftUI NavigationView에서 Coordinator 패턴을 구현하는 방법을 정리했습니다. 프로그램적 화면전환, LazyStack 대응, PopToRoot까지 처리하는 흐름을 설명합니다.

#SwiftUI#Coordinator Pattern

20005분

2022년 12월 9일

프론트엔드

[if kakao 2022] 사례로 보는 모바일 자동화 테스트를 통한 모니터링

모바일 자동화 테스트를 모니터링에 활용한 사례를 공유한 글입니다. if(kakao)2022 발표 내용을 바탕으로 한 소개성 게시물입니다.

[if kakao 2022] 카카오페이 iOS 웹뷰 소개, 그리고 세션에서 못다한 이야기

카카오페이 iOS 웹뷰 소개 세션의 후속 이야기를 공유합니다. 세션에서 다루지 못한 리팩토링 관련 내용을 추가로 다룹니다.

SEO 개선 초심자 가이드

검색엔진 최적화를 처음 시작할 때 필요한 기본 항목들을 구글 서치 콘솔, 사이트맵, robots.txt 중심으로 정리했습니다. 메타 데이터, 중복 URL, 상태 코드, 성능 개선까지 함께 점검하는 흐름을 제안했습니다.

#SEO#검색

23005분

`API 언제 나오나요?` 로 부터 독립하기

2022년 12월 8일

프론트엔드

`API 언제 나오나요?` 로 부터 독립하기

API 응답 모델이 불확실한 상황에서 factory 레이어를 둬 UI와 API 의존을 분리했습니다. LIVE와 VOD의 서로 다른 응답을 정규화해 UI 변경 범위를 줄인 사례를 소개했습니다.

플래닝 포커(Planning Poker)

플래닝 포커로 스프린트 일정을 산정하며 동료들의 경험과 의견을 공유받은 경험을 소개했습니다. 일정 산정 시에는 버퍼를 두고 큰 틀의 영향도 함께 고려하자는 인사이트를 전했습니다.

#agile#planning poker

12005분

2022년 12월 8일

프론트엔드

올리브영 메인페이지 성능 개선기

온라인몰 메인페이지의 초기 렌더링 지연과 느린 LCP 문제를 분석하고, 불필요한 지연 로직 제거와 탭 렌더링 순서 조정으로 개선했습니다. 또한 데이터 분리와 모니터링을 통해 FID, LCP, 로딩 타임을 함께 줄였습니다.

#성능#웹

31005분

라이브러리 없이 라우터(Router) 만들기

2022년 12월 6일

프론트엔드

라이브러리 없이 라우터(Router) 만들기

바닐라 JS로 해시 라우터를 직접 구현하는 과정을 설명했습니다. 경로 매핑, navigate, path parameter 추출까지 확장하는 방법을 다뤘습니다.

Apollo Client Pagination Fetching Guide

Apollo Client 무한스크롤을 `refetch`에서 `fetchMore`로 바꾸는 리팩토링 과정을 정리했습니다. 캐시 정책과 첫 페이지 예외 처리까지 함께 맞춰 페이징 문제를 해결했습니다.

#Apollo Client#pagination

20005분