Outsider's Dev Story

Stay Hungry. Stay Foolish. Don't Be Satisfied.
RetroTech 팟캐스트 44BITS 팟캐스트

기술 뉴스 #230 : 23-09-16

웹개발 관련

  • Making Sense of React Server Components : React Server Components에 관해 설명하는 글인데 강의를 많이 해봐서 그런지 이해하기 쉽게 자세히 설명한 글이다. RSC를 설명하기 전에 SSR과 하이드레이션 과정을 그림과 함께 설명하고 RSC라는 아이디어가 한 번에 서버 데이터까지 채워서 내려주어서 성능을 개선하려고 했다는 부분을 이해하기 쉽게 알려준다. 그래서 서버 컴포넌트를 서버에서 한 번만 렌더링 되고 RSC를 사용할 수 있는 방법은 Next.js 13.4+에서 App Router를 쓰는 방법뿐이라고 한다. RSC에서는 모든 컴포넌트가 서버 컴포넌트라고 가정하기 때문에 클라이언트 컴포넌트는 'use client' 디렉티브를 써서 옵트인 해야 하고 이를 사용하면 클라이언트 바운더리가 생겨서 하위 컴포넌트는 모두 JS 번들에 포함되어 전송됩니다. 왜 이 경계를 따로 설정해야 하는지와 모든 컴포넌트가 클라이언트 경계에 포함되지 않도록 관리하는 방법도 소개한다.(영어)
  • v0.dev by Vercel Labs : Vercel Labs에서 프롬프트를 입력하면 UI 컴포넌트를 생성해 주는 서비스로 현재 프라이빗 알파로 승인을 받아야 사용할 수 있다. 현재 코드는 TailwindCSS와 Shadcn UI를 사용한 React 코드를 만들어 준다. 사용하는 영상이나 explore 페이지를 보면 어떻게 만들어 주는지 알 수 있다.(영어)
  • Announcing Biome : 프론트엔드 툴 체인인 Rome이 공식적으로 중단되면서 커뮤니티가 포크 된 프로젝트가 Biome이다. Rome은 Meta의 OSS로 시작되었다가 처음 만든 Sebastian McKenzie가 Rome Tools Inc를 차렸지만, 회사는 잘 안되었고 직원들은 해고되었다. 메인테이너들은 여전히 프로젝트에 기여하고 싶지만, Rome 상표권 등의 제약이 있어서 Biome라는 새로운 이름으로 포크했다.(영어)

그 밖의 개발 관련

인프라 관련

  • Grafana Scenes is generally available: start building highly interactive apps today : Grafana를 확장할 수 있는 프론트엔드 라이브러리인데 Grafana Scenes가 정식으로 출시되었다. Scenes를 사용해서 Synthetic Monitoring같은 새로운 기능을 Grafana에 추가할 수 있는 Grafana 앱을 만들 수 있다.(영어)
  • Introducing Grafana Beyla: open source ebpf auto-instrumentation for application observability : Grafana에서 애플리케이션을 eBPF로 자동 계측할 수 있는 Beyla 프로젝트를 오픈소스로 공개했다. 보통 계측하려면 코드에 삽입해야 하므로 관리가 많이 필요한데 eBPF를 써서 자동 계측을 사용하면 쉽게 계측을 추가할 수 있고 기본적인 트랜잭션의 스팬과 HTTP/S, gRPC의 RED(Rate-Errors-Duration) 메트릭을 얻을 수 있다.(영어)
  • Kubernetes Scheduler Deep Dive : Kubernetes 스케쥴러가 팟을 할당하기 위해 13개의 기본 필터를 거쳐서 노드에 점수를 매겨서 노드를 선택하는 과정을 설명한다.(영어)
  • Pulumi를 이용하여 코드로 AWS 리소스 관리하기 : InfraStructure as Code 도구 중 하나인 Pulumi를 이용해서 AWS 리소스를 관리하는 방법을 설명한다. Pulumi CLI와 Pulumi Cloud에 저장된 상태 파일을 이용해서 AWS 리소스를 관리하는 기본적인 사용 방법을 설명하고 기존 인프라를 임포트하거나 Pulumi에서 변경 사항을 업데이트하는 방법, AWS 콘솔에서 변경된 내용을 적용하는 방법을 설명한다.(한국어)
  • Istio By Example : Istio 서비스 메시에서 카나리 배포나 외부 서비스 연결, 로컬리티 로드 밸런싱 등 사례별로 그림과 함께 설정 방법을 정리한 사이트이다.(영어)
  • Istio vs. Linkerd: Service Mesh Showdown 2023 : 서비스 메시인 Istio와 Linkerd의 기본 아키텍처와 트래픽 관리 기능, 확장성, 관측성, 인기도 등에서 비교한 글이다.(영어)

