프론트엔드 기술 블로그 최신 글

NEW FEATURE

기술을 읽던 곳에서, 다음 기회를 만나세요.

채용 검색부터 관심사 기반 추천, 내 적합도까지.

필터 0
선택된 필터 없음
닫기와 뒤로가기, 어떻게 다를까? — 헤이딜러 UX 스터디
PRND
프론트엔드

닫기와 뒤로가기, 어떻게 다를까? — 헤이딜러 UX 스터디

헤이딜러 UX 스터디는 닫기와 뒤로가기를 화면 깊이가 아니라 맥락으로 구분하는 기준을 정리했습니다. 모달은 닫기, 이전 페이지 흐름은 뒤로가기를 쓰는 방식으로 일관성을 맞췄습니다.

#Android#UX/UX
10600
프런트엔드 영역에서 FileReader를 이용해 MP4 파일 내 오디오 존재 여부 확인하기
라인
프론트엔드

프런트엔드 영역에서 FileReader를 이용해 MP4 파일 내 오디오 존재 여부 확인하기

LINE VOOM 웹에서 MP4 파일의 오디오 존재 여부를 FileReader와 Range 요청으로 판별했습니다. 브라우저별 API 차이와 iOS 버전별 CORS 이슈를 확인해 단계적 요청 방식으로 해결했습니다.

#FileReader#MP4
2900
잦은 배포를 언제나 안정적이고 쉽게- SimGit flow 기반 Git 브랜치 전략 개선기1
삼쩜삼
프론트엔드

잦은 배포를 언제나 안정적이고 쉽게- SimGit flow 기반 Git 브랜치 전략 개선기1

서비스와 인원이 늘며 Git Flow의 병합 조율 비용이 커졌습니다. SimGit Flow와 보조 브랜치를 도입해 개발 집중도와 배포 효율을 높였습니다.

#Git#브랜치 전략
1900
카카오헤어샵 vanilla-extract 도입기 - 카카오헤어샵 마크업 내재화 이야기
카카오헤어샵
프론트엔드

카카오헤어샵 vanilla-extract 도입기 - 카카오헤어샵 마크업 내재화 이야기

카카오헤어샵이 외부 퍼블리셔 의존 구조에서 벗어나 마크업 내재화를 추진한 내용을 다뤘습니다. vanilla-extract 도입을 통해 프론트엔드 스타일 작업 방식을 개선한 사례입니다.

#vanilla-extract#CSS
3300
Web을 위한 gRPC Stub과 Runtime 생성하기 - Feat. Buf & kubernetes
뱅크샐러드
프론트엔드

Web을 위한 gRPC Stub과 Runtime 생성하기 - Feat. Buf & kubernetes

웹에서 gRPC Stub과 Runtime을 생성하는 방법을 다뤘습니다. Buf와 Kubernetes를 활용한 구성 흐름을 중심으로 소개했습니다.

#gRPC#Kubernetes
2700
W CARE 서비스 프론트엔드를 TDD로 개발해본 후기
올리브영
프론트엔드

W CARE 서비스 프론트엔드를 TDD로 개발해본 후기

W CARE 프론트엔드의 복잡한 월경 이벤트 판별 로직을 TDD로 개발한 사례를 소개했습니다. 경계값 테스트와 관심사 분리로 신뢰성과 유지보수성을 높였습니다.

#TDD#React
3200
키친보드 안드로이드 앱 Jetpack Compose 도입기
spoqa
프론트엔드

키친보드 안드로이드 앱 Jetpack Compose 도입기

키친보드 안드로이드 앱에 Jetpack Compose를 도입한 배경과 장단점을 정리했습니다. 실무 적용 팁으로 MVI, Modifier 확장, 테스트 자동화 방법도 함께 공유했습니다.

#Android#Jetpack Compose
2300
자바스크립트 이렇게 짜면 외않되?
올리브영
프론트엔드

자바스크립트 이렇게 짜면 외않되?

V8 엔진의 JIT, 인라인 캐싱, 히든클래스를 바탕으로 자바스크립트 최적화 원리를 설명했습니다. 객체 구조를 통일하고 속성 초기화 순서를 맞추는 작성 습관을 제안했습니다.

#JavaScript#V8
3700
react-native 에 모듈 페더레이션 더하기 (with. RePack)
직방
프론트엔드

react-native 에 모듈 페더레이션 더하기 (with. RePack)

React Native에 모듈 페더레이션을 적용하기 위해 Re.Pack 구성과 host/remote 분리를 소개했습니다. 캐싱과 배포 전략, 번들 생성 및 원격 로딩 방식도 함께 설명했습니다.

#React Native#module federation
5400
티맵은 유저 휴대폰 카메라를 이용해 신기능을 만든다? - 23편 - Software ADAS로 운전의 편리함을 높이다
티맵모빌리티
프론트엔드

티맵은 유저 휴대폰 카메라를 이용해 신기능을 만든다? - 23편 - Software ADAS로 운전의 편리함을 높이다

티맵이 휴대폰 카메라 영상을 활용해 주행 상황을 실시간 분석하는 Software ADAS 기능 개발 과정을 소개했습니다.운전 편의성과 안전운전을 높이기 위한 카메라 기반 보조 기능의 활용 맥락을 설명했습니다.

#Android#ML
3500
마우스 드래그로 범위 지정과 리사이징 및 이동 구현하기
올리브영
프론트엔드

마우스 드래그로 범위 지정과 리사이징 및 이동 구현하기

매월 반복되던 기획전 마크업 작업을 줄이기 위해 드래그 기반 제작툴을 구축했습니다. 영역 지정, 리사이징, 이동과 마크업 자동 완성으로 작업 효율을 높였습니다.

#JavaScript#CSS
4500
돈 버는 커뮤니티, OK캐쉬백 오글오글의 UX/UI 이야기
SK플래닛
프론트엔드

돈 버는 커뮤니티, OK캐쉬백 오글오글의 UX/UI 이야기

OK캐쉬백 미션 게시판을 포인트 기반 커뮤니티 오글오글로 리브랜딩한 UX/UI 사례를 공유했습니다. 보상, 미션, 리액션, C2C 구조로 참여를 유도했고 베타 오픈 후 활동 지표도 개선했습니다.

#UX/UI#커뮤니티
3100
스크립트 툴의 장점만 모았다! zx로 업무 자동화하기
데브시스터즈
프론트엔드

스크립트 툴의 장점만 모았다! zx로 업무 자동화하기

자바스크립트와 쉘 명령어를 함께 쓸 수 있는 zx 라이브러리를 소개합니다. 반복 작업 자동화와 파일 처리에 특히 유용한 활용 사례를 설명했습니다.

#JavaScript#자동화
2300
Jetpack Compose로 LINE 앱 Yahoo!검색 모듈 개발하기
라인
프론트엔드

Jetpack Compose로 LINE 앱 Yahoo!검색 모듈 개발하기

LINE 앱 Yahoo!검색 모듈에 Jetpack Compose를 전면 도입한 사례를 소개했습니다. 상태 일원화, 스테이트리스 설계, Preview 표준화로 안정성과 협업 효율을 높였습니다.

#Jetpack Compose#Android
3200