Month: 2017-11


jihchi 08:31:34


:tada:Node.js 8.9.0 goes into LTS support and Node.js 9.0.0 becomes the new Current release today. More details here: <> <>

jihchi 08:34:29


Mwahaha. Want to see which components are rendering across your entire app? Do this: <>

jihchi 09:50:32



awesome-shell - A curated list of awesome command-line frameworks, toolkits, guides and gizmos. Inspired by awesome-php.


mofas 08:37:09
今天我請我team member 幫他的python script 加一下 requirements.txt
從字面上解讀沒錯啊 XD ,準確一點來說是要 for pip install 用的 requirements.txt
至少他會用 git
說不定是 Github 介面直接 edit
那⋯⋯至少他會用 github
同一人嗎 囧
用 vcs 去做 vc 反而是少數人吧?
jihchi 08:58:02

Salesforce Engineering

Optimizing Performance with Web Workers – Salesforce Engineering

The Salesforce Charts team is constantly pushing for better runtime performance because of our intense data processing and rendering needs…

jihchi 09:01:35

HAProxy Technologies

What's New in HAProxy 1.8 - HAProxy Technologies

The monumental stable release of HAProxy 1.8 is coming! The HAProxy 1.8 release candidate 1 (RC1) has been published by the R&amp;D team here at HAProxy Technologies, and in this blog post we are going to take you through some of the release highlights, new features, and configuration examples to get you up to speed. …

jihchi 09:17:08

Nah... I don’t agree with this method

Atomic Spin

Using State Tables for Testing – Simple, Scalable, Concise

Using state tables for testing is great for situations where there are a variety of inputs for a function that produce different results.

jihchi 09:21:30

Critical CSS and Webpack: Automatically Minimize Render-Blocking CSS | Codementor

If we only load the CSS that's useful for the initial page render, our users will see the page quicker. Isolating critical CSS and loading non-critical CSS in idle time is something that can be done programmatically in your Webpack pipeline.


mofas 01:39:12

Multi-root Workspaces in Visual Studio Code

You can open and work on multiple project folders in Visual Studio Code with multi-root workspaces.

mofas 01:39:26
Really good feature


mofas 09:43:24
reactive conf 最近很被人靠北 但是還是有些talk可以看


jihchi 08:29:12


MS using Chrome+Puppeteer for visual diffs in their new UI lib <>. Should also use web components, but who’s count’n :) <>

jihchi 08:35:10


Using Object.keys instead of is a good performance advice by <|@lucasazzola>. :+1: <> <>

jihchi 10:36:42



pixelmatch - The smallest, simplest and fastest JavaScript pixel-level image comparison library

mofas 13:36:24



prettier - Prettier is an opinionated code formatter.

💯 2
mofas 13:36:30
even markdown


jihchi 08:25:23


It's #Nodejs Release Day :grinning: v4.8.6 <> v6.12.0 <> v9.1.0 <> (8.x coming later)

jihchi 08:25:47


Prettier 1.8 formats not only Markdown but any code within it! This is amazing for blogging. <>


Just released version 1.8 of Prettier! Features Markdown support thanks to <|@ikatyang_>, JSDoc realignment, and more! <>

jihchi 08:31:54


I just published “Using a React 16 Portal to do something cool” <>

mrorz 11:59:50
是說如果不管 IE11, CSS grid 應該完全可以用了呢 Edge 也有了


CSS Grid: Micro Tip #18 - Supercharged

mofas 14:07:26


Flexbox and Grids, your layout’s best friends

We decided to debunk the myths around Flexbox &amp; Grids in order to show you the power of these two technologies working together. Read more!

jihchi 22:34:26



Simple, responsive, modern SVG Charts with zero dependencies: <>

jihchi 22:35:19



scope - Monitoring, visualisation &amp; management for Docker &amp; Kubernetes

jihchi 22:35:59

Server.js - server.js

Flexible and powerful server for Node.js

jihchi 22:36:20


Lightweight, high-performance JS plugin for detecting and manipulating elements in the browser.

jihchi 22:37:24



chimee - a video player aims to bring wonderful experience on browser

jihchi 22:38:54



js-code-to-svg-flowchart - js2flowchart - a visualization library to convert any JavaScript code into beautiful SVG flowchart. Learn other’s code. Design your code. Refactor code. Document code. Ex...


jihchi 08:32:56


Just released: react@16.1.0-rc react-dom@16.1.0-rc This really is the last call for reporting issues :upside_down_face:. Releasing React 16.1.0 tomorrow.

jihchi 09:11:56



react-hot-loader - Tweak React components in real time.

mofas 11:18:09
OMG 原來windows 可以跑linux subsystem了
mofas 11:18:09

