Outsider's Dev Story

Stay Hungry. Stay Foolish. Don't Be Satisfied.

기술 뉴스 #226 : 23-07-16

웹개발 관련

  • React Server Component 와 SSR 함께 공부해보기 : React의 RSC와 SSR을 명확히 이해하기 위해 정리한 글이다. React의 컴포넌트 구조상 API 호출하면서 폭포수 구조가 만들어지고 성능 저하가 발생하게 되는데 이를 해결하기 위해 React Server Component가 만들어졌다. 서버에서 실행되는 컴포넌트이므로 서버에서 바로 데이터를 가져올 수 있고 클라이언트의 폭포수 구조도 줄이고 클라이언트에 제공하는 번들 사이즈도 줄일 수 있다. 이에 따라 컴포넌트는 서버, 클라이언트, 공용 컴포넌트로 나누어지게 되고 컴포넌트마다 제약사항을 가지고 있다. SSR은 HTML을 서버에서 만들어 주고 클라이언트에 내려주면 JavaScript가 실행되는 구조이지만 RSC는 비슷한 구조이지만 이후 동작에 따라 컴포넌트 단위로도 계속 클라이언트에 내려줄 수 있게 된다.(한국어)
  • 코드앤버터로 프로덕션 환경에서 우아하게 팝업 관리하기 : 웹사이트에는 팝업이 필요한 경우가 있는데 단순하지만 어느정도 기능 구현에 시간을 써야하고 PO/PM이 직접 관리하게 하려면 더 많은 개발이 필요했기에 프로젝트에서 직접 구현하기 보다는 노코드 팝업 솔루션인 코드앤버터를 도입한 후기이다. WYSIWYG 에디터로 쉽게 만들어서 팝업을 관리할 수 있었고 요청사항도 2주만에 만들어 주어 아주 만족해서 사용하고 있다고 한다.(한국어)
  • Introducing the Vercel Platforms Starter Kit : Vercel을 이용해서 커스텀 도메인을 가진 멀티 테넌트 앱을 만드는 풀 스택 템플릿을 Vercel에서 공개했다.(영어)

그 밖의 개발 관련

  • Introducing passwordless authentication on GitHub.com : GitHub이 패스워드 없이 로그인할 수 있는 passkeys를 지원하기 시작했다. 현재는 Feature Preview 상태라 설정에서 활성화해야 사용할 수 있다. 활성화하면 설정에서 디바이스의 생체인증 등 다수의 Passkey를 추가할 수 있고 여러 기기에서 로그인할 수 있도록 모바일 기기를 Passkey로 등록하면 동기화되어 다른 기기에서도 안전하게 바로 로그인할 수 있다.(영어)
  • Inside GitHub: Working with the LLMs behind GitHub Copilot : GitHub에서 Copilot을 어떻게 만들고 개선해 왔는지를 설명한 글이다.(영어)

    • 이전에도 범용 코드 생성에 관해서 얘기하고 있었지만 불가능하다고 얘기했었다가 2020년 6월 OpenAI가 GPT-3를 출시하면서 모든 게 바뀌었다.
    • OpenAI에서 API를 테스트하면서 코드 스니펫을 생성하는 프로토타입을 만들고 IDE에 넣기로 결정하ㅣ면서 GitHub Copilot을 만들기 시작했다.
    • 처음 받은 모델은 Python 전용 모델이었지만 그다음에는 JavaScript 모델을 받고 여러 언어를 지원하는 모델을 제공받았다.
    • 2021년 OpenAI와 파트너십을 통해 GPT-3에서 파생되어 코드를 학습한 Codex 모델을 출시했다.
    • 모델은 강력했지만, 사용자에게 좋은 결과를 제공하기 위해서는 개선이 필요했고 현재 편집 중인 파일만이 아니라 더욱 정확한 결과가 나오도록 추가 컨텍스트를 제공하는 것이 필요했다.
    • 편집기 탭에서 유사한 텍스트를 가져오게 한 뒤에 수락률이 많이 증가했고 파일명이나 확장자를 통해 결과를 더 개선할 수 있었다.
  • GitHub merge queue is generally available : GitHub의 머지 큐 기능이 모두가 이용할 수 있게 공개되었다. Pull Request를 쓸 때 다른 PR이 머지되면 다시 rebase 등의 액션을 해야 하므로 활발하게 다수가 작업하는 저장소에서는 Pull Request 쓰면서 먼저 머지하려고 하거나 비효율이 발생하게 된다. 머지 큐는 이런 문제를 해결하기 위한 기능으로 베이스 브랜치와 최근 변경 사항과 머지큐에 있는 다른 변경 사항까지 고려한 임시 브랜치를 만들어서 CI에서 확인하며 순서대로 바로 머지되도록 할 수 있다. 머지에 실패하면 큐에서 빠져서 알림을 주게 되고 이 기능을 쓰려면 설정에서 머지 큐를 활성화해야 한다.(영어)
  • 5일 완성 1인 프로젝트! 기획부터 프론트엔드, 백엔드, 앱, 관리페이지까지 : 호캉스를 가기 위한 정보를 찾는 불편을 해소하기 위해 호캉스 서비스를 만들면서 기획부터 만들기까지 5일이 걸렸다고 한다. Supabase로 백엔드를 구성하고 Next.js로 프론트엔드를 만들어서 Cloudflare Pages에 배포하고 react-native-webview로 안드로이드 앱을 만들고 retool로 관리페이지를 만들었다고 한다.(한국어)

