웹에서 파일 선택하기: onShowFileChooser()를 이용한 단일 및 복수 파일 선택 방법
안드로이드 WebView의 파일 입력을 onShowFileChooser()로 직접 구현하는 방법을 설명했습니다. 파일 선택 결과 전달과 URI 권한 처리, 복수 파일 선택 대응까지 다뤘습니다.
#Android#WebView
39005분
새로운 기술 블로그가 추가되었어요
필터 0
Vue 기능을 활용한 Transition 적용기
Vue Transition으로 버튼과 입력 영역의 등장·퇴장 애니메이션을 자연스럽게 구현한 경험을 소개했습니다. `v-if` 전환, `opacity` 조정, `mode="out-in"` 적용 과정을 정리했습니다.
#Vue#JavaScript
19005분
ChatGPT는 FE개발자를 대체할 수 있을까? (AI로 개발하기)
ChatGPT는 FE개발자를 대체할 수 있을까? (AI로 개발하기)
ChatGPT로 FE 개발을 어디까지 보조할 수 있는지 미니 프로젝트로 살펴보았습니다. 간단한 코드 생성에는 유용하지만 최신 설정과 정확한 구현은 검증이 필요했습니다.
#ChatGPT#Next.js
15005분
Vibrant Design System 과 함께하는 크로스 플랫폼 개발기
웹과 앱이 각자 다르게 만들던 UI를 크로스 플랫폼 디자인 시스템으로 통합한 과정을 소개했습니다. 기존 Box 중심 구조의 한계를 해결하기 위해 역할 분리와 플랫폼별 구현 방식을 도입했습니다.
#React Native#디자인 시스템
20005분
병원 상세 웹뷰 통신 및 크로스 브라우징
병원 상세 웹뷰 통신 및 크로스 브라우징
병원 상세 웹뷰를 사례로 웹-앱 통신 방식과 OS별 UX 차이를 정리했습니다. 또한 크로스 브라우징과 유지보수 개선 포인트까지 함께 다뤘습니다.
#웹뷰#JavaScript
27005분
Webview에서 핀치 줌(pinch zoom) 구현하기
Webview에서 핀치 줌(pinch zoom) 구현하기
웹뷰에서 핀치 줌을 직접 구현하는 방법을 설명했습니다. TouchEvent와 좌표 보정을 활용해 확대 중심을 유지하는 로직을 소개했습니다.
#TypeScript#web
57005분
우리 회사에 딱맞는 마이크로소프트 팀즈 봇 제작기 (프로젝트 생성 과정, 실습 포함)
마이크로소프트 팀즈의 협업 기능을 바탕으로 회사에 맞는 봇 제작 과정을 정리한 글입니다. 프로젝트 생성과 실습을 포함해 팀즈 봇 개발 흐름을 소개합니다.
#Microsoft Teams#bot
54005분
번들러 마이그레이션(Webpack to Vite)으로 빌드 속도 높이기
Webpack에서 Vite로 번들러를 옮겨 빌드 속도를 높이는 내용을 다뤘습니다. Vite의 빠른 개발·빌드 경험과 인기 배경을 소개했습니다.
#Vite#Webpack
18005분
예상보다 24배 많은 콘텐츠에 프론트가 대처하는 방법
6,000개 작품 규모의 이벤트 페이지를 위해 리스트 가상화와 스켈레톤, gzip 등을 적용해 성능을 개선했습니다. 또한 필터링과 탐색 기능을 보강해 대량 콘텐츠에서도 사용성을 높였습니다.
#React#SSR
32005분
TV APP 디자인할 때 고려해야하는 요소들
스마트TV 앱은 리모컨 조작과 포커스 상태를 전제로 모바일과 다른 기준으로 설계해야 합니다. 색상, 글자 크기, 성능 제약까지 고려해 TV 환경에서 직접 검증하는 과정이 중요합니다.
#UI/UX#모바일
19005분
나만의 Jest Matchers 만들기
나만의 Jest Matchers 만들기
Jest Custom Matcher를 만들어 반복적인 class 검증 테스트를 줄이는 방법을 소개했습니다. setup 파일 등록과 TypeScript 타입 선언까지 함께 다뤘습니다.
#Jest#test
8005분
2022 DevRel Awards: 보물찾기 이벤트개발 후기
2022 DevRel Awards 사전 이벤트로 QR 보물찾기 서비스를 기획하고 개발한 후기입니다. 어뷰징 방지와 한정된 개발 환경에서의 구현 고민을 정리했습니다.
#Spring Boot#JPA
20005분