Install the Linux Subsystem on Windows 10

Installation instructions for the Linux Subsystem on Windows 10.

mofas 11:18:43
Mac Pro 下一代我真的不行..
mofas 11:18:44


Why I left Mac for Windows: Apple has given up | Charged

I'm a die-hard Apple user, but after years of watching the Mac slowly die, I've switched back to Windows. Here's the story of why I moved back to Windows, and what I've found so far.

mofas 11:21:40


:rotating_light: The <|@code> October release is out! This is one you do not want to miss! :rotating_light: Full details :point_right: <> :video_camera: highlights rolling :point_down:

jihchi 18:43:17


8 immutable arrays operations you should know :memo::nerd_face: #javascript #es6 <>


jihchi 08:37:50


React v16.1 is available! Go go go! :sunglasses: <>

jihchi 08:40:16


<|@yarnpkg> and Algolia: one year of #opensource collaboration, 700,000 user searches per month :tada: <> <>

jihchi 08:44:25


Oh Hey Taiwan I'm going to visit soon and run a half day of <|@nodejs> events * A talk * A Node.js Values Session * Code + Learn Come learn about node, help guide our culture, and land your first commit :tada: <>

jihchi 09:31:29



blink-diff - A lightweight image comparison tool

jihchi 09:33:04



getopts - Node.js CLI options parser.

jihchi 18:42:24


:dizzy: you can push into Array.prototype and totally mess up empty arrays <>

jihchi 18:42:46


Excited to announce DraftJS Plugins 2.0:balloon::tada: A plugin architecture for Draft.js now including rich text editing toolbars and features like Drag’n’Drop &amp; Alignment for Atomic Blocks like images <> Thx to <|@juliandoesstuff> who took over the project recently:clap:


mofas 02:29:16
React is powerful but the complexity it brought is still a lot.


Here we see a react engineer deploying a contact form <>

jihchi 10:31:01



remotestorage.js - ⬡ JavaScript client library for integrating remoteStorage in apps


mofas 13:15:41
Really cool article!


jihchi 08:29:20


v16.1.1 of <|@reactjs> is out! Get it while it's hot. <>

jihchi 08:34:56


I just published “Rendering a function with <|@reactjs>” <>

Michael Hsu 09:30:12


On Twitter Lite, we ensure our components are as fast to mount and update as possible. Without react-addons-perf in v16, we needed another solution. In comes react-component-benchmark. <>

jihchi 09:48:44



serverless-libreoffice - Convert any document to PDF with headless Libreoffice compiled to run on AWS Lambda


jihchi 09:29:32
Who is he
mofas 09:34:04
Well, a old guy who get turing award.
mofas 09:34:13


Finding joy in programming

When is programming intrinsically fun, and when is it laborious? What drives some developers towards the rapidly developing JavaScript ecosystem, while others flock to less-developed and more esoteric languages and ecosystems? What keeps us using metaphors and abstractions developed so many decades before, when we've spent so much effort designing clean-slate systems? We'll look at this discussion through the prism of ReasonML, a new syntax and set of tooling around OCaml. OCaml itself is more than 20 years old and is wildly popular amongst academics, but is largely unknown in the industry. We'll see how Reason straddles the spectrum of the questions above to bring all of that horsepower to bear on industry problems - through a syntax and developer experience appealing to pragmatists, an emphasis on FP and a type system meant to draw in purists, and a focus on incremental migration that means we can use it in the systems of yesteryear while moving towards the abstractions of tomorrow. Key takeaways What's Reason What makes Reason uniquely suited for bringing joy to certain classes of problems Why now? OCaml is more than 20 years old How can you get start using it today in your work and side projects?

mofas 09:34:21
Another excellent talk
mofas 09:37:40
簡而言之Alan kay搞了smalltalk 是現在一堆OO語言的前身, 他也搞GUI, IDE概念是他先開始的
😱 1
Michael Hsu 10:36:23


Go get v9.2.0 of <|@nodejs> at <>. * exposes process.ppid * exposes fs.realpathSync.native and fs.realpath.native * Supports building with OpenSSL 1.0.2 *and* 1.1.0

Michael Hsu 14:08:44
Why graphql-tools > graphql.js
> it allows frontend developers to start working against a mocked API, before it is actually implemented by backend developers— thanks to the SDL.
🎉 2
mrorz 14:18:47
終於看到在一篇文章中把 GraphQL 的 resolver 特性說清楚講明白的文章了 XD

> The only way for you to make your GraphQLSchema executable (with GraphQL.js) is by manually adding the resolve functions to the schema’s fields.

因為 GraphQL.js 現在的文件會教你用 default resolve 來做事情:

