여기어때 해외투어 프론트엔드 구축기록
글. 박수봉(Henby) / 서비스웹개발팀 안녕하세요. 서비스웹개발팀 헨비입니다. 9월 7일, 여기어때 해외투어 서비스를 오픈했습니다. 프론트엔드 담당 개발자는 두 명이었고, 웹과 앱 웹뷰를 하나의 코드베이스로 개발했습니다. 저는 웹 카테고리홈·상품 상세·주문서·예약내역·해외투어용 채팅을 맡았고, 검색바·헤더·푸터·예약내역 탭·찜 탭·회원탈퇴처럼 여러 서비…
글. 박수봉(Henby) / 서비스웹개발팀 안녕하세요. 서비스웹개발팀 헨비입니다. 9월 7일, 여기어때 해외투어 서비스를 오픈했습니다. 프론트엔드 담당 개발자는 두 명이었고, 웹과 앱 웹뷰를 하나의 코드베이스로 개발했습니다. 저는 웹 카테고리홈·상품 상세·주문서·예약내역·해외투어용 채팅을 맡았고, 검색바·헤더·푸터·예약내역 탭·찜 탭·회원탈퇴처럼 여러 서비…
여기어때 컬처 라운지 ep.22 안녕하세요, 여기어때의 사내 소식을 전하는 컬처라운지입니다. 🙂 가을 기운이 물씬 풍기던 지난 9월 말, 여기어때 오피스는 평소와 다르게 매우 한적했답니다. 바로 여기어때 전사 임직원이 다 함께 가을 운동회에 참석했기 때문인데요. 이날만큼은 모니터 대신 높고 파란 하늘을 바라보며, 회의 대신 응원을, 구글챗과 슬랙 대신 시원…
글. 심수현(Dante) / 전시개발팀 안녕하세요. 전시개발팀에서 여기어때 서비스를 개발하고 있는 단테입니다. 저희 팀은 레거시 API와 신규 API의 응답이 같은지 비교하기 위해 쉐도잉이라는 방법을 사용합니다. 쉐도잉(Shadowing)이란? 실제 요청을 신규 로직에도 보내 기존 로직과 결과를 비교하는 방식입니다. 사용자에게는 기존 로직의 결과를 전달하고…
글. 김수비(소피) / 공통플랫폼개발팀 안녕하세요, 여기어때컴퍼니 공통플랫폼개발팀 소피입니다. 1편 에서는 검색을 만들기 전에 바닥을 다졌습니다. Confluence와 Jira에 흩어진 문서를 증분으로 모으고, 검색에 쓸 수 없는 JSON을 Markdown으로 바꾸고, 이미지에는 대체 텍스트를 붙였습니다. 이미지가 보이지 않던 문제는 거기서 답이 됐습니다.…
글. 박이슬(스노우) / 공통플랫폼개발팀 안녕하세요, 여기어때컴퍼니 공통플랫폼개발팀 스노우입니다. 1편 에서는 Confluence와 Jira에 흩어진 문서를 모아 검색 가능한 형태로 바꿨고, 2편에서는 그 위에 LightRAG와 Navigator를 얹었습니다. 여기까지 오면 질문을 던졌을 때 답이 돌아옵니다. 그런데 만들고 나서 가장 오래 붙잡고 있었던 건…
글. 양현진(Cople) / 전시개발팀 안녕하세요. 전시개발팀 코플입니다. 저는 올해 사내에서 팀 이동을 하게 되었습니다. 공통플랫폼개발팀에서 약 2년 반 정도 플랫폼 개발 경험을 쌓고 전시개발팀으로 이동한 지 약 5개월이 지났습니다. 처음 경험하는 서비스 도메인 영역에서 우선적으로 서비스의 구조와 시스템을 파악하는 동시에 지금까지의 경험으로 팀에 기여할…
글. 박동규(jiha) / 광고플랫폼개발팀 안녕하세요. 여기어때컴퍼니 광고플랫폼개발팀 지하입니다. 저희 팀은 설치형 ERD 솔루션으로 ERD를 설계하고 관리해 왔습니다. 쓰는 사람마다 프로그램을 설치해야 했고, 라이선스 비용도 들었습니다. 무엇보다 테이블을 하나하나 그리고 관계를 잇는 일을 전부 사람이 했습니다. 그래서 올해 초부터 AI로 ERD를 그릴 수…
AI 시대 당신의 팀은 안녕하신가요 안녕하세요, 유저혜택개발팀 윌비 입니다. AI가 코드를 짜 주는데 개발자는 이제 대체되는 것 아니냐는 말이 심심찮게 나옵니다. 저는 개발자가 없어지는 것이 아니라, 필요한 것이 코딩에서 다른 데로 옮겨 갔다고 생각합니다. 팀에서 AI 워크스페이스를 함께 만들어 쓰면서 겪은 고민과 지금 하고 있는 방식을 적어 봤는데요. 겪…
“배포해줘” 한 줄로 끝나는 배포 — 전 직원이 쓰는 사내 플랫폼 구축기 글. 이단비(Tabie) / Service Factory팀 안녕하세요, 여기어때컴퍼니 Service Factory팀 타비입니다. 올해 초 팀을 옮긴 후 받은 첫 과제는 바이브코딩으로 서비스를 하나 만들어보는 것이었습니다. 여행 유튜브 영상을 AI가 요약해서 숙소 검색까지 이어주는 작은…
글. 박수봉(Henby) / Experience Development팀 안녕하세요. Experience Development팀 헨비(henby) 입니다. 9월 7일, 여기어때의 해외투어 서비스를 오픈했습니다~ 그 동안 짧지만 밀도 높은 QA 기간을 보냈습니다. 프론트엔드 개발자는 총 두 명이었고, 저희는 웹과 웹뷰 모두를 처리하였고 저는 카테고리홈·상품 상…
여기어때 컬처 라운지 ep.21 이름은 익숙하지만 얼굴은 생소한 동료가 있으신가요? 아니면 들어본 적은 있지만 어떤 업무를 담당하는지 잘 모르는 팀이 있으신가요? 매일 익숙한 자리에서 늘 같은 팀원들과 먹는 점심은 편안합니다. 하지만 이러한 익숙함이 지속될수록 회사는 서로 잘 모르는 사람들의 집합이 되어가기도 하죠. 한 건물에서, 심지어 같은 층에서 일하면…
글. 정용욱(Eric) / 서비스웹개발팀 항공 프론트엔드 구축기: 폴더 이름 앞의 기호 하나 안녕하세요. 서비스웹개발팀의 에릭입니다. 마지막 편입니다. 폴더 이름 앞의 기호 두 개가 어떻게 규칙이 됐는지 이야기합니다. 그리고 1편에 적어 둔 걱정 다섯 가지에 답하면서 시리즈를 마무리하겠습니다. 이 파일 지워도 되나 해외선 예약 상세 화면을 만들다 보면 파일…
글. 정용욱(Eric) / 서비스웹개발팀 항공 프론트엔드 구축기: 쓰자고 해 놓고 안 썼습니다 안녕하세요. 서비스웹개발팀의 에릭입니다. 이번 편은 상태관리입니다. 프로젝트를 시작하며 전역 저장소를 넣자고 해 놓고, 결국 안 넣었습니다. 그 사이에 판단이 어떻게 바뀌었는지를 적었습니다. 처음에는 필요하다고 봤습니다 프로젝트를 시작하면서 상태관리 라이브러리를…
글. 정용욱(Eric) / 서비스웹개발팀 항공 프론트엔드 구축기: 토큰이 세 군데서 온다 안녕하세요. 서비스웹개발팀의 에릭입니다. 이번 편은 인증입니다. 토큰이 들어오는 길은 환경마다 다른데, 나가는 길은 하나로 모았습니다. 그 사이를 어떻게 메웠는지 적었습니다. 화면이 알고 싶은 건 하나입니다 예약 목록을 보려면 로그인이 필요합니다. 마이페이지도 그렇고,…
글. 변자룡(Jr)/유저혜택개발팀 안녕하세요. 여기어때 유저혜택개발팀 제이알입니다. 요즘 업무에 AI를 활용하지 않는 분은 없을 거라 생각합니다. 다만 사용하는 방식은 다들 제각각이겠죠. 제 경우를 말씀드리면, 집에서는 OpenClaw 같은 개인 비서형 AI를 쓰고 있습니다. 어제 뭘 찾아봤는지, 지난주에 뭘 결정했는지를 기억하고 있다가 오늘 대화에 자연스…
OpenTelemetry + ClickHouse 로 APM 스캐터 차트 만들기 (2) — Grafana 커스텀 패널 글. 박준희(Kuiper) / 숙박플랫폼개선TF팀 1. 들어가며 안녕하세요. 여기어때 숙박플랫폼개선TF팀 박준희(카이퍼)입니다. 1편 에서 OpenTelemetry Collector 로 span 을 받아 ClickHouse 에 쌓는 데까지 다…
OpenTelemetry + ClickHouse 로 APM 스캐터 차트 만들기 (1) — 수집과 저장 글. 박준희(Kuiper) / 숙박플랫폼개선TF팀 1. 들어가며 안녕하세요. 여기어때 숙박플랫폼개선TF팀 박준희(카이퍼)입니다. APM 도구를 써보신 분이라면 이런 화면을 보신 적이 있으실 겁니다. 가로축은 시간, 세로축은 응답시간, 그리고 요청 하나하나가…
글. 신영민(Gladi) / 서비스QA팀 안녕하세요. 여기어때컴퍼니 서비스QA팀 글라디입니다. 오늘은 입사 후 겪은 업무 변화에 대해 이야기해보려고 하는데요. QA라는 직무의 틀은 같지만, 검증 대상, 즉 업무 영역이 바뀐다고 해서 검증 과정이 얼마나 달라지는지 한번 이야기해보겠습니다. 전시 QA는 ‘보이는 것’을 검증하는 일입니다. 화면이 예쁘게 나왔는지…
글. 한동현(Noah) / Product Brand Designer 안녕하세요, 여기어때 플랫폼 디자인팀의 노아입니다. 플랫폼 디자인팀은 여기어때의 프로덕트와 인터널 브랜딩 전반에서 일관된 디자인을 만들어가고 있어요. AI를 활용하면서 비주얼 디자이너가 할 수 있는 일도 점점 넓어지고 있는데요. 이제는 그래픽을 만드는 것을 넘어, 브랜드와 사용자 경험을 일…
글. 안소진(Heidi) / UX Designer 지난 글에서는 여기어때 홈이 가진 문제를 짚고, 카드의 형태보다 각 모듈의 역할을 먼저 정의해야 한다는 방향을 세웠습니다. 이번 글에서는 그 방향을 실제 화면으로 옮긴 과정을 공유합니다. 각 모듈이 고객의 어떤 일을 대신 해줘야 하는지 정의하고, 그에 맞게 6가지의 셀러카드를 변형하고 확장해 나간 이야기예요…
글. 이유정(Yuu) / Platform Designer 홈은 고객이 가장 먼저 마주하는 화면으로, 서비스가 제공하는 다양한 가치를 발견하고 새로운 탐색을 시작하는 공간입니다. 여기어때 역시 홈을 통해 국내 숙소부터 해외 숙소, 항공까지 여러 가지 상품과 혜택을 소개하며 고객에게 폭넓은 선택지를 제공하고 있는데요. 하지만 홈 ATF(Above The Fol…
글. 이예슬(Sophia) / 서비스웹개발팀 안녕하세요. 서비스웹개발팀 소피아입니다. 올여름 국내 숙소 검색에 다중 카테고리 선택과 동적 필터 를 적용하면서, 개발 프로세스 실험을 하나 함께 진행했습니다. QA가 테스트 케이스(TC)를 개발이 끝나기 전에 넘겨주면, 개발자가 그 TC를 실행 가능한 명세로 삼아 자동화하는 방식입니다. 다중 카테고리 선택과 동…
글. Remy(유정인) / 검색플랫폼개발팀 요약: EC2에서 EKS로 옮긴 뒤 두 시간마다 메모리가 500MB씩 튀었습니다. 원인은 로그 gzip 압축과 페이지 캐시였습니다. 안녕하세요. 검색플랫폼개발팀 레미입니다. 토요일 새벽 한 시가 다 된 시각에, 메모리 사용률이 90%를 넘었다는 알림을 받았습니다. 배포한 지 일주일쯤 된 시점이었습니다. 저희 API…
SRE 업무에 AI 녹여내기 — 2편: Alert Adviser로 장애 원인 분석 자동화 글. 구혜준(Hazel) / SRE팀 이 글은 2부작입니다. (1/2) AI는 읽고, 코드는 계산합니다 — Smart RI Calc (2/2) 틀린 걸 없애기보다, 틀린 게 보이게 — Alert Adviser (현재 글) 안녕하세요, 여기어때컴퍼니 SRE팀에서 클라우드…
SRE 업무에 AI 녹여내기 — 1편: Smart RI Calc로 인프라 비용 산정 자동화 글. 구혜준(Hazel) / SRE팀 이 글은 2부작입니다. (1/2) AI는 읽고, 코드는 계산합니다 — Smart RI Calc (현재 글) (2/2) 틀린 걸 없애기보다, 틀린 게 보이게 — Alert Adviser 안녕하세요, 여기어때컴퍼니 SRE팀에서 클라우…
글. 김민승(Miles) / 유저혜택개발팀 안녕하세요. 여기어때 유저혜택개발팀 마일스입니다. “리액티브로 바꿨더니 4배 빨라졌습니다.” 부하 테스트 보고서 초안에 호기롭게 적었던 문장입니다. 하지만 이 보고서는 이후 몇 번이고 고쳐 쓰여야 했습니다. 결국 남은 최종 결론은 처음과 완전히 달랐습니다. ‘4배’라는 숫자의 대부분은 리액티브 아키텍처의 우위가 아…
글. 김민우(Kyle) / 유저혜택개발팀 들어가며 안녕하세요. 유저혜택개발팀의 카일입니다. 이번 글에서는 동시성 문제를 다루면서 직접 겪었던 고민과, 그 과정에서 배운 락과 데드락에 대한 제 생각을 공유해보고자 합니다. 신규 유저가 상품을 구매하고 이용을 완료하면 결제 금액의 일부를 포인트로 지급하는 이벤트를 개발하고 있었습니다. 문제는 한 유저에게 여러…
글. 김민우(Kyle) / 유저혜택개발팀 연차 날의 슬랙 알림 안녕하세요. 유저혜택개발팀 카일입니다. 연차 날 아침이었습니다. 느긋하게 커피를 마시며 오늘 하루를 어떻게 알차게 보낼지 행복한 고민을 하던 참이었습니다. 슬랙 알림 하나가 평화를 깨뜨렸습니다. “쿠폰 복원이 안 돼요. 사용 취소한 쿠폰이 복구가 안 된다고 문의가 계속 들어와요..” 확인하자마자…
여기어때 컬처 라운지 ep.20 여기어때가 좋은 팀원을 만나는 방법은 여러 가지입니다. 공개 채용, 헤드헌팅, 사내추천 등… 그중 ‘사내추천’은 구성원이 함께 일하고 싶은 외부 인재를 직접 추천하는 제도인데요. 업무상 함께한 경험이 있는 동료뿐 아니라, 업계 지인이나 학교 선후배처럼 간접적으로 알고 있는 사람도 추천할 수 있어요. 추천인은 후보자에게 여기어…
글. 문혜승(Pete) / 공통플랫폼개발팀 안녕하세요, 여기어때컴퍼니 공통플랫폼개발팀 피트입니다. 공통플랫폼개발팀은 사내 여러 조직이 함께 쓰는 시스템을 만듭니다. 그러다 보니 하루에도 몇 번씩 이런 Slack DM이 옵니다. “이거 연동하려면 어디에 신청해야 하나요?” “이 에러 전에 누가 겪었던 것 같은데 어디에 정리돼 있나요?” “OO 모니터링은 어디…