인프라 관련

  • I use GitHub Actions for Datadog's Service Catalog, and you should, too : Datadog에 등록된 각 서비스의 담당팀, 슬랙, 문서 등의 정보를 관리할 수 있는 서비스 카탈로그의 내용을 업데이트하기 위해서 직접 만든 Datadog Service Catalog Metadata Provider GitHub Actions를 활용하는 방법을 설명한다. 각 저장소에서 워크플로우를 설정해서 바로 Datadog에 정보를 업데이트할 수 있고 GitHub의 org 밑에 규칙 파일을 두어 division 태그를 필수로 검사하거나 유효한 division만 사용하게 한다든지 하는 조직적 관리 방법도 같이 설명한다.(영어)
  • Enhance SBOMs with runtime security context using Datadog Application Vulnerability Management : SBOM을 Datadog에 연결해서 취약점 분석을 어떻게 개선할 수 있는지 설명한다. 소프트웨어 자재 명세서인 SBOM은 업계에 많이 퍼지고 있고 SPDX, CycloneDX 등 표준도 있지만 정적인 문서이기 때문에 컨테스트 없이는 정보가 부족하고 쿼리할 수 없고 서로 연결할 수 없다는 한계가 있다. SBOM을 Datadog에 연결하면 해당 취약점이 실제로 프로덕션 워크로드에서 실행 중인지 아닌지를 파악할 수 있고 Datadog에서 쿼리할 수 있고 관련 취약점에 대한 정보를 연결해 준다.(영어)
  • Terraform apply as code: The multispace pattern : Terraform에서 리소스를 작게 나누어서 워크스페이스 단위로 관리하는 게 일반적인데 이렇게 하면 워크스페이스 간에 의존성이 생긴다. Terraform Cloud에서는 run triggers라는 기능을 제공해서 업스트림 워크스페이스에서 apply가 되면 다운스트림 워크스페이스에서 apply가 실행되도록 할 수 있다. 하지만 이보다 복잡한 트리거를 위해 Terraform Cloud/Enterprise에서 사용할 수 있는 tfe_workspace_run를 Mitchell Hashimoto가 초기 구현 후 실제 기능으로 통합되었다. 이를 이용하면 Terraform 구성해서 다른 워크스페이스 간의 실행 의존성에 다양한 조건을 넣어서 연결할 수 있다.(영어)
  • Announcing Istio's graduation within the CNCF : Istio가 CNCF의 졸업 프로젝트가 되었다.(영어)

볼만한 링크

  • 앱스토어 1위 후 DAU가 10토막이 나버렸고 대표는 빚이 생겼다 : 전에 skrr라는 서비스를 소개한 적 있는데 비슷하게 Gas라는 해외 서비스를 카피한 Hype란 앱을 만들고 앱스토어 1위까지 갔지만 비용 등 어떤 어려움이 있었는지를 정리한 글이다. 이후 DAU는 줄어들었지만, 비슷한 실험은 계속할 예정이라고 한다.(한국어)
  • On Becoming a VP of Engineering : honeycomb의 Emily Nakashima가 VP of Engineering이 되면서 VPE가 되기까지의 경험을 정리한 글이다.(영어)

    • Part 1: The Path to VP

      • VPE는 회사 문화와 정책에 영향을 끼치고 회사 외부로도 파급되는 경우가 많다.
      • 초기에는 Charity Majors가 모든 직원을 관리했지만 일하면서 Charity Majors와 철학적으로 일치하는 부분이 많다는 것을 느꼈다.
      • Charity Majors는 인프라와 DB, 백엔드에 경험이 많은 반면 Emily는 디자인, 프론트엔드, 제품에 더 경험이 많았다.
      • honeycomb가 성장하며 관리 업무가 증가하면서 Charity와 업무를 나누어서 자신에게 더 잘 맞는 분야를 맡아서 하게 되었다.
      • VPE가 되기에 도움이 되었던 특정은 전체를 생각하는 점과 제너럴리스트, 다양한 수준의 추상화, 지나친 책임감, 인적 시스템과 기술적 시스템의 동등한 관심, 팀원 성장의 기쁨 등이 있었다.
      • 또한 도움 된 업무 영험을 다양한 규모 스타트업의 경험과 프론트엔드 중심이지만 스택 전반에 걸쳐서 작업했던 경험, 개발 도구와 모니터링의 경험을 꼽았다.
      • 프론트엔드 출신 VPE는 적은데 이는 스타트업이 보통 백엔드 아키텍처 관련 문제가 시급한 경우가 많기 때문이고 honeycomb에서는 해당 분야에 좋은 IC들이 있었기 때문에 오히려 제품 전략 쪽이 더 중요했기 때문이라고 한다.
    • Part 2: Doing the Job

      • Charity가 "디렉터가 회사를 운영한다"라는 말을 했는데 이는 임원이 어떤 역할인지를 고민하면서 나온 말이다.
      • 이전에는 엔지니어링을 잘 운영하는 것이 최우선 순위였지만 이제는 달라져야 했다.
      • 경영진 차원의 조율에 많은 시간을 써야 했고 이는 팀원에게는 보이지 않은 일이다.
      • 경영진은 회사가 어디로 가고 있는지에 대한 공유된 맥락을 가지고 있어야 하고 이러한 결정을 팀원들에게 설득하고 팀원들의 궁금증을 해소해 주어야 한다.
      • 어떤 일을 하기 위해서 혼자 희생하는 영웅적인 일을 하기도 했지만, 이는 오히려 팀에 안 좋다는 것을 깨달았다.
      • VPE가 되면서 여유가 필요할 것으로 예상했지만 실제로 해보니 예상보다 훨씬 더 여유 시간을 확보하는 것이 도움이 된다는 것을 알게 되었다.
  • (번역) 주니어가 되는 것을 그만두세요. : Kent C Dodds의 Stop Being a Junior를 번역한 글이다. 회사에서 주니어라고 부르고 본인도 주니어라고 생각할 수 있지만 기술의 발전을 빠르기 때문에 새로운 기술에 대해서는 새로 시작한 사람이 더 빠른 시간안에 높은 수준까지 올라갈 수 있다. 너무 나서는 건 좋지 않지만, 적극적으로 기회를 요청하고 동료들에게 예의를 갖춰서 더 많은 기회를 가져서 주니어라는 타이틀을 벗으라고 한다.(한국어)

