#frontend-tech

2018-05-01
mrorz 11:28:26
今天早上 renovate bot 幫升 dependency 時才驚覺 next.js 6.0 已經出了
前幾天明明都還是 beta 的說⋯⋯
mrorz 11:28:51
zeit 官方部落格好像還沒出介紹文？
mrorz 11:29:20
https://zeit.co/blog/next6 先把 URL 蓋好等著點
  • 👍1
2018-05-02
mofas 04:41:52
有人有用過react-loadable 加上 css module, 最後bundle css會碎掉的問題嗎
mofas 04:44:02
研究了一下是code splitting會inline css in js, 然後run js的時候在inject到page裡面去, 造成FOUC 😞
mofas 05:12:44
再用react-loadable之前 所有的css是打成一包抽到main.css去
jihchi 08:32:53
https://twitter.com/dgryski/status/991396790430711808?s=12
twitter
"Don't waste time reviewing code that is hard to understand, just ask for it to be clarified" <https://twitter.com/googletesting/status/991395038750957568>
twitter
Code Health: Understanding Code In Review <https://testing.googleblog.com/2018/05/code-health-understanding-code-in-review.html>
jihchi 08:51:58
https://twitter.com/john_papa/status/991111269674569733?s=12
twitter
VS <https://twitter.com/code|@code> does it again! Organize Imports Organizes &amp; sorts import statements on save! Just use the setting in your Insiders edition "editor.codeActionsOnSave": { "source.organizeImports": true }, Join <https://twitter.com/burkeholland|@burkeholland> and at //Build next week to see more tips!
mrorz 14:10:54
好像只有一個大 live stream 檔？
Optimizing Your Code with Babel 應該在 121:19 大概20min
  • 👍1
jihchi 19:25:56
https://twitter.com/h5bp/status/991635807927758849?s=12
twitter
HTML5 Boilerplate 6.1.0 Released! :fireworks::fireworks::fireworks: <https://twitter.com/roblarsenwww|@roblarsenwww> writes up the release here: <http://htmlcssjavascript.com/web/html5-boilerplate-6-1-0-released/> Thanks to everyone who contributed, with a special shout-out to <https://twitter.com/christianoliff|@christianoliff> who kept the release rolling along smoothly :trophy:
mofas 20:50:33
等過幾天youtube上面會放吧
mofas 22:17:01
http://diana-adrianne.com/purecss-francine/
Built by CSS
diana-adrianne.com
Francine
Pure CSS Oil Painting - by Diana Smith aka cyanHarlow
2018-05-03
mofas 07:16:44
https://events.google.com/io/schedule/?section=may-8
events.google.com
Google I/O 2018
Google I/O brings together developers from around the globe for 3-days of technical sessions, codelabs, interactive demos, and more. Explore the Schedule.
mofas 07:16:48
IO is coming
mofas 08:33:36
https://www.polymer-project.org/blog/2018-05-02-roadmap-update
jihchi 08:51:56
https://twitter.com/ianmlewis/status/991626421952008197?s=12
twitter
Finally gVisor is open source! A new sandbox container runtime that provides strong isolation with a small footprint <https://cloudplatform.googleblog.com/2018/05/Open-sourcing-gVisor-a-sandboxed-container-runtime.html>
jihchi 09:34:38
https://github.com/lipis/prettier-setup
GitHub
lipis/prettier-setup
prettier-setup - Basic configuration for Prettier, ESLint and Husky.
mofas 10:02:46
https://developers.facebook.com/videos/?category=f8_2018
Facebook for Developers
Facebook for Developers - Videos
Facebook for Developer's videos
mofas 10:03:01
今年F8 沒啥精彩的新聞
jihchi 10:11:36
感謝大大
2018-05-05
Yi-Hua 13:11:24
@yihua1218 has joined the channel
2018-05-08
mofas 07:21:47
https://twitter.com/dan_abramov/status/993503396622667783
  • 👍2
  • 💪1
mofas 07:21:52
Excellent talk indeed
jihchi 08:45:12
Sublime Text 3.1 Released
https://www.sublimetext.com/blog/articles/sublime-text-3-point-1
  • 👍1
mofas 10:33:28
https://github.com/kayceesrk/effects-examples
Examples to illustrate the use of algebraic effects in Multicore OCaml
GitHub
kayceesrk/effects-examples
effects-examples - Examples to illustrate the use of algebraic effects in Multicore OCaml
  • 👍1
