Outsider's Dev Story

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

기술 뉴스 #190 : 22-01-17

웹개발 관련

  • Announcing Parcel CSS: A new CSS parser, compiler, and minifier written in Rust! : Parcel에서 Rust로 작성한 새로운 CSS 파서 parcel-css를 공개했다. CSSNano나 ESBuild보다 더 빠른 속도를 보여주고 압축된 이미지도 더 작다고 한다. Mozilla에서 만든 cssparser에 기반을 두고 있으면 다른 파서가 CSS의 값을 문자열로 다루고 있는데, 반해 Parcel CSS는 CSS 면세의 그래머를 사용해서 모든 값을 파싱하고 있다.(영어)
  • 스토리북으로 인터랙션 테스트하기 : 스토리북 6.4부터 추가된 Interactive Stories 기능을 이용해서 기존 기능의 동작 여부 테스트뿐 아니라 인터렉션을 자동으로 생성하는 방법을 설명한다. interaction 애드온을 이용해서 인터랙션이 자동으로 발생하는 코드를 작성하고 이를 단계별로 실행할 수도 있다. 인터랙션이 자동으로 실행되게 만들었으니 Cypress나 Playwrigt같은 E2E 테스트 도구를 이용해서 해당 인터렉션의 테스트를 자동화할 수 있다.(한국어)
  • Make Beautiful Gradients : CSS로 그라데이션을 표현할 때 CSS 엔진이 RGB를 쓰기 때문에 RGB 값으로 표현하는 가운데 보기 싫은 그레이 영역이 나타나게 된다. 이는 HSL을 사용할 때는 발생하지 않은데 이 색 표현의 차이를 설명하고(데모가 있어서 이해하기 좋다) 이를 이용해서 많은 중간 지점을 css gradient 함수에 전달해서 자연스럽게 표현되도록 한 방법을 설명하고 이를 활용할 수 있는 Gradient Generator도 소개한다.(영어)
  • Discontinued Long Term Support for AngularJS : AngularJS의 LTS 기간이 21년 12월로 끝나서 더는 지원하지 않게 되었다. 여기서 얘기하는 AngularJS는 Angular 이전의 1.x 버전을 의미하고 Angular는 당연히 계속 지원된다. 웹사이트와 패키지는 계속 살아있을 예정이지만 저장소는 읽기 전용으로 아카이빙되고 추가 수정사항은 없을 것이다.(영어)

그 밖의 개발 관련

  • 카카오웹툰은 GitHub Actions를 어떻게 사용하고 있을까? : 카카오웹툰에서 GitHub Actions를 활용하는 팁을 설명한 글이다. 간단한 Actions 설명부터 시작해서 Slack에 알림을 보내기 위해 별도로 만든 Actions 파일을 연결해서 사용하고 글로벌 배포를 위해 브랜치 이름에 관례를 만들어서 어느 리전과 환경에 배포할지를 판단할 수 있게 했다. 추가로 정기적으로 실행되도록 설정한 자동배포 워크플로우도 설명한다.(한국어)
  • Deno by example : Deno의 사용방법을 예제별로 보아둔 사이트를 Deno에서 공개했다. 간단한 Hello World부터 명령행 인자 처리, 파일 처리, HTTP 서버까지 다양한 예제를 제공한다.(영어)
  • Hashicorp plugin system 설계 및 구현 : HashiCorp가 자사의 제품에서 공통으로 사용하고 있는 플러그인 시스템이 어떻게 동작하는지 분석한 글이다. 플러그인 시스템은 Terraform 등의 메인 시스템과 gRPC로 통신하고 있으며 플러그인 서비스는 바이너리를 실행하기 때문에 플러그인 시스템과 바이너리의 빌드를 다르게 해서 배포할 수 있게 된다. 실제로 플러그인을 어떤 함수를 구현해야 하는지를 설명하고 이러한 동작이 Terraform에서는 어떻게 되는지 보여주고 있다.(한국어)
  • Open source maintainer pulls the plug on npm packages colors and faker, now what? : faker.js와 colors.js의 메인테이너가 해당 패키지를 없애거나 악의적인 무한루프를 담아서 릴리스했다. colors는 1.4.0에 고정하길 권장하고 있다.(영어)

