#frontend-tech
2018-08-01
```
If you want to supercharge your VS Code setup, here’s a bunch of great extensions and themes.
↬ Techniques: VS Code Can Do That?
https://vscodecandothat.com
↬ VS Code Extensions
https://medium.freecodecamp.org/favorite-vs-code-extensions-2017-786ea235812f …
↬ VSCodeThemes
https://vscodethemes.com
Any other resources you’d recommend?
```
If you want to supercharge your VS Code setup, here’s a bunch of great extensions and themes.
↬ Techniques: VS Code Can Do That?
https://vscodecandothat.com
↬ VS Code Extensions
https://medium.freecodecamp.org/favorite-vs-code-extensions-2017-786ea235812f …
↬ VSCodeThemes
https://vscodethemes.com
Any other resources you’d recommend?
```
conf.reactjs.org
React Conf 2018 is the official Facebook React event. This year's event will be held in Henderson, Nevada.
- 🎉1
Offical React Conf!
YouTube 
2018-08-02
https://twitter.com/reactjs/status/1024745321987887104?s=12
We've just released React DOM 16.4.2 to address a security vulnerability (CVE-2018-6341) in ReactDOMServer.
We've just released React DOM 16.4.2 to address a security vulnerability (CVE-2018-6341) in ReactDOMServer.
Medium
Building interactive sites can involve sending JavaScript to your users. Often, too much of it. Have you been on a mobile page that looked…
Exercism
ReasonML is a strongly typed functional language which compiles to both Javascript and native.
2018-08-03
https://twitter.com/james_k_nelson/status/1024980685507973122?s=12
If you've been wondering what getSnapshotBeforeUpdate() is useful for in #reactjs, you're not alone. But today I found a use!
I want my console component to scroll to the bottom after update, but only if it was already scrolled down *before* the update.
reactjs.org/docs/react-com…
If you've been wondering what getSnapshotBeforeUpdate() is useful for in #reactjs, you're not alone. But today I found a use!
I want my console component to scroll to the bottom after update, but only if it was already scrolled down *before* the update.
reactjs.org/docs/react-com…
https://twitter.com/jamiebuilds/status/1022568918949408768?s=12
The three browsers holding JavaScript back the most are:
1) IE 11 (2.7% of the web)
2) Android 4.4-4.4.3 (0.94% of the web)
3) Chrome 49 (0.71% of the web)
If we stopped supporting these browsers, we wouldn't have to transform most modern JavaScript syntax features... (cont)
The three browsers holding JavaScript back the most are:
1) IE 11 (2.7% of the web)
2) Android 4.4-4.4.3 (0.94% of the web)
3) Chrome 49 (0.71% of the web)
If we stopped supporting these browsers, we wouldn't have to transform most modern JavaScript syntax features... (cont)
https://twitter.com/js_tut/status/1024791994231607297?s=12
After I released the Complete Flex diagram tutorial, lots of people still asked questions about how it worked. True. You can't fully explain Flex by static diagrams. So I'm creating an animated series.
(this is an unedited draft.)
#100daysofcode #javascript #reactjs #vuejs
After I released the Complete Flex diagram tutorial, lots of people still asked questions about how it worked. True. You can't fully explain Flex by static diagrams. So I'm creating an animated series.
(this is an unedited draft.)
#100daysofcode #javascript #reactjs #vuejs
七彩console.log
- 🌈2
The NodeSource Blog - Node.js Tutorials, Guides, and Updates
The entire V8 compiler pipeline was overhauled and shipped with Node.js version 8. This post investigates what speed improvements we can expect as a result.
2018-08-04
Awesome React
Abstract: One of the things I love about React is how easy it is to encapsulate UI code into a component. I love this because it makes reuse of those components easy. But is it simple? I've made my fair share of components that had to accept a bunch of props to handle a growing list of different use cases resulting in a complex render function full of conditional statements and a confusing API for people using this "reusable" component. Eventually it becomes too much and I had to make a new version of the same component to handle slightly different use cases. Lots of code/bug duplication there because my reusable component wasn't reusable enough. It wasn't simple enough. There are patterns that have emerged in React that allow you to promote code reuse without sacrificing the simplicity or flexibility of the component. In this talk we’ll cover some of these patterns that will make your React components more useful.
Chain react 2018 all video uploaded
Kent C. Dodds 繼續推廣他在downshift的理念. 如何避免props爆炸
2
2
2018-08-05
brandur.org
How we overvalue the wrong technology and novel aspects of interface design at the expense of substantial gains to our productivity.
現在react community 突然都開始玩framer X
- 🔥2
So cool
2018-08-07
https://twitter.com/mjackson/status/1026590000484216833
Twitter as your github issue. Again, presented by Dan!
Twitter as your github issue. Again, presented by Dan!
- 😂1
chatbot lol
2018-08-08
其實Google front-end還是很強
但是強是強在針對每一個需求 手工刻藝術品...
從Google Map 的canvas globe map, Gmail Input, 到 Google Photo grid layout 每一個都是特化的寫法 來最大化效能 ...
但是強是強在針對每一個需求 手工刻藝術品...
從Google Map 的canvas globe map, Gmail Input, 到 Google Photo grid layout 每一個都是特化的寫法 來最大化效能 ...
- 👍3
有時候 99% 公司要的只是大量的table和form去操作資料庫 或是靜態網頁來呈現資訊而已.. 所以framework還是有存在價值
Medium
Signals the rebirth of Dart as a mainstream programming language for mobile and web development
好想開賭盤看Dart 2 一年後倒底是會活還是會死
- ⤵️1
- ⤴️1
2018-08-09
https://mobile.twitter.com/dan_abramov/status/1027248875072114689
Okay, I give in. I wrote a guide on the most scalable file structure for React projects. I’m using it every day. Best part: it works for Vue projects too. Hope it’s helpful! :sparkles: (link: http://react-file-structure.surge.sh/) react-file-structure.surge.sh
Okay, I give in. I wrote a guide on the most scalable file structure for React projects. I’m using it every day. Best part: it works for Vue projects too. Hope it’s helpful! :sparkles: (link: http://react-file-structure.surge.sh/) react-file-structure.surge.sh
Medium
Egg. On. Face. I just got done with no fewer than 3 articles and 3 YouTube videos bragging about how great my design work has been lately…
https://twitter.com/dan_abramov/status/1027383357011845120?s=12
Ever got bitten by React component stacks only including index.js because your naming convention for every component is FolderName/index.js?
I just merged a PR that should fix that. Now if the filename is index.js, we'll show the folder name too.
Ever got bitten by React component stacks only including index.js because your naming convention for every component is FolderName/index.js?
I just merged a PR that should fix that. Now if the filename is index.js, we'll show the folder name too.
ptsjs.org 
GitHub
sclack - The best CLI client for Slack, because everything is terrible!
- 👍1
2018-08-10
https://twitter.com/threepointone/status/1027660980342468608?s=12
if you want to play with suspense -
- checkout facebook/react
- set enableSuspense = true in ReactFeatureFlags.js
- yarn build
- copy build/dist/* to some dir in your project
- setup alias: {react: ‘dir/react.whatever.js’ (and react-dom, etc) in webpack/parcel/etc config
- done!
if you want to play with suspense -
- checkout facebook/react
- set enableSuspense = true in ReactFeatureFlags.js
- yarn build
- copy build/dist/* to some dir in your project
- setup alias: {react: ‘dir/react.whatever.js’ (and react-dom, etc) in webpack/parcel/etc config
- done!
- 💪1
blog-en.tilda.cc
Simple layout and design tips to help you create a stunning webpage
- 😎1
2018-08-11
graphqurl - curl for GraphQL with autocomplete, subscriptions and GraphiQL. Also a JS library
好像有這麼一點用處...
不過直接用graphiQL好像還是比較快
嗯 xd
Medium
Over the past few months, we’ve been working really hard on the next generation of Vue CLI, the standard build toolchain for Vue…
現在看起來React的 CLI真的是最爛的...
zeit.co 
React CRA ?! 算我們想的那種 CLI 嗎⋯⋯
dumper.js - A better and pretty variable inspector for your Node.js applications
2018-08-12
There is no react CLI.
2018-08-13
academictorrents!
http://academictorrents.com/browse.php?c7=1&search=coursera&page=0
所有coursera的歷史好課都還在 lol
http://academictorrents.com/browse.php?c7=1&search=coursera&page=0
所有coursera的歷史好課都還在 lol
有推薦必收藏的嗎？
推了你也沒時間上吧..
先念SICP就贏一半
有推薦必收藏的嗎？
推了你也沒時間上吧..
先念SICP就贏一半
- 😍1
2018-08-14
https://twitter.com/pedronauck/status/1029048461738614785?s=12
Docz v0.10.0 with a lot of good new features 🚀🎉
github.com/pedronauck/doc…
:hourglass_flowing_sand: Fetch data on documents
:tv: Edit playground code
:nail_care: Change playground theme
:bookmark: Resolve markdown files
:link: Auto Github link
:zap: A lot of bug fixes and improvements
#docz #javascript #react
Docz v0.10.0 with a lot of good new features 🚀🎉
github.com/pedronauck/doc…
:hourglass_flowing_sand: Fetch data on documents
:tv: Edit playground code
:nail_care: Change playground theme
:bookmark: Resolve markdown files
:link: Auto Github link
:zap: A lot of bug fixes and improvements
#docz #javascript #react
2018-08-15
Medium
Here’s my project in GSoC 2018: Improve tree-shaking for webpack, a widely used JS code bundler.
react-move - React Move :cyclone: Beautiful, data-driven animations for React
dayjs - :alarm_clock: Day.js 2KB immutable date library alternative to Moment.js with the same modern API
2018-08-16
The fastest bundler for JS written in Rust.
100x faster than browseify. I guess 10x faster than Rollup.js
https://twitter.com/housecor/status/1029721142901334017?s=12
Jest 23.5 now supports .each statements: lay out multiple scenarios in a tabular format! Much more concise and readable than copy/pasting tests for each scenario.
Example with 4 scenarios:
Before: 68 lines, copy/pasted :-1:
After: 12 lines 👍
More info: buff.ly/2ODRnJk
Jest 23.5 now supports .each statements: lay out multiple scenarios in a tabular format! Much more concise and readable than copy/pasting tests for each scenario.
Example with 4 scenarios:
Before: 68 lines, copy/pasted :-1:
After: 12 lines 👍
More info: buff.ly/2ODRnJk
https://twitter.com/alexandereardon/status/1027782544467668992?s=12
I just published “Beautiful drag and drop: a year in review”
I just published “Beautiful drag and drop: a year in review”
MS DV新作
這東西有機會跟excel一樣威猛呀
打爆 google data studio
整個是web based
build on React
現在的MS又要再來個黃金十年了嗎
徵求大大幫refer MS
react-async-elements - Suspense-friendly async React elements for common situations
2018-08-17
React rally, john's talk is excellent
這次React Rally 品質還不錯
有三個talk目前覺得值得聽
https://jovial-hypatia-a56434.netlify.com/#/
https://jovial-hypatia-a56434.netlify.com/#/
One of them
🙏分享
2018-08-18
d3+react live coding. 很強
kent 的雖然重複講了 但是還不錯
unmaintainable-code - A more maintainable, easier to share version of the infamous <http://mindprod.com/jgloss/unmain.html>
2018-08-19
https://twitter.com/sharifsbeat/status/1030743240453120001?s=12
Created a list of basic and very useful Ramda List functions.
This might be useful if you're starting with Ramda or need a way to quickly lookup possible functions or need a printed list.
Created a list of basic and very useful Ramda List functions.
This might be useful if you're starting with Ramda or need a way to quickly lookup possible functions or need a printed list.
YouTube 
2
Some video is uploaded
這一個good
- 👍1
This is good.
2018-08-20
Add `let!foo` sugar for continuation-passing-style by jaredly · Pull Request #2140 · facebook/reasonThis will allow us to get most of the benefits of lwt&#39;s ppx or ppx_let without baking in any specific implementation. I&#39;ve included in the test an example of binding the option monad, but y...
2018-08-21
GitHub - Rich-Harris/agadoo: Check whether a package is tree-shakeable
https://github.com/Rich-Harris/agadoo
https://github.com/Rich-Harris/agadoo
BuckleScript 4.0.0 (Part Two) · BuckleScript
https://bucklescript.github.io/blog/2018/07/17/release-4-0-0II
https://bucklescript.github.io/blog/2018/07/17/release-4-0-0II
bucklescript.github.io
`bs-platform` 4.0.0 introduces a new runtime representation for optionals.
BuckleScript 4.0.0 (Part One) · BuckleScript
https://bucklescript.github.io/blog/2018/07/17/release-4-0-0
https://bucklescript.github.io/blog/2018/07/17/release-4-0-0
`bs-platform` 4.0.0 is released! It has some nice features that we want to share with you, a more detailed list of changes is available [here](<https://github.com/BuckleScript/bucklescript/blob/master/Changes.md#400>)
puppeteer-recorder - Puppeteer recorder is a Chrome extension that records your browser interactions and generates a Puppeteer script.
2018-08-22
https://github.com/IniZio/reim
https://github.com/pedronauck/reworm
怎麼這麼多這種 state management 的 api 還一樣
https://github.com/pedronauck/reworm
怎麼這麼多這種 state management 的 api 還一樣
- 😛1
不知道用起來感覺如何
JS 太多人寫惹 (欸
不知道用起來感覺如何
Replied to a thread: 2018-08-22 09:10:50
JS 太多人寫惹 (欸
因為 ECMAScript 還不把 immutable data structure 弄出來
2018-08-23
2018-08-24
Look like we will have new winner soon.
Tania Rascia
I've been hearing about React since I first started learning JavaScript, but I'll admit I took one look at it and it scare
2018-08-27
Track compressed Webpack asset sizes over time. Contribute to GoogleChromeLabs/size-plugin development by creating an account on GitHub.
2018-08-28
Medium
A glimpse into how Google Maps works, and possible improvements
Google map design blog!!
說到這個 我最近才知道某門課老師是TC 39 member
- 😍1
2018-08-29
Writing for readability with declarative arrays – LogRocket
https://blog.logrocket.com/writing-for-readability-with-declarative-arrays-64f0b1a807f3
https://blog.logrocket.com/writing-for-readability-with-declarative-arrays-64f0b1a807f3
LogRocket
By manipulating and digesting your arrays in a declarative fashion, you can produce much more readable code. Here are a few ways to do…
@maria has joined the channel
The Enterprise™ programming language. Contribute to joaomilho/Enterprise development by creating an account on GitHub.
```
Dan Abramov Jun 15
I also think it’s a miracle that React, for all its “unconventional” choices like immutability, top-down data flow, lack of mutation tracking, transactional updates, ever became so popular. Maybe it was a temporary anomaly, and it’s time to dial it down a bit. 🙂
```
Dan Abramov Jun 15
I also think it’s a miracle that React, for all its “unconventional” choices like immutability, top-down data flow, lack of mutation tracking, transactional updates, ever became so popular. Maybe it was a temporary anomaly, and it’s time to dial it down a bit. 🙂
```
- 👍1
Totally agree.
- ➕1
2018-08-31
remysharp.com
I'm not sure many web developers can get away without visiting the command line. As for me, I've been using the command line since 1997, first at university when I felt both super cool l33t-hacker and simultaneously utterly out of my depth. Over the years my command line habits have improved and I often search for smarter tools for the jobs I commonly do. With that said, here's my current list of improved CLI tools.