Velopers
모든 블로그
여기어때

여기어때

도메인techblog.gccompany.co.kr
주요 카테고리 프론트엔드 · DevOps

활동 요약

대표 인기 포스트멀티모듈 프로젝트, 왜 그리고 어떻게 해야 할까?354 조회
최근 30일
2개
평균 조회
77
누적 조회
17,094
전체 글
223개
마지막 발행
2026. 10. 20.
블로그 방문

여기어때 기술 블로그 글 (67)

프론트엔드

여기어때 해외투어 프론트엔드 구축기록

모노레포 기반으로 웹·앱 웹뷰·채팅을 병렬 구축한 과정을 정리했습니다. 컴포넌트 중심 설계와 API 계층화로 QA 대응과 후속 확장을 개선했습니다.

#React#Vite#monorepo
5200

프론트엔드

항공 프론트엔드 구축기 (9/10): 쓰자고 해 놓고 안 썼습니다

항공 프론트엔드 구축기 연재에서 상태관리 주제를 다뤘습니다.

#React#상태관리
4100

프론트엔드

항공 프론트엔드 구축기 (8/10): 토큰이 세 군데서 온다

항공 프론트엔드에서 인증 토큰이 여러 경로로 들어오는 문제를 다룬 글입니다. 본문 접근 제한으로 세부 내용은 확인할 수 없었습니다.

#인증#토큰#JavaScript
4200

프론트엔드

여기어때 홈 카드 개선기 (1)

여기어때 홈 카드 개선 사례로, 홈 화면의 첫 인상과 탐색 경험을 다룹니다.

#UI/UX
5600

프론트엔드

테스트를 더 쓰기 전에, 어디에 쓸지부터: 동적 필터 ATDD 실험기

동적 필터를 적용하는 과정에서 ATDD 실험을 진행한 글입니다. 테스트를 더 쓰기 전에 어디에 쓸지부터 정하는 접근을 소개합니다.

#test#ATDD#필터
4100

프론트엔드

항공 프론트엔드 구축기 (7/10): 창구를 하나만 두었습니다

웹과 앱이 통신하는 앱 브릿지 구조를 다룬 글입니다. 통로를 앱에만 두는 제약 속에서 항공 프론트엔드 구축 방향을 설명했습니다.

#web#mobile#JavaScript
4000

프론트엔드

항공 프론트엔드 구축기 (6/10): 컨테이너를 둘로 쪼개지 않았다

항공 프론트엔드 구축 과정에서 레이아웃 컨테이너 설계를 다룬 글입니다. 제공된 내용상 컨테이너를 둘로 나누지 않은 선택이 핵심입니다.

#React#container
5800

프론트엔드

항공 프론트엔드 구축기 (5/10): 뒤로가기가 가장 어려웠다

항공 프론트엔드 구축 과정에서 뒤로가기 구현이 가장 어려운 문제로 다뤄졌습니다. 다만 발췌만으로는 구체적인 원인과 해결 방식은 충분히 확인되지 않았습니다.

#React#CSR#SSR
4500

프론트엔드

항공 프론트엔드 구축기 (4/10): “앱이냐”와 “좁냐”는 다른 질문이다

항공 프론트엔드 구축 과정에서 ‘앱이냐’와 ‘좁냐’는 서로 다른 질문임을 짚었습니다. 기존 구축 맥락을 바탕으로 프론트엔드 설계 관점을 정리했습니다.

#web#UI/UX
3600

프론트엔드

항공 프론트엔드 구축기 (3/10): prefix를 붙이자 tailwind-merge가 조용히 깨졌다

프론트엔드 구축 과정에서 Tailwind CSS prefix 적용으로 tailwind-merge가 깨진 사례를 다뤘습니다. 설정 변경이 클래스 병합 유틸리티에 미치는 영향을 짚었습니다.

#tailwind-merge#prefix#CSS
2900

프론트엔드

항공 프론트엔드 구축기 (2/10): Vue2 디자인 시스템을 React로 옮기기

Vue2 디자인 시스템을 React로 옮기는 항공 프론트엔드 구축기를 다룬 글입니다. 프론트엔드 기술 전환과 디자인 시스템 이관 맥락을 소개합니다.

#Vue.js#React#design
3800

프론트엔드

항공 프론트엔드 구축기 (1/10): 웹, 모바일웹, 웹뷰를 코드 한 벌로

항공 서비스를 새로 만들며 웹, 모바일웹, 웹뷰를 하나의 코드로 묶는 프론트엔드 구축 경험을 다룬 글입니다. 다양한 실행 환경을 함께 대응하는 구조를 소개하는 내용입니다.

#web#mobile#webview
10000

프론트엔드

AI와 함께 만든 콘서트팩 아카이빙 웹페이지

디자이너 혼자 AI를 활용해 콘서트팩 아카이빙 웹페이지를 제작한 과정을 소개했습니다. 여러 AI의 코드를 비교하고 시안 이미지를 활용해 브랜드 경험을 구현한 방식이 핵심입니다.

#web#Framer#Spline
5000

프론트엔드

Sentry를 바로 도입하지 않고 200줄 에러 트래커를 만든 이유

Sentry 대신 필요한 기능만 남긴 작은 에러 트래커를 직접 만들어 운영한 사례를 정리했습니다.재배포 없이 기준을 조정하고 반복 에러만 선별하는 방식의 장단점을 공유했습니다.

#Sentry#Edge Function#PostgreSQL
12800

프론트엔드

쿠폰은 많은데, 왜 혜택은 느껴지지 않았을까?

쿠폰 구조가 복잡해 고객이 최대 혜택을 체감하지 못하는 문제를 UX 관점에서 정리했습니다. 퍼널 전반의 노출 방식과 쿠폰명을 통일해 사용률 44% 증가를 만들었습니다.

#UX/UX#UT#쿠폰
4300

프론트엔드

불안정한 테스트를 신뢰로 바꾸는 과정: Playwright Flaky Test 개선기

Robot Framework 기반 자동화 테스트의 Flaky 문제를 Playwright로 마이그레이션하며 개선한 사례를 소개했습니다. 팝업 자동 처리, 셀렉터 정교화, 데이터 조건별 skip으로 테스트 신뢰도를 높였습니다.

#Playwright#Pytest#Robot Framework
12100

프론트엔드

Android On-Device AI: Gemini Nano와 ML Kit로 만든 2025 해커톤 프로젝트

Android 온디바이스 AI를 해커톤 프로젝트에 적용한 사례를 소개했습니다. GenAI API와 ML Kit 번역으로 로컬 처리, 이미지 설명, 재작성, 요약, 번역을 실험했습니다.

#Android#LLM#ML Kit
5800

프론트엔드

해외 숙소 리스트 성능 개선기 : 반쪽짜리 SSR에서 완벽한 인피니트 스크롤까지

해외 숙소 리스트의 반쪽짜리 SSR을 Hydration 기반으로 개선하고 무한 스크롤 UX를 다듬었습니다. 캐싱과 스크롤 복구, 예외 처리로 LCP와 TBT도 함께 개선했습니다.

#SSR#React#TanStack Query
9700