인프라 관련

  • 개발문화를 code로 만드는 CI/CD 도구: Prow : 좋은 개발 문화를 달성하는데 Continuous delivery가 중요한 역할을 하는데 이를 위해 DORA에 연구에 따르면 자율성을 높이기 위해 규칙은 단순화하는 게 좋다고 한다. 이러한 규칙을 코드로 관리할 수 있다면 더 좋기 때문에 Kuberentes 기반의 CI/CD 도구인 Prow의 활용을 설명한 글이다. Prow는 Kubernetes 뿐 아니라 많은 CNCF 프로젝트가 사용하고 있는 CI/CD 도구이고 GitHub의 이벤트와 잘 연동되어 있어서. /command 형식의 댓글로 리뷰를 승인하거나 레이블을 추가하는 등의 액션이 가능하기 때문에 ChatOps로 이러한 부분을 자동화할 수 있다.(한국어)
  • GitOps model for provisioning and bootstrapping Amazon EKS clusters using Crossplane and Argo CD : Kubernetes를 이용해도 S3나 SQS같은 Kubernetes 밖의 관리 리소스가 필요하게 되는데 이를 Crossplane을 이용해서 프로비저닝하는 방법을 설명하는 글이다. Crossplane은 Kubernetes API를 이용해서 클라우드 리소스를 관리하는데 기존의 Kubernetes 클러스터를 이용해서 Crolssplane을 ArgoCD로 설정하고 이를 이용해서 EKS 클러스터를 생성하는 방법을 보여주는데 예제 코드도 제공하고 있다.(영어)
  • GitOps model for provisioning and bootstrapping Amazon EKS clusters using Crossplane and Flux : 바로 위에 링크한 ArgoCD와 Crossplane을 설정한 방법을 이번에는 Flux와 Crolssplane으로 설명한 글이다.(영어)
  • nginx ingress controller 무중단 업데이트하기 : AWS NLB와 ningx ingress controller를 Kubernetes에서 사용하고 있을 때 ningx ingress controller를 무중단으로 업그레이드하는 방법을 설명한다. 하나의 클러스터 안에서 새로운 세트의 NLB와 ningx ingress controller를 생성한 뒤 NLB를 바라보든 DNS를 하나씩 옮기면서 테스트하고 기존 NLB와 ningx ingress controller를 삭제하는 과정이다.(한국어)
  • Amazon Elastic Kubernetes Service에 IPv6 네트워킹 기능 추가 : AWS EKS에서는 각 Pod이 IP 주소를 수신하면서 VPC 내의 IP 주소가 많이 필요한 문제가 있는데 IPv6가 이제 도입되어 IP 주소 고갈 문제도 방지하고 라우팅을 간소화 할 수 있게 되었다.(한국어)

볼만한 링크

  • Pretendard 커스텀 폰트 도입기 : 리멤버에서 플랫폼 별다른 폰트를 해결하기 위해 시스템 폰트 대신 커스텀 폰트를 사용하기로 하고 상업용 무료이면서 다양한 weight를 가지면서도 한글 표현이 잘 되는 조건으로 폰트를 찾았다고 한다. Spoqa Han Sans Neo와 Pretendard를 비교한 뒤 Pretendard가 더 적합하다고 판단해서 도입했고 덕분에 디자이너들이 플랫폼별로 디자인을 따로 만들지 않아도 되게 되었다고 한다.(한국어)

프로젝트

  • Vitest : Vite에서 만든 유닛 테스트 프레임워크.
  • InfraMap : Terraform 상태나 HCL을 읽어서 리소스를 그래프로 보여주는 CLI 도구로 AWS, GCP, Azure 등을 지원한다.
  • rReader : 터미널에서 사용할 수 있는 RSS 리더

버전 업데이트

2022/01/17 08:32 2022/01/17 08:32