테크블로그 10

카카오페이지는 BFF(Backend For Frontend)를 어떻게 적용했을까?

요즘 MSA(Micro Service Architecture)를 많이 사용하게 되는데, 개발하다 보면 다음과 같은 상황들이 펼쳐질 수 있습니다. 여러 플랫폼(Web, Android, iOS …)을 지원하게 되면서 각각 특정 데이터가 필요한 상황 원하는 데이터 형태에 도달하기 위해 여러 API 호출의 응답을 조작, 혼합, 일치시키는 상황 이런 상황들이 겹쳐 프론트엔드에서 복잡한 계산이나 비즈니스 로직을 작성하는 상황 코드 베이스가 커지고 복잡해짐에 따라 정리하기가 어려워지고, 그때쯤이면 코드 베이스가 통제 불능 상태가 되며 버그가 숨어 있는 복잡성을 발견하게 됩니다. 특히 프론트엔드에서 복잡한 계산을 수행하는 경우 렌더링이 느려질 수 있습니다. UI 스레드에서 렌더링과 비즈니스 로직 수행이 경합을 벌이기 ..

Tech 2022.09.26

HTTP/2 훑어보고 AWS에 적용해보기

최근에 몇몇 팀원 분들과 HTTP/2 프로토콜에 대해 스터디를 진행하고 있는데요. HTTP/2 적용 방법에 대해 조사하다 보니 AWS 몇몇 서비스에서 별도 작업 없이 간단한 설정만으로 HTTP/2를 적용할 수 있다는 것을 알게 되었습니다. 이 글에서는 HTTP/2가 HTTP/1의 어떤 문제들을 해결해 주는지 간단히 알아보고 AWS의 CloudFront와 Application Load Balancer에서 HTTP/2를 적용하는 방법에 대해 소개합니다. HTTP/1 1991년에 처음 세상에 나와서, 1999년에 1.1 버전이 나온 이후로 버전업 없이 20년을 넘게 쓰여왔습니다. 하지만 요즘의 웹 환경은 HTTP/1이 처음 나온 그때와는 많이 달라졌는데, 1996년도 Yahoo 메인 페이지 용량이 34KB 정..

Tech 2022.05.31

GitHub Actions에서 도커 캐시를 적용해 이미지 빌드하기

최근 카카오웹툰은 도커 이미지를 만들어 Amazon ECR[1]에 올리는 방식으로 배포 방법을 바꿔나가고 있습니다. Dockerfile을 만들어서 GitHub에 올려두고, GitHub Actions로 docker build와 push를 진행하는 방식이죠. 그런데 몇 번 배포를 하다 보니, 변경된 내용이 거의 없는데도 빌드 시간이 전혀 줄어들지 않는다는 것을 발견했습니다. 분명 로컬에서는 같은 상황일 때 첫 번째 빌드보다 두 번째 빌드할 때 더 빨랐거든요. 그때는 몰랐습니다. GitHub Actions를 이용해 빌드할 때는 도커 캐시가 동작하지 않는다는 사실을요. 도커 레이어와 캐시 들어가기에 앞서 도커 빌드 속도에 영향을 미치는 레이어(layer)와 캐시(cache)에 대해 알아보겠습니다. 도커 이미지는..

Tech 2022.05.31

Test Code Why? What? How?

안녕하세요~ 카카오엔터테인먼트에서 백엔드 플랫폼을 개발하고 있는 Jace입니다. 작금의 시대에 소프트웨어는 산업 전반적으로 다양한 영역에서 다양한 요구사항에 의해서 만들어지고 사용되고 있으며 당연하게도 이런 소프트웨어는 요구사항대로 잘 작동하는지 다양한 방식으로 검증하게 됩니다. 이런 검증 방식 중엔 개발자가 직접 작성하고 관리하는 Test Code가 포함되어 있으며 Test Code의 중요성은 별도로 설명하지 않아도 우리는(개발자) 이미 잘 알고 있습니다. 제가 지금껏 만나본 그 어떤 개발자도 Test Code가 중요하지 않다고 말하는 개발자를 본 적이 없습니다. 이처럼 대다수의 개발자들은 Test Code의 중요성과 필요성에 대해서 인지는 하고 있긴 하지만 아이러니하게도 많은 수의 개발자들이 이런저런..

Tech 2022.05.17

카카오엔터테인먼트 CTO 부문만의 특별한 문화! 신규 입사자 간담회 🗣 💬

안녕하세요 •ᴗ• 카카오엔터테인먼트 Tech HR 담당자 Selian입니다! 테크 블로그를 개설하고 그동안 신입 개발자들의 이야기를 많이 들려드렸는데요, 오늘은 카카오엔터테인먼트에 경력직으로 입사한 뉴 크루들의 소식을 전해보려 합니다. 신규 입사자 간담회가 진행되었던 2022년 2월 9일로 잠시 돌아가보시죠 ─=≡Σ=͟͟͞͞=͟͟͞͞=͟͟͞͞=͟͟͞͞=͟͟͞͞=͟͟͞͞=͟͟͞͞ 🗓💡🚀 신규 입사자 간담회란 무엇인가요? : 카카오엔터테인먼트에서는 매달 CTO 부문에 합류하신 신규 입사자분들을 대상으로, CTO 마커스 & 기술기획팀과 함께 이야기를 나눌 수 있는 간담회 자리를 마련하고 있습니다. STEP 1 자기소개를 부탁해요~ 띵 동 - 📨 2022년 1월에 카카오엔터테인먼트 CTO 부문으로 입사하신 뉴 ..

Events 2022.04.01

