📚 한 주간 본 IT 글, 영상 아카이브 #11

🗓 2019.08.12 ~ 2019.08.18

---

📔 블로그

🇺🇸 The Making of an Animated Favicon

• Canvas와 JavaScript를 이용해 움직이는 favicon을 만드는 방법을 설명하는 css-tricks 블로그 글.
• setInterval 과 favicon.href = canvas.toDataURL('image/png') 트릭을 사용한다. 로딩이나 성공/실패와 같은 UX에 좋아보인다. 성능문제는 없을까..?

🇺🇸 Introducing the New React DevTools

• React DevTool이 4.0.0 버전으로 업데이트되었다.
• React Hooks를 완전 지원하며 크로미움으로 전환한 MS Edge에서도 사용가능하다. (MS Edge에서 크롬 Extension을 설치가 가능하다)

🇰🇷 실용주의 프런트 엔드 개발

• 실용주의 프론트엔드 개발이라는 제목의 gitbook.
• 아직 1장만 읽어봤는데, 네이밍, 리팩토링, 성능최적화 등 프론트엔드 관련 유용한 내용들이 굉장히 깔끔하게 잘 쓰여있다.

---

📰 뉴스

🇰🇷 [단독]카카오, 택시회사 또 인수...'쩐의 전쟁터' 된 모빌리티시장

• 카카오가 모빌리티사업을 위해 택시회사를 또다시 인수한다고 한다.

---

📹 영상

🇺🇸 (39:31) Jake Archibald & Surma - Setting up a static render in 30 minutes - [JAMstack Conf]

• Google Chrome Dev 채널의 HTTP 203 시리즈로 유명한 Jake와 Surma의 JAMStack Conf 발표영상.
• Static Site의 성능 최적화에 관해 이야기한다.
• 번갈아가면서 한마디씩 하는 독특한 발표에서 HTTP 203의 케미가 그대로 묻어나와서 재미있게 봤다.

🇺🇸 (14:51) Typescript vs Javascript - [Ben Awad]

• TypeScript와 JavaScript 각각의 장단점에 대해 이야기하는 영상.
• 컴파일타임 에러, 인텔리센스, 러닝커브 등을 이야기한다.

---

💻 오픈소스

reactide

• React 개발을 위한 IDE.
• IDE에서 바로 컴포넌트 렌더링을 한다던가, 컴포넌트 트리를 보여준다던가 하는 기능이 있다.
• 개인적으로 네이밍이랑 로고디자인은 정말 잘한 것 같다.

mc.js

• three.js, React, GraphQL, Node.js로 만든 마인크래프트 클론 프로젝트.
• 타이완 고등학생이 만들었다고한다.. 😲
• 마인크래프트로 어릴때부터 코딩에 입문하는 분들은 정말 대단한 것 같다.

---

🔗 그 외 유용한 링크

🗓 conferences.css-tricks.com

• 다가오는 전세계 Front-end 관련 컨퍼런스들을 모아서 보여주는 사이트.

🎨 useanimations.com

• 아이콘의 마이크로인터랙션을 모아놓은 사이트. Feather Icon을 기반으로 만들었다고 한다.
• 당장 사용하고싶은 욕구가 솟구치게 귀엽다.

---