볼만한 링크

  • When MFA isn't actually MFA : 지난 8월 29일 Retool의 27개의 클라우드 고객 계정에 무단 접근이 발생했고 이 과정을 분석한 글이다. 8월 27일 Retool은 스피어 피싱 공격을 받았는데 이는 SMS 기반 피싱 공격이었다. 이는 Retool 사내 내부 포털로 위장한 메시지를 보냈는데 한 명이 이 피싱 사이트에 접속해서 MFA를 입력하고 로그인을 한 뒤 전화를 걸었는데 공격자는 딥페이크로 사내 프로세스를 자세히 안내하며 MFA를 획득하게 된다. 이를 통해 공격자는 직원 계정에 개인 디바이스를 추가할 수 있게 되어 GSuite 세션도 가질 수 있게 되었다. Google은 Authenticator 동기화 기능이 있기 때문에 공격자는 MFA 토큰에도 인증할 수 있게 되었다고 한다. 이 공격을 알게 된 후 모든 세션을 취소하고 사용자에게 알린 뒤 계정 탈취를 복구했다. 이번 공격은 멀티팩터 인증을 구현했지만, Google의 동기화 기능 업데이트를 통해 멀티팩터 인증이 싱글팩터 인증으로 바뀌게 되어 Okta를 획득하자 다른 모든 것에 인증할 수 있게 되었다.(영어)
  • How Are Consumers Using Generative AI? : a16z에서 트래픽 기준 50개 AI 제품을 분석해서 AI 트렌드를 분석한 글이다.(영어)

    1. ChatGPT처럼 생성형 AI는 1년 전에는 존재하지 않았으며 50개 제품 중 대기업 제품은 5개뿐이며 48%가 외부 자금 없이 제품을 만들어서 비교적 적은 자본으로 대규모 AI 제품을 출시할 수 있음을 뜻한다.
    2. ChatGPT가 1위를 차지하고 있지만 컴패니언 플랫폼인 CharacterAI가 확고한 2위를 차지하고 있다.
    3. AI 컴패니언과 Midjourney같은 콘텐츠 생성 도구의 사용량이 많이 증가했다. 이미지 생성이 트래픽의 41%, 프로슈머 작성 도구가 26%, 비디오 생성이 8%를 차지하고 있고 Civitai나 Jugging Face 같은 모델 허브도 주목할 만하다.
    4. 대부분 카테고리에서 2배 미만의 격차를 보여서 최근 성장세를 생각하면 충분히 극복할 수 있는 차이이다.
    5. 다른 산업과 다르게 AI 기업들은 유료 마케팅 없이 성장하고 있고 소비자는 생성형 AI에 기꺼이 비용을 지불해서 50개 제품 중 90%가 이미 수익을 내고 있다.
    6. 리소스를 앱에 분산하고 싶지 않아서 대부분 웹을 기반으로 제공하고 있지만 모바일 앱으로 제공하는 서비스들이 나오고 있고 참여도도 훨씬 높기 때문에 앞으로는 모바일 우선 생성형 AI 제품이 더 등장할 것이다.
  • 브라이언 체스키가 Airbnb에서 PM을 없애버린 이유 : airbnb의 CEO인 브라이언 체스키는 디자이너 출신 경영인인데 디자이너로서 회사를 운영하는 게 꿈이었지만 당시 회사는 그렇지 않았고 코로나로 매출도 급감해서 회사도 위키에 처했다고 합니다. 그래서 PM 역할을 없애고 PM과 마케터를 합쳐서 프로덕트 마케터로 만들고 디자이너가 PM처럼 제품 제품에 참여할 수 있게 권한을 강화해서 각 제품을 만들도록 했다고 한다. 그 결과 코로나로 위기라던 airbnb의 수익이 크게 높아져서 손익분기점에까지 도달했다고 한다.(한국어)
  • Pandoc 이미지 관련 팁 두 가지 : Pandoc으로 마크다운을 epub으로 변환할 때 CSS에서 사용한 이미지가 epub에 포함되지 않는 문제를 해결하는 방법과 이미지 캡션을 제대로 추가하기 위해 Pandoc 확장 문법은 {특성=값}을 활용하는 방법을 설명한다.(한국어)

IT 업계 뉴스

프로젝트

  • tshy - TypeScript HYbridizer : CommonJS/ESM를 지원하는 패키지 빌더.
  • Nue : React/Vue/Vite/Astro 대체제를 표방하고 있는 프레임워크
  • Rig.dev : Kubernetes용 애플리케이션 플랫폼
  • totp : JavaScript 2FA 라이브러리.
  • FFmpeg Explorer : 시각적으로 FFmpeg의 필터 명령어를 조정하고 프리뷰를 볼 수 있는 사이트
  • OpenTF : Terraform의 오픈소스 포크

버전 업데이트

2023/09/16 13:57 2023/09/16 13:57