2018-05-09
mofas 07:50:15
https://gist.github.com/gaearon/d85dccba72b809f56a9553972e5c33c4
mofas 07:50:24
A Gentle Introduction to Prepack, Part 1
jihchi 08:38:22
https://twitter.com/chromedevtools/status/993901594293878784?s=12
jihchi 14:30:43
https://gist.github.com/mofas/0ee59c81b305dbecabdcc33c16f3ff90
  • 1
  • 3
  • 3
jihchi 21:52:28
https://twitter.com/ssh4net/status/994105335299297280?s=12
jihchi 21:55:26
https://twitter.com/palashv2/status/994148463028981760?s=12
2018-05-10
jihchi 08:36:53
https://twitter.com/ykro/status/993899819549655040?s=12

XD
jihchi 08:40:53
https://twitter.com/igrigorik/status/994278130394124289?s=12
jihchi 08:47:42
https://twitter.com/eggheadio/status/994275727527874561?s=12
mofas 14:16:51
為啥不再會有twitter縮圖惹
jihchi 14:32:13
對啊..
Michael Hsu 14:34:46
頁面 meta 壞了？
jihchi 18:53:58
https://twitter.com/ryanseddon/status/994457203296776192?s=12
jihchi 18:54:30
https://twitter.com/mgechev/status/994458400288210944?s=12
mofas 23:33:08
https://www.youtube.com/watch?v=mfuE53x4b3k&t=0s&index=34&list=PLOU2XLYxmsIInFRc3M44HUTQc3b_YJ4-Y
YouTube
What's new in Chrome DevTools (Google I/O '18)
mofas 2018-05-11 09:26:42
從29:19 有展示eager evaluation. 這feature超酷的
jihchi 2018-05-11 09:51:41
Chrome 好強
mofas 23:33:15
youtube沒壞
2018-05-11
jihchi 08:38:44
https://twitter.com/codewisdom/status/994623195113230336?s=12
mofas 09:26:42
Replied to a thread: 2018-05-10 23:33:08
從29:19 有展示eager evaluation. 這feature超酷的
  • 🔥2
jihchi 09:51:41
Chrome 好強
Michael Hsu 10:41:09
https://twitter.com/acdlite/status/994751858244665346
jihchi 2018-05-11 11:10:33
Suspense!
jihchi 11:08:57
https://github.com/isomorphic-git/isomorphic-git
GitHub
isomorphic-git/isomorphic-git
isomorphic-git - A pure JavaScript implementation of git for node and browsers!
jihchi 11:10:33
Replied to a thread: 2018-05-11 10:41:09
Suspense!
jihchi 11:11:28
https://github.com/Thoughtscript/x_team_build_tool_round_up
GitHub
Thoughtscript/x_team_build_tool_round_up
x_team_build_tool_round_up - X-Team Rollup v Webpack v Parcel comparison!
mofas 12:10:50
掃完IO關於 web 相關的talk 了
mofas 12:10:55
今年還是很無聊 😞
jihchi 12:11:06
😢
mofas 12:11:39
就上面那個比較有趣, 其他PWA, Angular, Polymer, Lighthouse 沒啥亮點
mofas 12:16:17
Web component (lit-html) 有進步一點 不過用起來跟react有87分像
jihchi 13:13:56
https://twitter.com/nikgraf/status/994498632283017216
jihchi 14:36:29
React suspense 出來應該會拉開差距（？）
2018-05-12
mofas 21:27:00
https://homepages.inf.ed.ac.uk/wadler/papers/marktoberdorf/baastad.pdf
2018-05-13
mofas 09:53:54
https://twitter.com/andrestaltz/status/995369061935706112
mofas 09:54:15
Exactly true when you learned continuation.
mofas 09:54:27
https://pbs.twimg.com/media/DdBC383XcAEnveH.jpg:large
2018-05-15
jihchi 08:39:08
https://twitter.com/dan_abramov/status/996177875266097152?s=12
jihchi 09:33:47
https://svelte.technology/repl?version=2.6.1&gist=3435b678014ddc21731d33d893199ec2
svelte.technology
Svelte
The magical disappearing UI framework
2018-05-16
mofas 12:36:14
禮拜人要換公司了 https://twitter.com/leeb/status/996460998545498112?s=09
  • 😍1