IT 업계 뉴스

  • Red Hat’s commitment to open source: A response to the git.centos.org changes : 2020년 Red Hat이 RHEL 호환 커뮤니티 버전 리눅스인 CentOS의 릴리스를 중단하고 공개한 CentOS Stream을 최근 RHEL의 유일한 리퍼지토리로 만들고 git.centos.org에는 더는 푸시안한다고 발표했다. 이에 대해 커뮤니티에서 반대 여론이 크게 형성되자 이에 대해 입장을 설명한 글이다. Red Hat은 RHEL을 다시 빌드해서 재배포하는 리빌더의 가치를 더는 찾을 수 없고 다양한 리눅스 배포판이 있지만 다른 리눅스와 완벽하게 호환한다고 주장하는 배포판은 없고 이러한 RHEL 호환 배포판은 오히려 RHEL에 오히려 위협이 되고 오픈소스에도 위협이 된다고 얘기하고 있다.(영어)
  • Keep Linux Open and Free—We Can’t Afford Not To : IBM이 6월 21일 RHEL의 소소 코드를 공개적으로 배포하지 않기로 한 결정에 대해 비판했다. 오라클도 RHEL의 호환 배포판인 Oracle Linux를 관리하고 때문이기도 한데 IBM은 엔지니어에게 돈을 지불하기 위함이라고 하지만 실제로는 Rocky Linux나 AlmaLinux라는 경쟁자를 제거해서 수익을 내려는 목적이라고 하고 있다. 그동안 Oracle Linux가 RHEL과 호환되도록 노력해 왔는데 이제 소소 코드에 접근이 어려워져서 호환성 문제가 커질 가능성이 있다고 얘기하며 IBM이 개발자에게 비용을 지불하고 싶지 않으면 Oracle이 비용을 부담할 테니 Oracle Linux의 다운스트림 배포자가 되라고 도발적으로 얘기하고 있다.(영어)
  • 에버노트, 미국 인력 다수 해고 후 유럽 이전 : 수익성 악화로 129명을 해고한 지 6개월도 안 된 Evernote가 미국의 인력을 대부분 해고하고 유럽으로 이전할 계획이라고 한다.(한국어)
  • Twitter Accuses Meta of Poaching Employees to Build Threads : Meta에서 새로 만든 Threads 앱에 관해 Twitter의 변호사가 영업 비밀과 지적 재산에 대한 불법적 고용을 고발하는 서한을 Meta에 보냈다.(영어)

프로젝트

  • Hatchful : Shopify에서 제공하는 무료 로고 생성 페이지.
  • workflow-telemetry-action : GitHub Actions의 워크플로우를 모니터링하기 위한 액션이다. CPU 부하, 메모리, 네트워크 I/O, Disk I/O 메트릭을 수집한다.
  • S3 Files : S3 스토리지를 위한 맥용 클라이언트
  • driver.js : 웹 사이트의 특정 부분을 하이라이트 하면서 투어할 수 있게 만들어 주는 라이브러리.

버전 업데이트

2023/07/16 20:18 2023/07/16 20:18