Outsider's Dev Story

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

기술 뉴스 #154 : 20-07-18

웹개발 관련


그 밖의 개발 관련

  • Our Transition to React Native : Khan 아카데미에서 iOS/Android 앱을 React Native로 갈아타기로 2017년에 결정했는데 2년에 걸친 전환 작업 후 이제 모든 스크린을 React Native로 렌더링하게 되었다고 한다. 플랫폼에서 다른 버그가 발생하고 새로운 기능을 만들 때 협업도 많이 필요한 문제가 있어서 갈아탔는데 React Native가 모든 것이 좋은 것은 아니지만 UI 작업이 더 쉬워졌고 웹과의 협업도 쉬워졌다고 한다.(영어)
  • Moving from TypeScript to Rust / WebAssembly : 보드게임의 엔진을 TypeScript로 작성하고 있다가 Rust와 WebAssembly로 갈아탄 이유를 설명한 글이다. JavaScript나 TypeScript로 서버와 클라이언트가 같은 코드를 공유한 것처럼 Rust도 WebAssembly로 컴파일해서 서버와 클라이언트가 코드를 공유할 수 있고 Rollup 플러그인을 이용해서 TypeScript 프로젝트에 Rust를 통합할 수 있게 되었다고 한다. TypeScript보다 타입 검사를 엄격히 할 수 있고 오류 처리도 강력하게 처리할 수 있고 성능 최적화를 안 했음에도 WebAssembly가 이전보다 빨라졌다고 한다.(영어)
  • git commit accepts several message flags (-m) to allow multiline commits : git에 커밋할 때 커밋메시지를 바로 작성할 수 있는 -m 옵션을 여러 번 사용하거나 여러 줄로 작성해서 에디터를 열어서 작성한 것처럼 하는 방법을 설명한다.(영어)

인프라 관련

볼만한 링크

IT 업계 뉴스

프로젝트

  • Perf Track : React, Angular, Vue 등 주요 JavaScript 프레임워크를 사용하는 수많은 사이트를 분석해서 성능을 보여주는 사이트.
  • Sheet UI : Google 시트를 웹페이지로 만들어 사이트.
  • rush : Microsoft에서 만든 오픈소스로 다수의 JavaScript 프로젝트를 모노 레포로 한곳에서 관리할 수 있게 도와주는 프로젝트.
  • K9s : 터미널 UI를 가진 Kubernetes CLI.
  • Octant : VMWare에서 만든 Kubernetes 클러스터용 웹 기반 대시보드.
  • Tabler Icons : 무료 SVG 아이콘.
  • Big Heads : 랜덤으로 아바타 이미지를 생성해 주는 사이트.

버전 업데이트

2020/07/18 16:46 2020/07/18 16:46

기술 뉴스 #153 : 20-07-04

웹개발 관련

  • 라이트하우스 6.0에서 바뀐 성능 지표변화 : Lighthouse 6.0에서 새로운 웹 성능 지표로 추가된 LCP(Largest Contentful Pain), CLS(Cumulative Layout Shift), TBT(Total Blocking Time)를 자세히 설명한다. Web Vitals에서는 FID(Fisrt Input Delay)가 추가되었지만, Lighthouse에서는 FID 대신 TBT를 사용한다.(한국어)
  • Using the Chrome UX Report API : 크롬 사용자를 바탕으로 실제 사용자의 UX 데이터가 담긴 Chrome UX Report(CrUX)를 프로그램으로 연동할 수 있는 API가 공개되었다.(영어)
  • Vue 3: mid 2020 status update : 원래 Vue 3을 전반기에 릴리스하기로 계획했지만 7월 중순에 RC를 릴리스 할 수 있고 정식 버전은 8월 초를 예상한다고 한다. Core뿐 아니라 관련 프로젝트의 현재 상태를 정리해 두었다.(영어)
  • Stop mocking fetch : 테스트 코드에서 백엔드에 요청을 보내는 fetch를 모킹하면 실제 동작이 달라지거나 깨졌을 때 확인이 어렵다는 점을 지적하면서 한곳에서 모킹처리를 관리하면서 실제 API 동작을 확인할 수 있게 수정한 접근을 보여준다. 그리고 msw 라이브러리를 소개하며 같은 문제를 더 쉽게 해결하는 방법을 보여준다.(영어)
  • Creating a Design System in React : Bit를 이용해서 React로 디자인 시스템을 구축한 과정을 설명하고 있다. 디자인 시스템 자체보다는 Bit의 사용법에 대한 설명이 주인데 Bit가 각 컴포넌트를 분리와 버저닝을 관리해주고 코드에서 문서화 및 배포까지 도와주어 협업에 도움이 된다고 한다.(영어)
  • Flipper — A React Native revolution : React Native 앱의 디버그 도구로 다양한 도구를 사용해 보았지만, 각각의 제약사항이 있어서 만족하지 못했지만 Flipper에는 네트워크 로그, 로그, React 개발도구 등 필요한 기능이 다 있고 플러그인 시스템까지 있어서 앞으로 React Native의 주요 디버그 도구가 될 것이라고 설명하고 있다.(영어)

