우아한형제들만을 위한 브라우저 확장 프로그램 #우아콘2023 #우아한형제들
우아콘 2023 우아한형제들 · YouTube
AI 핵심 요약
사내 GitLab과 Confluence를 쓰면서 하위 메뉴를 찾기 어렵고, 팀별 위키 사이드바가 느리게 뜨는 문제를 해결하기 위해 우아한 웹 툴킷 브라우저 확장 프로그램을 만들었다. GitLab에는 자주 쓰는 하위 메뉴를 고정하는 기능을 더했고, Confluence에는 페이지 트리를 로컬 스토리지에 캐시한 뒤 백그라운드에서 갱신하는 stale-while-revalidate 방식을 적용해 사이드바를 빠르게 표시했다. 여기에 검색, 즐겨찾기, 스티키 스크롤 등의 기능을 추가하고, MJS 기반 빌드 스크립트와 WebExtension API 폴리필로 크롬·파이어폭스 배포를 지원했다. 확장 프로그램은 약 1,000명의 구성원이 사용하게 됐으며, 사내 웹서비스의 불편을 브라우저 확장으로 보완하고 기능을 모듈화해 동료들의 기여를 받는 방법을 보여 줬다.
- 브라우저 확장 프로그램은 웹페이지와 자바스크립트 실행 컨텍스트는 분리되지만 DOM을 공유하므로 기존 서비스의 UI를 보완할 수 있다.
- 느린 데이터를 캐시해 먼저 보여 주고 백그라운드에서 갱신하는 stale-while-revalidate 전략으로 체감 속도를 높일 수 있다.
- 크롬과 파이어폭스용 매니페스트는 공통 MJS 설정과 빌드 스크립트로 생성하면 플랫폼별 차이와 수작업을 줄일 수 있다.
- 브라우저별 확장 프로그램 API 차이는 WebExtension 브라우저 API 폴리필로 흡수할 수 있다.
- 기능별로 콘텐츠 스크립트를 분리하고 매니페스트 생성을 자동화하면 확장 프로그램의 성능 우려와 유지보수 부담을 함께 낮출 수 있다.
소개
[WOOWACON2023 세션 다시보기] 👉 세션 설명 혼자 쓰려고 만들었다가 현재 약 1000명의 구성원이 사용하는 브라우저 확장 프로그램, 우아한 웹 툴킷을 소개합니다.ㅤ ㅤ 👉 발표자 소개 운영도구개발팀 장해민 사내 구성원을 위한 소프트웨어를 디자인하고 개발하고 있습니다. 👍 추천 대상 - 브라우저 확장 프로그램 개발에 관심이 있는 분 🙋🏻♀️ 세션에 대해 궁금한 점이 있다면 dev_relations@woowahan.com 으로 문의주시기 바랍니다.
비슷한 학습 자료
컨퍼런스 우아콘 2023
WOOWACON2023 오프닝노트 - 우아한형제들 CEO 이국환 #우아콘2023 #우아한형제들
컨퍼런스 우아콘 2023
AI 서비스 자동화 공장 만들기 #우아콘2023 #우아한형제들
컨퍼런스 우아콘 2023
[WOOWACON2023 세션 다시보기] 👉 세션 설명 기술을 통해서 경쟁사들보다 한 발짝 더 앞서나가기 위한 우아한형제들의 AI플랫폼을 소개합니다. 품질 좋은 AI 서비스를 빠르게 개발할 수 있는 체력을 어떻게 키우면 좋을까요? MLOps를 포함해 우아한형제들의 AI 서비스 개발 및 운영을 이야기합니다.ㅤ ㅤ 👉 발표자 소개 데이터사이언스팀 유이수 AI 서비스 공장 직원 1입니다. 더 번쩍번쩍한 공장을 만들기 위해 고민하고 있습니다. 데이터사이언스팀 임현호 종합예술인이 되고 싶은 생활체육인 밖구석 개발자 데이터사이언스팀 이준수 데이터사이언스팀을 리드하고 있는 소프트웨어 반지니어 👍 추천 대상 - 빠르게 AI 서비스를 만들고 싶은 분 - AI 서비스를 만드는 데 어려움이 있는 분 🙋🏻♀️ 세션에 대해 궁금한 점이 있다면 dev_relations@woowahan.com 으로 문의주시기 바랍니다.
데브옵스 · 인프라 딥러닝 · 머신러닝
컨퍼런스 우아콘 2023
Preview Deployment: 베타 환경 멀티버스 체험기 #우아콘2023 #우아한형제들
컨퍼런스 우아콘 2023
[WOOWACON2023 세션 다시보기] 👉 세션 설명 큰 힘에는 큰 책임이 따르듯, 큰 팀에는 많은 과제들이 있기 마련이죠. 배민커머스웹프론트개발팀 플랫폼 파트의 이야기입니다. 동시에 여러 가지 과제를 수행하는 팀에게 베타 배포 환경 하나는 너무 가혹합니다. 다급한 목소리로 외치는 "베타 배포 지금 이 브랜치로 나가도 되나요?" 소리가 여기까지 들리는군요. 이들을 구하기 위해 멀티버스 구축 여정에 합류한 n개월 차 새내기 개발자는 과연 무엇을 보고 배웠을까요?ㅤ ㅤ 👉 발표자 소개 배민커머스웹프론트개발팀 김요욱보고 배우는 것이 많아서 하루하루가 즐거운 개발자. 좋은 사람들과 일하는 것에 매일 감사한 마음을 가지고 있습니다. 👍 추천 대상 베타 배포 환경이 몇 개만 더 있었으면 좋겠다고 생각해 본 개발자 직접 배포 인프라 작업을 통해서 생산성을 향상시켜 보고 싶은 프론트엔드 개발자 🙋🏻♀️ 세션에 대해 궁금한 점이 있다면 dev_relations@woowa...
프론트엔드 데브옵스 · 인프라
컨퍼런스 우아콘 2023
[WOOWACON2023 세션 다시보기] 👉 세션 설명 우아한공방으로 새롭게 단장한 디자인 시스템의 계층 구조와 이를 컴포넌트로 빚어낸 과정을 소개합니다. 그리고 컴포넌트 구현에 집중하기 위해 어떤 개발 환경을 갖췄는지, 운영 과정에서 정답이 없는 문제들을 어떻게 다뤄왔는지 공유드릴게요. 앞으로 더 확장해 나갈 디자인 시스템의 미래도 엿볼 수 있어요. ㅤ 👉 발표자 소개 배민커머스웹프론트개발팀 마광휘 배민커머스웹프론트개발팀에서 23명의 엔지니어가 조화롭게 좋은 프로덕트를 만들 수 있도록 팀 문화 고민과 시스템 아키텍처링을 진행하고 있는 챙김이 입니다. 최근에는 배민 전사의 웹 프론트 미래를 그리고 있어요. 배민커머스웹프론트개발팀 이상현 지속 가능한 디자인 시스템을 만들어나가는 프론트엔드 개발자입니다. 👍 추천 대상 - 사내 디자인 시스템을 운영하는 개발자 - 확장 가능하고 유연한 React UI 컴포넌트 구현에 관심 있는 분 🙋🏻♀️ 세션에 대해 궁금한 점이 ...
프론트엔드 UI/UX
컨퍼런스 우아콘 2023
웹프론트 개발자들을 위한 '우아한스펙트럼' 서비스 제작기 #우아콘2023 #우아한형제들
컨퍼런스 우아콘 2023
[WOOWACON2023 세션 다시보기] 👉 세션 설명 배달의민족 웹프론트엔드 개발자들의 기술 공유 플랫폼 '우아한스펙트럼'을 소개합니다. 기획부터 서버, DB, 프론트 모두 프론트엔드 개발자 6명이서 만든, 눈물 없이 들을 수 없는 스토리ㅤ 👉 발표자 소개 셀러웹프론트개발팀 송지은 사회생활 3개월 차 리더가 된 프론트엔드 개발자 사실 본업은 사장님을 위해서라면 어디든 달려가는 배민셀프서비스 개발자 👍 추천 대상 - 우아한형제들 웹프론트개발자들의 기술 공유 방식이 궁금한 개발자 - 사내 사이드 프로젝트를 잘 운영하고 싶은 개발자 🙋🏻♀️ 세션에 대해 궁금한 점이 있다면 dev_relations@woowahan.com 으로 문의주시기 바랍니다.
프론트엔드 백엔드 풀스택
컨퍼런스 우아콘 2023
[WOOWACON2023 세션 다시보기] 👉 세션 설명 Java/Spring 강국인 우아한형제들에 Node.js? JVM에 최적화된 인프라 플랫폼 위에서 Node.js 시스템을 안정적으로 운영하기 위해 어떤 노력을 했는지 공유합니다. 이 세션을 통해 Node.js 시스템의 Observability, Scalability & High Availability를 어떻게 확보할 수 있는지 CI/CD, 모노레포를 어떻게 활용할 수 있는지 노하우를 알아갈 수 있습니다.ㅤ ㅤ 👉 발표자 소개 운영도구개발팀 강동혁 안정성과 생산성을 고려하며 Node.js 백엔드 개발 표준을 밑바닥부터 만들어가고 있습니다. 👍 추천 대상 엔터프라이즈 MSA 환경에서 Node.js(NestJS) 애플리케이션을 운영하는 데 고민이 있는 분 🙋🏻♀️ 세션에 대해 궁금한 점이 있다면 dev_relations@woowahan.com 으로 문의주시기 바랍니다.
백엔드 데브옵스 · 인프라