jihchi 13:52:20
區塊鏈正夯
Michael Hsu 13:57:21
Robinhood 跟 Cobinhood 的是有關係的嗎？
mofas 19:08:05
It is really hard to understand what you are saying = =
Why I don't like to discuss tech in Chinese.
yhsiang 20:38:54
Cobinhood 從 robinhood 那邊得到靈感 所以做 crypto robinhood 所以叫 cobinhood
  • 😳2
yhsiang 20:39:05
後面一段是我猜的
yhsiang 20:39:15
不過前面的靈感參考是對的
2018-05-17
jihchi 08:35:08
https://twitter.com/sindresorhus/status/996818571325034496?s=12
jihchi 08:36:42
https://twitter.com/zeithq/status/996866206475923460?s=12
mofas 10:45:41
https://twitter.com/brad_frost/status/996792248107978756?s=19
jihchi 11:15:27
Slack 不會幫忙縮圖有點麻煩
mofas 16:10:05
https://github.com/braposo/graphql-css
GitHub
braposo/graphql-css
graphql-css - A blazing fast CSS-in-GQL™ library.
mofas 16:10:12
不知道要不要吐槽這東西- -
jihchi 16:11:32
這是搞笑的吧
jihchi 19:13:07
https://twitter.com/sveltejs/status/996914843360907264?s=12
jihchi 19:16:11
https://twitter.com/kennethreitz/status/996931026441134080?s=12
jihchi 19:19:50
https://twitter.com/burkeholland/status/996839449848926211?s=12
mofas 22:00:56
https://twitter.com/ReactEurope/status/997114312362790912
React native in web.
  • 💪1
mofas 22:01:12
484 這樣比較universal
2018-05-18
jihchi 08:49:04
https://twitter.com/jaredforsyth/status/997148166318411778?s=12
jihchi 08:58:35
https://twitter.com/_developit/status/997132016612270081?s=12
mofas 20:25:58
自製twitter縮圖
mofas 20:26:54
https://www.youtube.com/watch?v=Z_gmmAAT-HI
YouTube
ReactEurope 2018 Day 2 afternoon session
mofas 20:26:55
live now
mofas 21:06:32
Bret Victor 的project也有人去react europe 講
https://youtu.be/4u5Mgoiq6ks?t=1h38m12s
YouTube
ReactEurope 2018 Day 2 morning session
mofas 21:06:48
這是什麼奇怪的相遇 ..
mofas 21:07:43
還蠻神奇的
2018-05-19
jihchi 10:55:01
https://github.com/glennsl/refetch
GitHub
glennsl/refetch
refetch - A strongly typed and immutable API built on top of the `fetch` standard
mofas 14:29:50
https://twitter.com/headinthebox/status/997499854321405953?s=19
mofas 14:30:14
I'm extremely impressed by the elegance and compositionality of TypeScript's type system, especially because all the advanced dependent types features so naturally spring from the desire to support real-world patterns in JavaScript.
2018-05-21
yu_ren 00:30:57
@yuren.pan.0117 has joined the channel
jihchi 11:32:15
https://github.com/BuckleScript/bucklescript/pull/2816
GitHub
release 3.1.0 by bobzhang · Pull Request #2816 · BuckleScript/bucklescript
mofas 13:44:47
https://twitter.com/dan_abramov/status/998258353255088128
mofas 13:44:53
Thanks to @a_cederstrom, @bugzpodder, and many others, webpack 4 has finally landed in Create React App master!
mofas 13:53:18
https://blog.angularindepth.com/angular-ivy-change-detection-execution-are-you-prepared-ab68d4231f2c
Angular In Depth
Angular Ivy change detection execution: are you prepared?
Let’s see what Angular cooks for us
jihchi 21:35:45
https://twitter.com/dan_abramov/status/998516986006114304?s=12
  • 💪1
