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

필터 0
선택된 필터 없음
E2E 테스트 도입 경험기
카카오엔터테인먼트FE
프론트엔드

E2E 테스트 도입 경험기

E2E 테스트 도입의 장점과 운영상의 걸림돌을 함께 정리한 경험기였습니다. 기획서 기반 시나리오와 병렬 실행으로 관리성과 속도를 개선한 사례를 공유했습니다.

#E2E 테스트#Cypress
57005분
홈 화면에 웹 바로가기를 추가하기(A2HS)
카카오엔터테인먼트FE
프론트엔드

홈 화면에 웹 바로가기를 추가하기(A2HS)

웹 앱을 홈 화면에 추가해 네이티브 앱처럼 실행하는 A2HS 적용 방법을 설명했습니다. 매니페스트와 서비스 워커, beforeinstallprompt 활용법과 iOS 제한도 함께 정리했습니다.

#PWA#Web App Manifest
25005분
Streamlit으로 정비소 탐색 지도 만들기
오토피디아
프론트엔드

Streamlit으로 정비소 탐색 지도 만들기

Streamlit으로 정비소 탐색 지도를 만든 사례를 다뤘습니다. 프로토타입용이라는 인식에 대한 질문도 함께 제시했습니다.

#Streamlit#지도
13005분
iOS 환경에서 비디오 최적화 및 성능 개선 사례
SK플래닛
프론트엔드

iOS 환경에서 비디오 최적화 및 성능 개선 사례

iOS 15 이후 비디오 전환 시 발생한 깜박임과 사이즈 튐 문제를 분석하고 해결한 사례입니다. 썸네일, 로딩 상태, object-fit, 버전별 분기를 조정해 자연스러운 전환을 구현했습니다.

#iOS#object-fit
29005분
우리는 한다 리팩토링을 - UIKit+RxSwift 에서 SwiftUI+Combine 로의 여정
카카오헤어샵
프론트엔드

우리는 한다 리팩토링을 - UIKit+RxSwift 에서 SwiftUI+Combine 로의 여정

UIKit + RxSwift 기반 디자이너앱을 SwiftUI + Combine으로 리팩토링하는 과정을 소개합니다. 기존 구조를 유지하기보다 전면 수정에 가까운 전환 작업을 진행하고 있습니다.

#iOS#SwiftUI
15005분
Scroll Snap API를 통해 이미지 캐러셀 완성하기
카카오엔터테인먼트FE
프론트엔드

Scroll Snap API를 통해 이미지 캐러셀 완성하기

Scroll Snap API로 이미지 캐러셀을 만드는 방법을 정리했습니다. 스크롤 컨테이너와 자식 요소에 필요한 속성을 설정해 자연스러운 스냅 동작을 구현했습니다.

#CSS#web
23005분
react-query로 데이터 처리하기 - 파트너스 레거시 코드 리팩토링(2) api 로직, react-query
카카오헤어샵
프론트엔드

react-query로 데이터 처리하기 - 파트너스 레거시 코드 리팩토링(2) api 로직, react-query

파트너스 서비스 레거시 코드에서 API 로직을 분리하고 React Query를 도입한 사례를 다뤘습니다. Redux 중심 구조를 정리해 데이터 처리 방식을 개선하는 방향을 소개했습니다.

#React#Redux
17005분
드디어 리뉴얼 하는 날이 오는구나
트렌비
프론트엔드

드디어 리뉴얼 하는 날이 오는구나

서비스 리뉴얼 배경과 문제 정의, 개선 목표를 데이터와 사용자 조사로 재정립한 과정을 정리했습니다. 메인홈과 검색 UX를 개편해 탐색성과 체류시간을 높인 사례를 공유했습니다.

#UI/UX#디자인 시스템
12005분
적정기술 딜레마
카카오엔터테인먼트FE
프론트엔드

적정기술 딜레마

적정기술을 개발 환경에 맞춰 선택해야 한다는 관점을 설명했습니다. 최신 기술의 무조건적 도입보다 요구사항, 팀 역량, 유지보수성을 함께 봐야 한다고 정리했습니다.

#React#Next.js
22005분
Version Catalog 도입을 위한 온보딩 - gradle 버전 관리를 위한 Version Catalog 도입
카카오헤어샵
프론트엔드

Version Catalog 도입을 위한 온보딩 - gradle 버전 관리를 위한 Version Catalog 도입

Android 프로젝트의 Gradle 버전 관리를 위해 Version Catalog 도입을 소개했습니다. 여러 모듈의 build.gradle 복잡도를 줄이고 유지보수성을 높이려는 내용입니다.

#Android#Gradle
10005분
"검색엔진 가이드"를 금융쇼핑 서비스에 SEO로 활용하기
뱅크샐러드
프론트엔드

"검색엔진 가이드"를 금융쇼핑 서비스에 SEO로 활용하기

금융쇼핑 서비스에 검색엔진 가이드를 SEO로 활용하는 방법을 소개했습니다. 검색엔진 정책 변화 가능성을 염두에 두고 적용 맥락을 정리했습니다.

#SEO#검색
10005분
라이브관 프론트엔드 입장에서 바라보기
올리브영
프론트엔드

라이브관 프론트엔드 입장에서 바라보기

올리브영 라이브관을 신규 아키텍처와 SSR 기반으로 전환한 프론트엔드 경험을 공유했습니다. 이미지·영상 최적화와 공통 코드 관리, 크로스 브라우징 대응 방향도 함께 정리했습니다.

#Next.js#TypeScript
27005분