Velopers
모든 블로그
데보션

데보션

도메인devocean.sk.com
주요 카테고리 AI · DevOps · 백엔드

활동 요약

대표 인기 포스트나의 새로운 주니어 개발자는 AI? LLM을 활용한 코드 리뷰 자동화744 조회
최근 30일
2개
평균 조회
77
누적 조회
37,237
전체 글
486개
마지막 발행
2026. 11. 10.
블로그 방문

데보션 기술 블로그 글 (43)

프론트엔드

Jetpack Compose로 접근성 최적화하기

Jetpack Compose에서 semantics와 포커스 제어로 접근성을 높이는 방법을 정리했습니다. TalkBack 사용성을 개선하는 실무 팁과 비동기 콘텐츠 알림 방법도 함께 다뤘습니다.

#Jetpack Compose#Android#접근성
8100

프론트엔드

User-Agent vs. Feature Detection: 무엇을 언제 어떻게 써야 할까?

브라우저와 기기 환경에 따른 기능 제공 방식으로 User-Agent Sniffing과 Feature Detection을 비교했습니다. 기본적으로는 Feature Detection을 우선하고, 필요할 때만 User-Agent 계열 정보를 제한적으로 활용하는 방향을 권장했습니다.

#User-Agent#Feature Detection#JavaScript
12400

프론트엔드

웹 QA의 모든 것: 실전 검증 노하우와 Cypress 자동화

다양한 기기와 브라우저 조합에서 발생하는 웹 QA 이슈와 대응 노하우를 정리했습니다. Cypress를 활용해 반복 검증을 자동화하고 커버리지를 넓히는 방법도 소개했습니다.

#Cypress#QA#test
8200

프론트엔드

Kotlin으로 iOS까지? 이게 되네… 되긴 해요!

Kotlin Multiplatform으로 Android와 iOS의 비즈니스 로직을 공유하는 구조를 소개했습니다. 플랫폼별 UI는 유지하면서 공통 모듈과 expect/actual, Ktor, SKIE로 연동하는 흐름을 설명했습니다.

#Kotlin#iOS#Android
8600

프론트엔드

NPM Library 를 직접 배포하여 오픈소스 개발자가 되어보는 경험

오픈소스에 기여하는 방법으로 직접 NPM 라이브러리를 만들어 배포하는 과정을 소개했습니다. React 컴포넌트 예시와 함께 npm publish, 버전 관리, 재배포 절차를 설명했습니다.

#NPM#React#JavaScript
14600

프론트엔드

[Vue] motion 라이브러리로 더 나은 UX 제공하기

Vue에서 motion-v를 사용해 다양한 UI 애니메이션을 선언적으로 구현하는 방법을 소개했습니다. Transition, IntersectionObserver, GSAP보다 간결하게 작성할 수 있는 사례를 함께 살펴보았습니다.

#Vue.js#UI/UX#Animation
28100

프론트엔드

Chrome 확장 프로그램 개발 가이드

Chrome 확장 프로그램의 활용 사례와 장점을 소개하고, Manifest V3 기반 개발 구조를 설명했습니다. Content Script, Service Worker, Shadow DOM을 활용한 구현 방식도 정리했습니다.

#Chrome#JavaScript#browser extension
13100

프론트엔드

Vite를 이용한 FrontEnd프로젝트

Vite는 React뿐 아니라 여러 프레임워크를 지원하며 빠른 프로젝트 생성과 실행을 강점으로 소개했습니다. CRA보다 가볍고 구조가 익숙해 프런트엔드 개발에 효율적으로 활용할 수 있다고 설명했습니다.

#Vite#React#Vue.js
8100

프론트엔드

퍼블리셔와 개발자 협업을 위한 스토리북 깨짐 방지 방안

퍼블리셔와 개발자 협업에서 스토리북이 깨지는 원인을 분석하고 CIC 패턴으로 역할을 분리했습니다. 스토리북용 props와 실행 환경 분기를 정리해 무결성을 유지했습니다.

#React#Storybook#API
3400

프론트엔드

시각장애인을 위해 모달 컴포넌트 접근성 개선하기

시각장애인의 웹 탐색 방식에 맞춰 모달 접근성을 개선하는 방법을 소개했습니다. aria 속성, ESC 닫기, 포커스 트랩으로 키보드 탐색 경험을 보완했습니다.

#React#UI/UX#접근성
5300

프론트엔드

Vue.js 환경에서 페이지 이탈 방지 팝업 구현하기

Vue.js SPA에서 가입 중 입력 정보 유실 문제를 막기 위해 이탈 방지 팝업을 구현했습니다. beforeunload와 onBeforeRouteLeave를 조합해 라우터 이동과 외부 이동을 함께 대응했습니다.

#Vue.js#JavaScript#web
5000

프론트엔드

기술 한 스푼으로 웹앱 사용자 경험 개선하기

웹앱 UX 개선을 위해 스켈레톤 UI, Vue Transition, Tanstack-Query를 적용한 사례를 소개했습니다. 상황에 따라 스피너와 페이드 효과를 병행하며 전환과 상태 관리를 단순화했습니다.

#UI/UX#Vue.js#Tanstack-Query
2900

프론트엔드

AI전화 watchOS 개발기 #1 (Custom Notification 만들기)

Apple Watch의 Notification 동작과 Long-look Interface 구현 과정을 정리했습니다. 알림 목적지 결정, Action 처리, 로그 수집 방법까지 살펴보았습니다.

#watchOS#SwiftUI#Notification
2400

프론트엔드

디자인 시스템 #2 : SwiftUI를 활용한 BottomSheet 제작기-1

SwiftUI의 `sheet`와 `presentationDetent`를 활용해 BottomSheet를 구현한 경험을 정리했습니다. 동적 높이와 확장형 시트, 커스텀 배경을 위한 인터페이스 설계 방향을 소개했습니다.

#SwiftUI#iOS#디자인 시스템
4500

프론트엔드

에이닷 UI 테스트 자동화 이야기: 우리의 도전, 선택, 그리고 미래

에이닷이 모바일 UI 테스트 자동화 도입을 검토한 과정을 공유했습니다. 수동 QA의 한계를 줄이기 위해 Espresso와 XCTest를 선택하고 Zephyr 연동 방향까지 정리했습니다.

#모바일#UI/UX#자동화
3000

프론트엔드

당신의 View는 Main Actor 일 수 있다

SwiftUI View에서 `task`의 실행 맥락과 `MainActor` 보장 여부를 살펴보셨습니다. Swift 6에서는 property wrapper에 의한 actor inference가 제거되므로 `@MainActor` 명시가 중요합니다.

#Swift#SwiftUI#iOS
2800

프론트엔드

Vite로 회사 전용 로깅 모듈 개발하기 A to Z

회사 전용 로깅 모듈을 Vite 라이브러리 모드로 만들고 Git 저장소로 배포하는 과정을 정리했습니다. 접근 제어 환경에서는 access token을 활용해 설치 문제도 해결했습니다.

#Vite#Git#node.js
3800

프론트엔드

SwiftUI ScrollView 톺아보기

SwiftUI ScrollView의 기본 구조와 iOS 버전별 주요 API 변화를 정리했습니다. 또한 UIScrollView와의 차이와 대용량 콘텐츠에서의 성능 주의점도 함께 살펴보았습니다.

#SwiftUI#ScrollView#iOS
4400