2018-05-22
mofas 10:52:27
https://www.youtube.com/watch?v=oTcDmnAXZ4E&index=11&list=PLCC436JpVnK1X7atG6EIz467Evs4TMX_5&t=0s
YouTube
Immutable Application Architecture - Lee Byron (@leeb) at @ReactEurope 2018
jihchi 19:11:02
https://twitter.com/compuives/status/998571075805081600?s=12
mofas 22:27:37
https://www.youtube.com/watch?v=-vYak5hEGrY
YouTube
Dominik Kundel - Introduction to Web Security | JSUnconf 2018
mofas 22:27:55
Good talk
2018-05-23
jihchi 08:35:13
https://twitter.com/guillaume_slls/status/998955795671810049?s=12
jihchi 08:39:57
https://twitter.com/bobzhang1988/status/998943421816422400?s=12
jihchi 08:42:32
https://twitter.com/thekitze/status/998977898274086915?s=12
mofas 10:14:44
https://www.youtube.com/watch?v=WYWVGQKnz5M
YouTube
Stop writing code - Sunil Pai aka @threepointone at @ReactEurope 2018
mofas 10:16:02
https://www.youtube.com/watch?v=fCXYA3lZTbo
YouTube
A Journey Through React Apollo - Peggy Rayzis aka @peggyrayzis at @ReactEurope 2018
jihchi 18:48:36
https://twitter.com/mathias/status/999101901697363969?s=12
2018-05-24
jihchi 08:43:10
https://twitter.com/kentcdodds/status/999429040917401602?s=12
jihchi 18:47:18
https://twitter.com/giuseppegurgone/status/999568241415540736?s=12
jihchi 18:48:17
https://twitter.com/reasonml/status/999535271128416256?s=12
jihchi 18:52:11
https://twitter.com/bestander_nz/status/999412619764162560?s=12
2018-05-25
jihchi 08:39:05
https://twitter.com/gatsbyjs/status/999684072501792768?s=12
jihchi 08:46:19
https://twitter.com/dceddia/status/999377015416422402?s=12
jihchi 08:49:58
https://twitter.com/fbjest/status/999729514161852417?s=12
mofas 18:23:50
https://video.twimg.com/tweet_video/Dd--lsdWkAENEZb.mp4
mofas 18:23:58
Watch out your form validation in js XD
jihchi 18:28:36
我看到是說這是 Google 的 form
jihchi 20:19:40
https://wiredjs.com/showcase.html
wiredjs.com
Wired Elements
Common UI Elements with a sketchy hand-drawn look.
2018-05-26
jihchi 20:30:14
https://github.com/hybridsjs/hybrids
GitHub
hybridsjs/hybrids
hybrids - UI library for creating Web Components with simple and functional API
2018-05-27
jihchi 15:37:21
https://www.mint-lang.com/
mint-lang.com
Mint - A refreshing language for the front-end web.
Mint is a refreshing programming language for the front-end web.
2018-05-28
jihchi 08:37:48
https://twitter.com/reasonml/status/1000571437894127616?s=12

The BuckleScript doc site now supports toggling between Reason/OCaml syntax!
jihchi 08:40:18
https://twitter.com/reasonml/status/1000213158236045314?s=12

Reason 3.2.0 is here - quality of life improvement!

reasonml.github.io/blog/2018/05/2…
jihchi 08:48:39
https://twitter.com/compuives/status/1000043470164242432?s=12

I got `react-hot-loader` working in @codesandboxapp!

codesandbox.io/s/43x5j1vr49
jihchi 09:05:39
ServiceWorker Cookbook
https://serviceworke.rs/
jihchi 11:33:57
Replied to a thread: 2018-05-27 15:37:21
https://news.ycombinator.com/item?id=17161533
mofas 17:28:29
https://www.youtube.com/watch?v=XvTsxa9i13o&list=PLBnKlKpPeagnvROrqc8zu-iboKUajg0BC
YouTube
Pranay Prakash and Thomas Fischer: Optimizing Your Code with Babel
  • 👍2
mofas 17:28:43
Zeit day talk 上線
mofas 17:28:49
這是最cool的那個talk
jihchi 20:07:47
http://keleshev.com/composable-error-handling-in-ocaml
2018-05-29
mofas 00:13:31
Another talk you would not want to miss
mofas 00:13:36
https://www.youtube.com/watch?v=z-6JC0_cOns
YouTube
Andrew Clark: React Suspense
  • 👍1
