🎤 함께라면 무엇이든,
웹으로 대동단결!
‘웹단결’ ‘웹잘딱깔센’ ‘웹스윗’ ‘웹모여’ 심지어 ‘웹분열’까지!
리멤버엔 사내 메신저를 온통 ‘웹’이란 단어로 물들이는 팀이 있습니다. 구성원 90%가 I형이지만, 새 프로젝트에 착수하거나 단합을 다질 때만큼은 ‘가보자고!’ 모드로 돌입하는 분들이죠.
“팀의 원동력은 무엇인가요?”란 질문엔 한 사람도 빠짐없이 “원팀 스피릿!”을 외칩니다. 모두 같은 목표를 가졌기 때문만은 아닙니다. 낙오되는 사람 없이 함께 성장하고, 도움이 필요할 때 주저 없이 터놓을 수 있는 심리적 안전감이 더 크고 값진 성장을 가능케 하기 때문입니다.
‘개인의 성장은 더하기지만, 팀의 성장은 곱셈이다’란 철학으로 <나> <우리> <서비스> <회사의 성장>이란 4마리 토끼를 모두 잡고 있는 리멤버 웹 프론트엔드 파트 일곱 분과 이야기를 나눠봤습니다.
📌 Chapter1. 웹은 리멤버의 첫인상이란 마음으로
Q. 안녕하세요, 사내 메신저를 물들이던 ‘웹단결’의 주인공들을 한자리에서 만나게 됐네요! 웹 프론트엔드 파트는 어떤 조직인가요?
용석: 이름처럼 웹 서비스의 가장 앞단에서 유저를 만나는 조직입니다. 채용 관련 서비스를 중심으로 광고, 리서치 등 B2B 사업과 커뮤니티, 나우 등 B2C 서비스를 이루는 모든 웹 페이지 개발을 도맡고 있어요. 또 운영 효율화를 위한 어드민, 리멤버 자체 디자인 시스템 등 리멤버 비즈니스 곳곳에 웹 프론트엔드 파트의 손길이 닿아 많은 임팩트를 내고 있죠.
유저에게 만족스러운 서비스 경험을 드려야 하는데, 유저는 웹을 통해 서비스를 체험합니다. 때문에 신뢰 높은 코드 개발을 최우선으로 하고 있어요. 다양한 프론트엔드 기술로 고객에게 매끄러운 서비스 경험을 선사하고 리멤버 매출에도 기여하는 것, 이것이 저희 팀의 역할이자 존재 이유예요.
Q. 최근 채용 규모가 2배 가까이 늘었어요. 웹 프론트엔드 파트에서는 무엇에 집중하고 있나요?
종택: 현재는 ‘제품 고도화’와 ‘팀워크 확립’ 2가지에 집중하고 있어요. 리멤버는 이미 채용 솔루션을 중심으로 PMF(Product-Market Fit)를 찾았고, 시장 경쟁력까지 입증했습니다. 이제는 본격적인 매출 성장을 위해 가속 페달을 밟아야 하는 단계죠. 강력한 가속을 위해선 그에 합당한 엔진과 연료, 메카닉 팀이 준비돼야 하는데요. 제품 성장에 필요한 개발을 적시에, 좋은 품질로 지원하기 위해 여러 가지 프로젝트에 도전하고 있어요.
예를 들면, 변경에 유연한 코드는 어떻게 짜야 하는지, 보다 빠르게 고객의 에러 상황을 감지해 조치하기 위한 모니터링 시스템은 어떻게 갖춰야 하는지, 제품 전반에 공용으로 쓰이는 코드들은 어떻게 관리해야 하는지 등에 관한 프로젝트입니다.
정민: 웹 프론트엔드 파트의 TO가 거의 2배 규모로 확대되면서 신규 입사자와 함께 안정적인 팀 문화를 만들어나가야 하는 시기라 팀워크 확립을 중요 키워드로 생각하고 있어요. 현재 파트원들은 서로 다른 제품 크루*에도 속해 있는데요. 제품 성장에 집중하느라 기술적으로 소홀했던 부분을 보완하기 위해선 파트원들과 함께 문제를 해결할 수 있는 정비 시간이 필요했는데요. 랠리(Rally)와 피트스탑(Pit-stop) 체제를 새롭게 도입해 집중 주행과 점검 시간을 균형 있게 관리하고 있습니다.
📌 리멤버는 공통 직무자들이 모인 기능 조직과 서로 다른 직무자들이 모여 공동의 목표를 위해 운영되는 목적 조직이 별개로 존재합니다. 후자를 리멤버에선 ‘크루’라고 부릅니다.
몰입과 점검의 10주 레이싱으로
업무 밀도를 높이다
Q. 랠리와 피트스탑, F1 경기에서 들어본 스포츠 용어인 것 같은데요. 이게 어떻게 적용되나요?
용석: 8주의 랠리와 2주의 피트스탑을 거쳐 총 10주간 이뤄지는 업무 사이클인데요. 자동차가 잠시 피트로 들어와 주유, 정비를 마치고 다시 나가는 과정을 떠올리면 더욱 이해하기 쉬우실 거예요. 우선 각 제품 크루와 함께 제품 고도화를 위해 8주간 집중 주행을 합니다. 이후 2주간 파트원끼리 모여 앞선 8주 랠리 기간 축적된 기술 부채를 해결하고, 팀 차원의 합을 맞춥니다. 이 과정을 거친 지난 2달은 이전보다 업무 밀도가 더 높았습니다.
Q. 최근에 웹 프론트엔드 파트에서 진행한 E2E 테스트가 큰 화제였다고요. 어떤 작업인가요?
용석: 최근 2주간은 E2E 테스트(End-to-End) 코드 기반을 구축하고, 관제성 확보를 위한 모니터링 시스템 작업에 집중했습니다. E2E 테스트란 유저가 보는 화면(End)과 서버에서 제공하는 데이터(End)까지 애플리케이션 흐름의 전 과정을 테스트하는 것을 뜻하는데요. 유저가 제품을 사용할 때마다 발생하는 다양한 케이스를 일일이 로그인해 점검하지 않고도 서비스가 잘 돌아가는지 한 번에 확인할 수 있는 시스템을 구현하는 거예요.
서비스 규모가 커지고 고도화됨에 따라 촘촘한 안전망을 갖추는 게 정말 중요합니다. 제품마다 적용되는 정책이 수만 가지라 고객에게 발생하는 변수도 다양한데요. 일일이 확인하지 않는 이상 완전한 안전망을 구축하긴 어려워요. 게다가 테스트 코드 작성이 서비스 안전성과 신뢰를 키울 수 있다는 걸 개발자들도 잘 알고 있지만, 제품이 빠르게 변화해 관리 리소스가 그만큼 크게 발생하기 때문에 이 과정을 거치지 않는 경우도 허다합니다.
저희가 E2E 테스트를 도입한 이유는 유저와 동일한 브라우저 환경에서 테스트하며 그들에게 불필요한 에러가 노출되지 않도록 하기 위해서였습니다. 코드 구축 과정을 통해 제품 전체에 테스트 코드를 작성할 환경을 만들고, 제품의 퀄리티와 사용자 경험을 높이는 테스트 코드를 제작했습니다. 이후 2주 피트스탑 기간엔 각자 코드를 작성하며 얻은 점을 공유하고, 새롭게 알게 된 지식이나 풀지 못한 코드를 함께 풀기도 했어요.
지훈: 또 서비스의 품질 관리를 위해선 어떤 이슈가 발생하는지 빠르게 파악해 대응하는 것도 중요한데요. ‘뉴렐릭’ 시스템에 쌓이는 로그를 통해 배포된 서비스가 잘 운영되는지 확인합니다. 에러 발생 시 어떤 코드에서 발생했는지 추적하기 위한 소스맵(source-map)도 업로드하고, 어느 시점의 배포로부터 발생한 이슈인지를 배포 마커(deploy marker)를 적용해 정확히 잡아내기도 하고요. 덕분에 유저들에게 발생한 에러가 실시간으로 리포팅되면서, 더 빠르고 편리하게 문제를 해결할 수 있게 됐습니다.
📌 Chapter2. 웹이 없다면? 리멤버 서비스도 없다
Q. 리멤버는 기업이 적합한 인재를 찾도록 지원하는 ‘채용 솔루션’을 제공하죠. 웹 프론트엔드 파트가 주력하는 제품이기도 한데요. 해당 제품의 관건이라 할 수 있는 채용 성사율을 높이기 위해 다양한 기능을 개발했다고 들었는데, 가장 유효했던 시도가 있다면 무엇인가요?
정민: 유저들의 반응이 가장 좋았던 시도는 ‘AI 채용 비서’ 프로젝트였어요. AI를 통해 채용에 드는 리소스를 극단으로 줄여 성사율을 높였던 작업인데요. 2가지 핵심 기능 개발에 집중했습니다. 하나는 리멤버 자체 개발 AI를 통해 유저가 직무기술서를 복사·붙여넣기만 하면 적합한 인재를 자동 추천하는 것, 또 하나는 챗GPT를 활용해 제안 보낼 때 필요한 정보(포지션명, 직급, 업무 내용 등)를 자동 추출·생성해 주는 것이었죠.
특히 챗GPT를 써보신 분들은 아시겠지만, 두번째 기능은 서버로부터 완성된 데이터를 전달 받을 때까지 시간이 상당히 오래 걸립니다. 이런 지연은 곧 유저 이탈률 증가로 이어지기 때문에 클라이언트 쪽에서 ‘미리 데이터가 준비되도록 세팅하는’ 방식을 택했습니다. 유저가 직무기술서 내용을 수정하거나 PDF 파일을 변경할 할 때마다 미리 데이터를 준비해 제안 보낼 때 필요한 정보를 만들어 두고, 유저가 제안 보내기 버튼을 클릭하면 기다릴 필요 없이 바로 사용 가능하도록 편의 기능에 초점을 맞춰 개발했습니다.
사소한 변화일 수도 있지만 ‘이렇게까지 신경 썼구나!’라고 유저분들께 감동과 만족을 드리는 게 저희의 역할이라고 생각해요. 이런 진심이 잘 닿아 AI 채용 비서 페이지는 채용 솔루션의 모든 화면 중 제안 발송 비율이 제일 높았고, 기존 인재 검색 페이지 다음으로 높은 수치를 기록 중입니다. AI 모델에서 추천받은 프로필 조회율도 2배 이상 올랐고요.
시도와 폐기의 무한 굴레
최상의 고객 WOW 만든다
Q. ‘채용 공고’ 서비스는 어떤 방식으로 고도화됐나요?
호: 지난 랠리 동안 공고 성사 크루에서는 유저에게 적합하거나, 유저가 지원하고 싶은 공고를 찾기 쉽게 만들어 지원율을 높이자는 목표로 여러 방법들을 시도했어요. AI 모델을 적극 활용해 적합한 공고를 보여주거나 고객 행동을 기반으로 한 맞춤 공고를 보여주는 여러 위젯들을 제공했습니다. 또 유저 조건에 부합하지만 제품에 들어가지 않아 놓친 공고는 CRM을 통해 추천하기도 했죠.
이 모든 과정이 정말 치열했어요. 아무리 사소한 실험이어도 전부 A/B 테스트를 거쳐 유의미한 성과를 보이는 방법들만 남기고, 기대에 못 미치는 시도는 과감하게 폐기했습니다. 치열한 피드백과 무한 테스트 덕분에 기존 데이터 대비 공고 조회와 지원율 등 전반적 수치들이 2배로 오르는 결과를 만들어낼 수 있었습니다. 기획자와 개발자, 디자이너 모두가 능동적으로 참여해 데이터를 분석하고, 의사결정하는 과정이 있어 더 큰 고객 와우를 이끌어낼 수 있었습니다.
Q. 리멤버 서비스의 전반을 지탱하는 파운데이션 크루에 소속된 분도 계시네요. 그곳에선 어떤 프로젝트를 함께 하셨나요?
정원: 저는 ‘리멤버 UI 디자인 시스템 개발’을 전담하고 있어요. 줄여서 RUI라고 부르기도 하는데요. 디자인 시스템은 쉽게 말해 웹 페이지에 들어갈 버튼이나 텍스트 등 ‘컴포넌트’라고 부르는 약속된 디자인 단위를 개발자들이 편하게 가져다 쓸 수 있도록 한 도구입니다. 이전에도 페이지에 삽입되는 버튼이나 텍스트 등 인풋을 모아두는 라이브러리가 있었지만, 확장성이 고려되지 않았기 때문에 새롭게 개선되는 서비스에 맞춰 변형하기 쉽지 않았죠. 웹 프론트엔드 제품을 위한 체계적인 디자인 시스템을 만들어 개발과 관리의 용이성을 높이자는 필요성이 커지면서 본격적으로 만들게 됐습니다.
동료들로부터 RUI 디자인 시스템 도움을 많이 받는다는 피드백을 받았을 때 정말 뿌듯했어요. RUI를 통해 디자이너와 개발자가 좀 더 효율적으로 소통하며 작업할 수 있는 환경을 만들었는데요. 디자이너와 개발자가 생각하는 인터페이스의 간극을 RUI로 맞추면서 통일된 개념으로 추상화해 소통할 수 있게 된 거죠. 디자이너들은 개발자들이 어떻게 구현하는지 신경 쓰지 않아도 되고, 개발자들은 디자이너들의 요청을 빠르게 구현할 수 있어 효율적으로 작업할 수 있습니다. 기능을 만드는 건 쉽지만 다양한 상황에서도 편하게 쓸 수 있는 구조로 만드는 건 쉽지 않거든요. 더 나은 방향으로 개발 환경을 개선할 수 있어 많은 보람을 느꼈습니다.
또 RUI 같은 디자인 시스템을 여러 곳에서 가져다 쓰려면 설치 가능한 ‘라이브러리’ 형태로 포장해줘야 하는데요. 이 과정에서 ‘번들러’ ‘모듈 시스템’ ‘타입스크립트’ 같은 기술들을 잘 다뤄야 합니다. 일반적인 서비스 개발을 하면서는 다룰 일이 잘 없었던 개념들인데 이번 기회를 통해 깊이를 더할 수 있어서 좋았어요.
📌 Chapter3. 어떠한 변화 속에서도 웹단결
Q. 따로 또 같이 일하는 구조에서 파트의 힘을 지키기 쉽지 않을 것 같아요. 단결력을 쌓는 비법이 있나요?
정원: 최근 파트원들끼리 한자리에 모여 일과 일상을 나누는 ‘독서 스터디’를 운영하고 있어요. 각자의 크루에서 맡은 일에 집중하느라 우리만의 웹단결을 지키기 어렵더라고요. ‘우리 이대로 괜찮을까?’라는 생각이 들었습니다. 이 문제를 인지한 구성원들이 부담 없이 참여할 수 있는 세션을 만들자는 결론을 내렸고, 여러 파일럿 프로그램들 중 첫번째로 시도하는 게 독서 스터디입니다.
독서 토론을 하다 보면 의견 차이가 발생하기도 하는데요. 그 차이로 서로를 더 파악하고, 관점 차이에서 나오는 새로운 인사이트를 발굴하는 계기가 됐어요. 이런 과정들이 자연스럽게 우리 파트의 좋은 문화를 만들어가는 데 꼭 필요한 과정이라고 생각해요.
Q. 함께 공부한 내용 중 실제 업무에 적용된 사례도 있나요?
내일이면 레거시가 되는 코드,
새로운 기술로 변주를 주다
종택: 작년 말 도입한 ‘얀 베리(Yarn Berry)’라는 패키지 매니저가 있어요. 작성된 코드가 유저에게 전달되려면 중간에 빌드라는 과정을 거쳐야 하는데요. 이 빌드 시간을 단축시켜주고 개발 과정에서의 안정성을 높여줄 수 있다는 점에서 이 기술에 처음 관심이 생기게 됐어요.
더욱이 웹 프론트엔드 분야에서 Yarn은 대중적으로 쓰는 패키지 매니저인데요. 구버전 Yarn은 잘 쓰여왔지만 더 이상의 기능 추가나 유지 보수가 제공되지 않을 것이라는 공지가 있었어요. 이 부분에 대한 고민이 있었고, 또 내부적으로도 배포 성능을 개선해야 할 필요성을 느껴 도입하기로 결정했죠.
결과적으로 개선된 빌드 시간은 프로젝트마다 차이가 있지만, 평균 1분 정도의 시간이 단축됐습니다. 경우에 따라 5분30초에서 1분50초까지 약 70%의 시간이 줄어들기도 했죠. Yarn Berry를 도입하는 과정은 지난했지만, 새로운 기술에 도전할 수 있도록 내부적으로도 지원해주신 덕분에 개발자들이 더 좋은 환경에서 일할 수 있도록 개선할 수 있었습니다.
해당 도입기를 테크 블로그에 기록하기도 했는데요. 공개된 이후 프론트엔드 영역에서 바이럴이 됐어요. Yarn Berry를 도입한 다른 기업들로부터 저희 글 덕분에 도움을 많이 받았다는 연락을 받기도 했죠.
Q. 구성원 모두 파트 애정이 각별한 것 같습니다. 프론트엔드 파트라서 좋은 점은 무엇일까요?
성장의 자양분은
서로에게 있다
호: 프론트엔드 개발은 기술 발전의 속도가 정말 빠른 직군입니다. 프론트엔드는 열심히 익힌 기술이 금방 레거시가 돼 버리는 영역이기에 끊임없는 관심과 노력이 필요한데요. 혼자서 하기 어려운 배움을 파트원들과 함께 할 수 있어요. 개발자로서의 역량과 성장의 양분이 서로에게 있죠. 업무를 통해서든, 개인 공부를 하든 새롭게 얻은 지식이 있다면 누구든 적극적으로 지식을 공유하며 성장할 수 있는 좋은 동료들이 있다는 게 저희 팀의 가장 큰 매력이 아닐까 합니다.
무엇이든 말할 수 있는
빌런 청정 구역
종택: 특히, 저희 팀은 ‘심리적 안전감’을 소중하게 지켜가고 있어요. 소소한 지식이든, 솔직한 의견이든 무엇이든 공유가 잘 되는 환경을 만들기 위해선 목소리를 낼 때 안전감을 느끼는 게 중요합니다. 그리고 이 심리적인 안전감은 모두의 노력이 필요하죠. 이러한 측면에서 저희 팀을 포함한 저희 회사의 장점을 꼽자면, ‘빌런 청정 구역’이라는 점입니다. 이 문화를 유지하기 위해 채용 컬처핏에서 꽤 높은 기준을 잡고 있습니다.
Q. 온보딩 프로세스도 상당히 디테일합니다. 웹 프론트엔드 파트에 적응하며 가장 도움 받은 건 무엇이었나요?
먼지 쌓인 코드도
오늘처럼 사용할 수 있게
진아: 가장 큰 도움을 준 건 ‘문서’였습니다. OT 자료부터 모든 업무가 상세히 문서화돼 있어 공부하기 쉬운 환경이었어요. 이전 개발 관련 히스토리가 기록돼 있으니 동료가 부재하거나 오래전 개발된 코드일지라도 손쉽게 만질 수 있죠. 얽히고설킨 코드를 건드려야 할 때 리스크도 줄고요. 촘촘한 문서 작업을 통한 비동기 소통 방식 덕분에 질문에 대한 부담 없이 스스로 업무 히스토리를 파악하는 데 큰 도움을 받았어요.
한 사람만을 위한
온보딩 프로세스
정원: 웹 프론트엔드 파트 온보딩의 또 한 가지 특징은 ‘맞춤형’으로 진행한다는 점이에요. 한 분 한 분을 신중히 모신 만큼, 그분이 잘 적응할 수 있도록 상황과 사람에 맞춰 최적의 온보딩 프로세스를 맞춰가는 거죠. 리멤버 각 서비스와, 해당 서비스를 이루는 코드를 익히는 과정을 거친 후 바로 실제 업무에 투입할지, 혹은 가상의 프로젝트를 수행하면서 조금 더 기술을 익혀가는 기간을 가질지 입사자와 함께 논의하며 충분한 시간과 기회를 드리고 있어요.
이처럼 코드 컨벤션을 맞추는 과정을 통해 개인이 활용하는 코드 언어와 회사가 사용하는 코드 언어 간의 합을 맞춥니다. 그래야 어떠한 업무에도 수월하게 투입될 수 있고, 의사소통 때도 이질감을 느끼지 않을 수 있어요. 온보딩을 통해 관계의 컨벤션을 맞추는 거죠.
Q. 마지막으로 웹 프론트엔드 파트의 미래가 궁금합니다. 이 파트를 어떻게 꾸려가고 싶으신가요?
믿을 수 있는 코드만이
모두를 웃게 한다
정민: 지금 웹 프론트엔드 파트는 단순 기능 개발을 넘어, 제품과 업무를 효율화할 수 있는 영역에 도전하고 있습니다. 당분간은 각 크루별 피트스탑 기간에 레거시 요소가 많은 코드를 개선하거나, 기술적인 부채들을 처리하며 제품 고도화에 집중할 계획입니다. 끊임없는 문제 정의와 개선 과정을 통해 코드에 신뢰성을 주는 게 최우선으로 해결돼야 개발자도 작업 효율성을 높일 수 있고, 사용자는 만족스러운 서비스 경험을 얻을 수 있으니까요.
무엇보다 치열한 랠리 속에서도 틈틈이 팀과 팀원들이 성장할 수 있는 방안들을 파트원들과 마련해보려 합니다. 업무도, 규모도 변화의 시기를 겪고 있지만 웹 프론트엔드 파트가 흔들리지 않고 나아갈 수 있는 힘은 결국 파트원들에게 있어요. 기승전 웹단결! 개발 역량도, 팀워크도 놓치지 않는 단단한 웹 프론트엔드 파트로 나아가고 싶어요.
프로페셔널 네트워크 서비스, 리멤버와 함께
일하는 세상을 혁신하는 웹 개발자가 되고 싶다면? ▶ 공고 보러가기