카카오웹툰은 GitHub Actions를 어떻게 사용하고 있을까?

안녕하세요. 카카오웹툰 프론트엔드를 개발하고 있는 레이입니다 :) 카카오웹툰은 GitHub을 이용해 코드를 관리하고 있습니다. 그리고 자연스럽게 GitHub Actions를 사용하고 있는데요, 카카오웹툰은 어떤 식으로 GitHub Actions를 사용하고 있는지 간략하게 소개하겠습니다. 직접 따라하는 예제 2개와 눈으로만 보는 예제 2개를 준비했어요. 코드가 어려우실 수도 있지만 천천히 주석을 읽으며 따라오시면 잘 이해하실 거라 믿습니다. 그럼 시작하겠습니다! GitHub Actions란? GitHub Actions의 도큐먼트를 보면 GitHub Actions는 CI/CD와 같은 workflow를 자동화 할 수 있는 도구라고 설명되어 있는데, 쉽게 말해 GitHub 내 어떤 이벤트(push, pull, ..

Tech 2022.03.23

[2022 신입공채] 카카오엔터테인먼트 신입 개발자로서의 첫걸음👣 테크 온보딩 프로그램 살펴보기 #2

안녕하세요 •ᴗ• 카카오엔터테인먼트 Tech HR 담당자 Selian입니다! 테크 온보딩 1편에 이어, 2편으로 다시 찾아왔습니다. 넘치는 사진과 내용으로 분량 조절에 실패하였지만 (흑흑💦) 우리 신입 개발자 크루들의 소중한 모든 날 모든 순간, 그 어떤 하나라도 놓칠 수 없기에 이곳에 모두 내려놓고 가겠습니다. 그럼 바로 시작합니다~ #1 ✔︎ 오리엔테이션 ✔︎ 직무/그룹 소개 ✔︎ 컨플루언스/지라 교육 #2 ✔︎ IT플랫폼 교육 ✔︎ 비대면 액티비티 ✔︎ 토이 프로젝트 🏷 IT플랫폼 교육 It platform training 카카오엔터테인먼트가 가진 모든 서비스의 보안/인프라를 담당하는 "IT플랫폼그룹"의 교육이 진행되었습니다. IT플랫폼그룹은 전사 IT 예산을 관리하고, 정보보안 체계를 수립하고, ..

[2022 신입공채] 카카오엔터테인먼트 신입 개발자로서의 첫걸음👣 테크 온보딩 프로그램 살펴보기 #1

안녕하세요 •ᴗ• 카카오엔터테인먼트 Tech HR 담당자 Selian입니다! 카카오 7개 공동체가 함께 진행했던 2022 kakao blind recruitment를 통해 총 19명의 신입 개발자분들이 카카오엔터테인먼트 크루가 되었습니다. (높은 경쟁률을 뚫고 최종 합격의 기쁨을 얻은 여러분의 입사를 축하합니다~🎉) 신입 개발자 크루로서 첫걸음을 잘 내딛을 수 있도록 제가 속한 기술기획팀에서 Tech Onboarding을 준비했는데요, 한 달 동안 어떠한 프로그램을 거쳐 카카오엔터테인먼트 CTO 조직에 적응하게 되었는지 궁금하시죠? 📷 생생한 현장 스케치를 통해 테크 온보딩을 소개해드리겠습니다. #1 ✔︎ 오리엔테이션 ✔︎ 직무/그룹 소개 ✔︎ 컨플루언스/지라 교육 #2 ✔︎ IT플랫폼 교육 ✔︎ 비대면..

http프록시로 mitmproxy를 사용해보자.

안녕하세요, 카카오엔터테인먼트에서 백엔드 개발을 하고 있는 Andy입니다. 오늘 제가 공유드릴 주제는 'https 프록시로 mitmproxy를 써보자.'인데요~ mitmproxy가 사용해보니 너무 좋아서 다른 분들도 많이 활용해보시길 바라는 마음으로 시작해보겠습니다. http 프록시로 익숙한 찰스를 써보려고 했지만, 구매가 까다롭다고 하여 요 녀석(mitmproxy)을 써보기로 했습니다. 📍 준비물 안드로이드 스튜디오, 안드로이드 SDK 💬 준비물들은 안드로이드 가상 디바이스를 만들기 위해서 필요합니다. 가상 디바이스를 만들고 나서 앱을 빌드한 다음부터는 emualtor 명령어로 켜면 됩니다. ⚠️ 주의 안드로이드 가상 디바이스를 만들 때는 play store 딱지가 없는 녀석으로 해야 proxy설정이 ..

Tech 2022.03.07

프론트엔드와 THE TWELVE-FACTOR APP

안녕하세요, 카카오엔터테인먼트에서 FE개발하고 있는 스티브입니다 🙂 저는 12Factor 를 저희 서비스의 FE 영역에서 어떻게 이해하고 적용했는지 써볼까 합니다. 저희가 사용하고 있는 프레임워크인 Next.js 위주로 작성되었지만 원칙에 대한 내용이기 때문에 다른 기술을 사용 중이어도 도움이 될 거라 생각합니다. The Twelve-Factor app 혹시 12Factor를 들어보셨나요? (이따금 FE개발자들에게 물어보지만 한 명도 몰랐던…) 12Factor(The Twelve Factors. 이하 12Factor)는 직역하면 12가지 요소를 뜻하지요. 그럼 어떤 것을 위한 12가지 요소일까요? 공식 웹사이트에 잘 설명되어있지만 제가 이해한 대로 한 줄 요약하면 독립적인 애플리케이션 운영을 위한 12가..

Tech 2022.03.07