jihchi 07:18:16
https://github.com/jaredly/reason-language-server/releases/tag/1.0.0-alpha1
GitHub
jaredly/reason-language-server
reason-language-server - A language server for reason, in reason
jihchi 08:39:20
x0: Making React Component Development Stupid Simple
https://compositor.io/blog/x0-making-react-component-development-stupid-simple/
compositor.io
x0: Making React Component Development Stupid Simple
We’re big fans of the KISS principle at Compositor, and we think anything that poses a barrier to the creative process can really affect the quality of the work you do.
jihchi 08:42:02
https://twitter.com/wesbos/status/1001164727987458048?s=12
jihchi 08:46:34
https://twitter.com/hiddlestomas/status/999946645847592960?s=12
jihchi 08:47:38
https://twitter.com/blainebublitz/status/1001195158539403264?s=12
jihchi 09:03:54
OpenTable Tech UK Blog
http://tech.opentable.co.uk//blog/2018/05/10/monads-explained-by-a-imperative-programmer/
jihchi 20:16:27
https://github.com/alangpierce/sucrase
GitHub
alangpierce/sucrase
sucrase - Super-fast alternative to Babel for when you can target modern JS runtimes
jihchi 20:16:31
https://survivejs.com/blog/fastpack-interview/
SurviveJS
Fastpack - Pack JavaScript code fast and easy - Interview with Oleksiy Golovko
Tools like browserify and webpack popularized the idea of bundling. The idea is to transform your w…
2018-05-30
jihchi 08:24:37
https://twitter.com/zachcodes/status/1001525353171562496?s=12
jihchi 08:25:44
https://twitter.com/mylesborins/status/1001522729881931776?s=12

🇩🇪🇩🇪🇩🇪🇩🇪🇩🇪🇩🇪

Happy @nodejs current release day

$ nvm install v10.3.0

Lots of nasty bugs got fixed and also npm 6.1.0!

🇩🇪🇩🇪🇩🇪🇩🇪🇩🇪🇩🇪
  • 👍2
jihchi 08:28:50
https://twitter.com/fahad19/status/1001537380745121792?s=12

Introducing ProppyJS! 🎉🎉🎉

🚀 1.5kB #JavaScript library
🔥 Functional props composition for components
⚛️ Same API for @reactjs, @preactjs, @vuejs
💥 Integrates with #Redux and #RxJS
👉 Docs: proppyjs.com
mrorz 2018-05-30 10:09:28
generalized 版本的 recompose 嗎
jihchi 2018-05-30 10:09:44
Yeap, agnostic of framework
jihchi 2018-05-30 10:10:24
分成 `core` 跟對應每個 framework 的 `integration`
mrorz 10:09:28
generalized 版本的 recompose 嗎
jihchi 10:09:44
Yeap, agnostic of framework
jihchi 10:10:24
分成 `core` 跟對應每個 framework 的 `integration`
mofas 18:19:34
https://twitter.com/rauchg/status/1001502821320048640
mrorz 2018-05-30 18:33:58
唔喔原來 nuxt 已經有了 nuxt-start
mrorz 18:33:58
唔喔原來 nuxt 已經有了 nuxt-start
mofas 23:20:58
https://www.youtube.com/watch?v=cAKYQpTC7MA
YouTube
Delightful JavaScript Testing with Jest
2018-05-31
jihchi 08:39:22
https://twitter.com/fbjest/status/1001872809495318528?s=12

Jest 23: :fire: Blazing Fast Delightful Testing

All of the new features, gifs, summit, videos and hashtags are summed up in our Jest 23 blog post. Don't miss it!
  • 👍1
jihchi 08:40:28
https://twitter.com/getcompositor/status/1001860844752433153?s=12

Say hello to Kit, a set of tools for developing, documenting, and testing React components ⚛️
jihchi 08:45:39
https://twitter.com/youyuxi/status/1001827456293236737?s=12

If you are using Yarn workspaces for a Node.js monorepo, make sure to use eslint-plugin-node and turn on the no-extraneous-require rule. I learned it the hard way...
jihchi 09:45:45
https://github.com/vladocar/nanoJS/
GitHub
vladocar/nanoJS
nanoJS - Minimal standalone JS library for DOM manipulation
  • 👍1
mofas 17:06:49
https://github.com/GoogleChromeLabs/prerender-loader
GitHub
GoogleChromeLabs/prerender-loader
prerender-loader - :newspaper: Painless universal pre-rendering for Webpack.
mofas 17:07:00
我很好奇這要怎麼處理router 😞
mofas 17:07:24
https://medium.com/airbnb-engineering/reconciling-graphql-and-thrift-at-airbnb-a97e8d290712
Medium
Reconciling GraphQL and Thrift at Airbnb – Airbnb Engineering &amp; Data Science – Medium
Our frontend engineers wanted rapid iteration and flexibility from GraphQL, while our backend engineers wanted stability and specificity…