注意他每個 resolve function 都會回傳一個 object instance,該 object 的每個 property 的名字跟下層 Object Type 的 field name 符合,讓 `graphql` 去解析 default resolver (見

GraphQL: A query language for APIs.

GraphQL provides a complete description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools.

💪 1 💯 1
mrorz 14:20:25
只是 GraphQL.js 官方文件這個做法,沒有考量到 custom scalar type 怎麼透過 schema definition language 設定,也沒有考量到 Enum type 如果 value name 與 value 不一樣的話該怎麼辦。(理論上這兩者應該都 outside of schema language’s concern,等於無解⋯⋯)

From ,leebyron 表示:
> For this very reason, the first example cannot be achieved by using the schema language alone since it requires specifying an internal implementation detail.

這一點,甚至連 graphql-tools 也還沒解:
Michael Hsu 14:27:40
其實我也還沒用過 GraphQL 像你們一樣建置大型的專案XD
所以目前沒踩到像你說的雷 哈哈 只是覺得 graphql-tools 寫起來清爽一些
不過聽起來還是 Graphql.js 較靠譜一點
mofas 22:01:04
Graphql.js 其實subscription 也沒做好
mofas 22:01:17
所以apollo 的比較完整
mofas 22:01:28
但是apollo 又加了一些自己的東西進去
mofas 22:01:40
不是那麼喜歡 😞


mofas 07:55:08

A First Reason React app for Javascript developers | James Friend

*This post has been updated to use the new Reason 3 syntax, and to account for API changes in Reason React. A Traditional Chinese translation of an older version of this article is available [here](<>).* [Reason](<https://facebook.githu>

中文版還沒更新到 reason 3 syntax
jihchi 08:27:52

Introducing Visual Studio Live Share

Real-time collaborative development

jihchi 08:28:57
中文版還沒更新到 reason 3 syntax
jihchi 08:40:42
為什麼我還繼續用 RSS (Feed)


Gea-Suan Lin's BLOG

為什麼我還繼續用 RSS (Feed)

最近在一些地方冒出兩篇文章 (應該是 Nuzzle 與 Hacker News,放在 tab 上好幾天,不是那麼確定來源...),一篇是最近發的「The Case for RSS」,另外一篇是五月的文章「RSS: there's nothing better」。這邊講的 RSS 比較廣義,不侷限於 RSS {0.

Michael Hsu 09:16:50


Towards Next.js 5: Introducing Canary Updates <> <>

Michael Hsu 09:32:46



Contribute to reason-apollo development by creating an account on GitHub.

mrorz 10:42:32
我這禮拜才升 next 4
現在又要 next 5 了嗎 wwwwww
jihchi 10:43:09
jihchi 10:43:19
😂 1
jihchi 10:43:30
mrorz 10:43:35
🏃 1 👍 1
mrorz 10:44:57
next3 的 error 的 source map 確實怪怪的,我拿到的 stack trace 都是 compile 過後的 Orz
結果我還沒機會嘗試 next4 是否有改進,next5 就說要 improve sourcemap
💪 1
cjies 10:47:54


Introducing Teletype for Atom: Code collaboratively in real time

Writing code with other developers can be a great way to onboard teammates, get to know how your peers think, and learn new skills. Unfortunately, writing code together can be difficult to coordina...

mofas 12:36:16
Graphql summit all video are up
mofas 12:50:44
禮拜人很久以前講的graphql subscription 終於上線惹


Introducing GraphQL Subscriptions - Lee Byron

🎉 2
jihchi 18:52:59


New blog post: "The Cost Of JavaScript" <> Loading JS fast = only send what you need + less transfer time + less time parsing/compiling code :fire:

jihchi 18:59:27


Holy banana pancakes! This is seriously all kinds of wows and wonders. What a rad tool for generating CSS animations. People are awesome. <> Thanks for sharing, <|@ddmoore>!

itsmisscs 23:41:58
About to dive into a gatsbyjs + AMP project. any folks here ever use gatsby?


mofas 01:18:57
I think the most people here use next 😛
mofas 01:18:59

Apollo GraphQL

Apollo Client 2.0: Beyond GraphQL APIs – Apollo GraphQL

Learn how to manage all your app data with Apollo in my talk from GraphQL Summit 2017

itsmisscs 03:21:26
how do you like next? was between next and gatsby
jihchi 08:25:00


react-fns :atom_symbol: React components, hoc's, and utilities functions for common browser API's <>

jihchi 08:25:49


Announcing CodeSandbox 2.0 :beach_with_umbrella: - Commit, open PRs and create repos right from within CodeSandbox. - A completely new and redesigned homepage. - Static file hosting support from the `public` directory. <>

jihchi 08:27:47



Tip: Does your project work better with <|@code> (VS Code) extensions? List recommended extensions in .vscode/extensions.json, and VS Code will prompt users to install them with a single click. :+1: <>

Michael Hsu 10:11:18


:tada: Redux 4.0.0-beta.1 is out! :tada: :white_check_mark: New TS definitions. :white_check_mark: Bundled CJS and ES builds. :white_check_mark: Tightened up behaviors. No breaking changes for most apps! Give it a whirl and let us know if there are problems. npm install redux@next <>


jihchi 22:19:34


Prettiet now has a twitter account :) <|@PrettierCode>


WilsonWang 21:01:21
@wilson8507 has joined the channel


jihchi 23:16:51 TJ 最新力作



node-prune - Remove unnecessary files from node_modules (.md, .ts, etc)

jihchi 23:17:21
node-prune written in golang


mofas 01:41:25

Articles by thoughtram

Custom Overlays with Angular's CDK

The Angular Material CDK provides us with tools to build awesome and high-quality Angular components without adopting the Material Design visual language. Its goal is to make our life as developers easier and extract common behaviors and patterns shared between multiple Angular Material components. In this post, we'll use the CDK to build a custom overlay that looks and feels much like the Google Drive file preview overlay.

mofas 01:41:35
看到這篇我就覺得angular 徹底沒救了
mofas 01:41:43
mofas 01:47:23
到底為啥變得越來越像老舊的OO pattern
mofas 02:51:00
Good talk
mofas 02:58:13
雖然最近ng很鳥, 但是可以看一下Igor的talk


ReactiveConf 2017 - Igor Minar: Let's Tree-shake it...

😂 1 👍 1
lee 03:08:07
@lee has joined the channel
jihchi 08:27:21


Apollo has been a good member of the GraphQL community, but I've heard from some of you about confusion around these ads so to clarify: Apollo/Meteor is not the “official” supporter of the GraphQL community, nor are they the original engineers behind GraphQL. <>

jihchi 08:27:37


Hey :wave:There's a new post on my blog about configuring vim for writing Haskell. Save yourself some time and check it out! #vim #haskell <>

jihchi 08:37:22


Object destructuring (*) works for Arrays: &gt; const {0:a, 2:b, length:l} = ['foo', 'bar', 'baz']; &gt; a 'foo' &gt; b 'baz' &gt; l 3 (*) <>

jihchi 08:39:47


Just launched my Black Friday sale! 50% off all my courses: <> <> <> Enjoy! <>

jihchi 18:58:22


:bulb:GraphQL Server Basics :woman:‍:school: Apollo Client 2.0 by <|@peggyrayzis> :mortar_board:Angular &amp; Apollo tutorial on <> by <|@b_b4rry> :tv: <|@graphqlsummit> videos and more in issue 76 <>

jihchi 18:58:54


What's the best internationalization package for React? react-intl vs. i18next vs. js-lingui vs. ...? :point_right: <>

基本上我會覺得,無論選什麼,別選那種只能在 jsx 裡做的,脫離 jsx 就束手無策。

因為很多字串其實會放在非 jsx 的地方,例如 utility function,或甚至是 reducer 裡頭 @@
jihchi 19:06:51


:mag: Fun idea. Let's play #whatsInYourBundle!!! (RT!!) :mag_right: 1. Go install webpack-bundle-analyzer 2. Reply w/ image! 3. #webpack team will triage

kunl6 19:20:29
@kunl6 has joined the channel


jihchi 08:33:49


Dynamic ES6 module import() has arrived! Pretty groovy for lazy loading code. Read more about it from <|@mathias>: <>

jihchi 08:34:28


Dynamic import() is available in Chrome 63, Safari 11, EDGE 16. Using it, you can lazily load and execute JavaScript modules on demand. E.g. when you need to open a dialog, you can load the code for it. More info: <> Demo: <>

jihchi 08:34:58


Support for EditorConfig is almost there. If anyone is willing to test it and give us some feedback would be great: <>

jihchi 09:15:08

Hacker Noon

You don’t need to know “Dependency Injection” – Hacker Noon

I’ve recently been party to an interview for a front-end position where a colleague asked the candidate — “What do you know about…

mofas 09:45:05


I just figured out that the Emmet integration in <|@code> can automatically determine image width and height. It also works on images that aren't even in your project!

jihchi 09:50:31



govern - Component-based state management for React.

jihchi 09:53:33


Cosmos 3.0, the version you’ll fall in love with – Ovidiu Cherecheș – Medium

Three months ago I forced myself to make a decision. After years of on and off involvement with Cosmos, I had to either give it the…

mofas 10:35:04


I just published “FREE! Advanced React.js Lectures” <>