한 기기에 개발·운영 앱을 동시에 설치하는 방법: 올리브영 DEV/PROD 환경 분리
개발 앱과 운영 앱을 한 기기에 동시에 설치하도록 환경을 완전히 분리했습니다. Android는 Product Flavor, iOS는 xcconfig와 CI/CD로 배포 리스크를 줄였습니다.
#Android#iOS
9100
프론트엔드 기술 블로그 최신 글
필터 0
AST로 Outdated 없는 퍼널 문서 만들기
AST로 퍼널 라우팅을 정적 분석해 문서를 자동 생성하고, 코드 변경 시에도 최신 상태를 유지하는 방법을 소개했습니다. 조건 분기와 훅 내부 이동까지 추출해 Mermaid 다이어그램으로 시각화했습니다.
#AST#TypeScript
11200
“우리가 직접 만들겠습니다” — 무신사의 POS 내재화 여정
“우리가 직접 만들겠습니다” — 무신사의 POS 내재화 여정
무신사는 외부 POS 의존으로 생기던 개발 지연과 비용 문제를 해결하기 위해 MPOS를 전면 내재화했습니다. Electron 기반으로 하드웨어 연동, 배포, 모니터링을 정비해 운영 통제력과 개발 속도를 높였습니다.
#Electron#node.js
19000
“우리가 직접 만들겠습니다” — 무신사의 POS 내재화 여정
“우리가 직접 만들겠습니다” — 무신사의 POS 내재화 여정
무신사는 외부 POS 의존을 줄이기 위해 MPOS를 전면 내재화했습니다. Electron과 운영 보완으로 개발 속도와 현장 안정성을 함께 높였습니다.
#Electron#node.js
8400
디자인 컴포넌트 라이브러리를 ‘실제 사용 방식’에 맞게 다시 설계한 이야기
Kitchen의 빌드·패키지 구조를 실제 사용 방식에 맞게 다시 설계했습니다. ESM 전환과 단일 패키지화로 트리셰이킹과 DX를 개선했습니다.
#React#ESM
12800
디자인 컴포넌트 라이브러리를 ‘실제 사용 방식’에 맞게 다시 설계한 이야기
React 디자인 컴포넌트 라이브러리를 ESM과 단일 패키지 구조로 재설계했습니다. 트리셰이킹 적용으로 번들 크기와 빌드 시간을 크게 줄이고 DX를 개선했습니다.
#React#ESM
200
복잡한 검색 홈, 구조는 유연하게 화면은 부드럽게 개선하기
복잡한 검색 홈, 구조는 유연하게 화면은 부드럽게 개선하기
검색 홈과 결과 화면을 모듈로 분리하고, SwiftUI 기반의 탭 구조로 재설계한 사례를 소개했습니다. 또한 중간 페이지를 건너뛰는 커스텀 전환 뷰로 화면 전환 경험을 개선했습니다.
#SwiftUI#iOS
6600
리브랜딩 ATF 개발기
500장 이상의 이미지를 로고로 수렴시키는 ATF 인터랙션을 WebGL 기반으로 구현했습니다. Texture Atlas와 사전 좌표 계산으로 요청 수와 런타임 부담을 줄였습니다.
#WebGL#PixiJS
300
여기쏙 — Figma plugin 제작기 : 3. 성능
여기쏙 — Figma plugin 제작기 : 3. 성능
Figma 플러그인 2.0의 성능 개선을 위해 통신 계층과 렌더링 구조를 전면 재설계했습니다. 비동기 매칭, 탐색 비용, 이미지 로딩, 스토리지 동기화를 최적화해 체감 속도와 안정성을 높였습니다.
#Figma#React
7300
여기쏙 — Figma plugin 제작기 : 2. UI
여기쏙 — Figma plugin 제작기 : 2. UI
Figma 플러그인 UI를 가볍고 단순한 구조로 설계한 과정을 소개했습니다. 필터 상태, 캐시, 메시지 통신을 중심으로 실데이터 연동과 UX 개선을 정리했습니다.
#Figma#React Query
5600
여기쏙 — Figma plugin 제작기 : 1. 프록시 서버
여기쏙 — Figma plugin 제작기 : 1. 프록시 서버
Figma 플러그인에서 내부 API를 직접 호출할 때 발생하는 CORS와 HTTPS 제약을 해결하기 위해 프록시 서버를 구축했습니다. 기존 인프라를 재사용하고 최소 권한 원칙으로 설계해 안전하게 운영했습니다.
#Figma#NestJS
5700
App Intent, 어디까지 쓸 수 있을까
App Intent, 어디까지 쓸 수 있을까
App Intents로 앱 액션을 시스템에 노출하는 방법과 예약내역-캘린더 저장 예시를 정리했습니다. 다만 Apple Intelligence의 자연어 자동 매핑은 아직 제한적이어서 Shortcuts 중심 전략이 현실적이라고 보았습니다.
#iOS#App Intent
7200
제휴점 목록/지도 통합기: 26배 폭증한 비용부터 아키텍처 최적화까지
제휴점 목록/지도 통합기: 26배 폭증한 비용부터 아키텍처 최적화까지
목록과 지도를 하나의 화면으로 통합하며 비용 폭증과 구조 비대화 문제를 함께 다뤘습니다. Lazy Load, StateHolder, 거리 기반 클러스터링, 커스텀 바텀시트로 개선했습니다.
#Android#Kotlin
7500
Compose NestedScrollConnection 을 이용한 딜허브 화면 구현
Compose NestedScrollConnection 을 이용한 딜허브 화면 구현
Compose의 NestedScrollConnection으로 Tab 접힘과 페이지 스크롤을 연결하는 딜허브 화면 구현 방법을 설명했습니다. LazyColumn stickyHeader와 상태 제어를 함께 써서 화면별 인터랙션을 맞춘 사례를 공유했습니다.
#Android#Jetpack Compose
4500