그 밖의 개발 관련

인프라 관련

  • Announcing the HashiCorp Cloud Platform : HashiCorp에서 AWS, GCP, Azure 등에서 HashiCorp의 제품을 풀매니지드로 운영할 수 있는 HashiCorp Cloud Platform(HCP)을 발표했다. 현재 베타이고 첫 베타 서비스는 AWS에서의 Consul이고 다음은 Vault라고 한다.(영어)
  • Amazon RDS Proxy – Now Generally Available : 작년 리인벤트 행사에서 공개된 RDS Proxy가 GA가 되었다. RDS Proxy는 애플리케이션이 데이터베이스 커넥션 풀을 공유해서 사용할 수 있게 하고 이번 GA가 되면서 MySQL과 PostgreSQL을 모두 지원한다.(영어)
  • Working with Terraform and Kubernetes : Terraform으로 Kubernetes를 관리하는 방법을 설명한 글이다. Terraform 공식 Kubernetes 프로바이더가 있지만, 커스텀 리소스를 사용하지 못하는 등 제약사항이 있는 편이고 HashiCorp에서 Terraform kubernetes-alpha 프로바이더를 앞으로의 좋은 대안으로 기대해 볼 수 있다. 세 번째 방법으로는 Kubestack에서 만든 Terraform Provider Kustomize을 사용하는 방법이 있다.(영어)
  • Relay Public Beta : IFTTT 스타일로 이벤트 기반의 인프라스트럭처 자동화를 할 수 있는 relay를 puppet에서 공개했다.(영어)

볼만한 링크

  • Why Figma Wins : 왜 Figma가 성공했는지를 설명한 글이다. 다른 디자인 도구가 파일을 클라우드에 올려놓는 방식이었지만 Figma는 브라우저 기반이라 디자이너들이 파일을 주고받느라 고생할 필요가 없이 협업할 수 있고 최종 결과물만 타팀과 공유하는 것이 아니라서 디자인 프로세스에 PM이나 개발자를 포함해서 피드백을 빨리 주고받을 수 있게 되었다. 그래서 Figma의 영향이 디자이너뿐 아니라 회사 전체에 영향을 끼치고 이 덕에 입소문도 빨리 퍼지게 되었고 최근에는 플러그인과 커뮤니티로 인해서 더 성장이 빨라지고 있다고 한다.(영어)
  • [SOCAR FRAME 만들기 # 1] 쏘카의 디자인 시스템 맛보기 : 쏘카에서 만든 디자인 시스템 Socar Frame을 작년 말부터 준비하면서 설득과정부터 TF를 꾸려서 전체에 적용한 과정을 정리한 글이다.(한국어)
  • GitHub Stars program : GitHub에서 생태계에 영향을 주는 사람을 추천할 수 있는 프로그램이 공개되었다. 로그인하면 특정 개발자를 추천할 수 있다.(영어)

IT 업계 뉴스

  • The end of the Redis adventure Redis를 만든 Salvatore Sanfilippo가 Redis 메인테이너에서 물러나고 Redis Labs의 자문위원회에서만 활동한다고 한다. 10년 전에 Redis를 만들고 Redis가 큰 성공을 거두었지만, 점점 다른 개발자와 얘기하는데, 더 시간을 쓰게 되었고 소프트웨어 메인테이너가 되길 원한 건 아니었다고 한다. 차후 계획은 아직 없지만, 코딩이 재밌으니까 코딩을 계속할 거라고 한다.(영어)
  • Databricks acquires Redash, a visualizations service for data scientists : Spark로 유명한 데이터 분석회사 Databricks가 데이터 시각화 회사인 Redash를 인수했다.(영어)

프로젝트

  • css stats : 사이트 주소를 입력하면 분석 후 선언된 폰트 크기, 백그라운드 색상 수, 특이성 등을 분석해주는 사이트.
  • Mock Service Worker : API 모킹 JavaScript 라이브러리.
  • Puppeteer Cluster : 크롬 브라우저를 API로 제어하는 Puppeteer 클러스터를 관리하게 해주는 프로젝트.
  • HorizonCalendar : Airbnb에서 오픈소스로 공유한 iOS 캘린더 UI 컴포넌트.

버전 업데이트

2020/07/04 19:53 2020/07/04 19:53