Inclusive Components
The first thing I was told when I embarked on learning web standards about twelve years ago was, "don't use tables for layout." This was sound advice in spirit, but not very well qualified. As a result, there have been some unfortunate interpretations. Using table markup inevitably results in a
reactjs.org
A JavaScript library for building user interfaces
:tada::tada::tada: I'm beyond excited to announce that Spectrum is now fully open source!! :tada::tada::tada: Come and help us build the future of online communities—together! :heart_eyes::heart_eyes::heart_eyes: :computer: Peep the code: <https://github.com/withspectrum/spectrum> :speech_balloon: Full announcement: <https://spectrum.chat/thread/556b4915-7269-46a7-96e6-f38446d14146>
GitHub
purescript-firkin - A UI library based on the incremental lambda calculus
Figma Design
Desperately seeking squircles – Figma Design
Figma’s search for the mysterious math behind the iOS shape
A data structure that I often find useful is a Binary Heap (aka Priority Queue!). A fun trick is to use a plain Array and some power-of-2 math to reduce the Binary Heap implementation down to something pleasingly simple :ok_hand:. :keyboard:: <https://gist.github.com/leebyron/0a7a2aaa51dcb5b02bc0b9a40188af79>
Upgrade to next 5.1 by MrOrz · Pull Request #93 · cofacts/rumors-site
Fixes #92 Next.js 5 supports universal webpack (webpack in server & client), so we can get rid of lots of previous settings that looked hacky :tada: .babelrc Removes env because it&#39;s already i...
Spring has arrived :seedling::cherry_blossom::tulip::hatching_chick: and so has another <https://twitter.com/code|@code> release: The March update is here :tada: Download: <https://code.visualstudio.com/download> and see what's new: <https://code.visualstudio.com/updates/v1_22>
f2e.kktix.cc
F2ETW & RGBA 社群五週年大聚來了！科技、設計的發展越來越快速、多元，不禁令人好奇未來會是什麼樣貌？讓我們拋開既有的習慣和思維，一起挖掘 FED / UI / UX 的各種可能！
<https://twitter.com/paulhtrott|@paulhtrott> <https://twitter.com/reactjs|@reactjs> <https://pbs.twimg.com/media/DaIpEGPWkAUw-J5.jpg>
<https://twitter.com/cvitullo|@cvitullo> <https://reactjs.org/docs/faq-ajax.html#example-using-ajax-results-to-set-local-state> <https://pbs.twimg.com/media/DaJx9FtUMAAYJut.jpg>
GoogleChromeLabs/webpack-libs-optimizations
webpack-libs-optimizations - Using a library in your webpack project? Here’s how to optimize it
<https://twitter.com/drakesgurl420|@drakesgurl420> Is this our newest viral meme #meta <https://pbs.twimg.com/media/DZ-Dh4MVoAALeSL.jpg>
GoDaddy Open Source Center
Introducing a fully extendable eslint plugin for JSON i18n translation files
Official GoDaddy open source engineering page, showcasing open source libraries and projects created by GoDaddy engineering teams.
Introducing Logpoints for Node.js in <https://twitter.com/code|@code> — a way to inject console.log's into your runnning app without changing your code or restarting. Read more :point_right:<https://code.visualstudio.com/updates/v1_22#_logpoints>
Underrepresented in the tech industry? Want to attend <https://twitter.com/strangeloop_stl|@strangeloop_stl> 2018 in September? We'd love to see you apply for a free ticket and optional travel/hotel support through Project Alloy — it's quick :grinning: <https://infinite-stream-53618.herokuapp.com/strange-loop-2018> <https://pbs.twimg.com/media/DackkiqWsAAHI7i.jpg>
An under-appreciated part of the Next.js design is that it *doesn't* server render subsequent pages. Instead it optimistically preloads them. This is a huge architectural advantage because it guarantees that the server version of both code and data can guarantee consistency.
Medium
Why React needed yet another animation library. Introducing: react-spring
Ever since i started developing i was fascinated by the vividness of animated applications, they felt alive. And we sure have come a long…
I'm from the island of Java, Indonesia. I am the Java Garbage Collector. <https://pbs.twimg.com/media/DZ8n2YXWsAESQ97.jpg>
There, now this meme is Twitter-friendly. <https://pbs.twimg.com/media/DabpJswUMAE-umP.jpg>
Performance of records in BuckleScript – Javier Chávarri – Medium
BuckleScript is a compiler backend, created by Hongbo Zhang, that allows to build apps using Reason or OCaml code, and produces clean…
YouTube
Empirical Analysis of Programming Language Adoption - Meyerovich, et al <https://buff.ly/2vdZmbg> OSS libs, existing code, and experience strongly influence developers when selecting a language for a project. Features such as performance, reliability, and simple semantics do not.
bucklescript - A backend for the OCaml compiler which emits JavaScript.
tinlizzie.org
An interactive essay on the joys and pitfalls of histograms
react-copy-write - :writing_hand: Immutable state with a mutable API
bucklescript.github.io
BuckleScript and Reason have a special `|.` syntax for dealing with various situations. This operator has many uses.
People keep asking me about CSS Grid "best practices", so I wrote a post with some ideas <https://buff.ly/2JQPcR6>
ATTN managers: I’m offering a new process consulting service where I 1. Listen to your team describe their process. 2. Write down what they tell me. 3. Give this document to you.
Redux 4 is here! :tada: Improved TypeScript definitions, bundled CJS and ES builds, better safety checks, and more small improvements. Enjoy! <https://github.com/reactjs/redux/releases/tag/v4.0.0>
:new: Video about using react-codemod to automatically rename any unsafe lifecycle hooks! <https://twitter.com/manor_isms/status/986256463914991618>
:video_camera: Rename Unsafe Lifecycle Hooks with react-codemod (6 mins) <https://youtu.be/UqLh2K9j-wk> :white_check_mark: Download react-codemod :white_check_mark: Learn jscodeshift options (dry run, print, etc…) :white_check_mark: Run rename-unsafe-lifecycles.js :tada: Unsafe lifecycle hooks automatically prepended with `UNSAFE_` :atom_symbol: #reactjs <https://pbs.twimg.com/media/Da_iYXPXkAIYTTe.png>
Over the years I’ve started to prefer code that is boring but easy to understand. I cringe when I crack open some dependency source code and find some “smart” abstractions that makes it painful to understand what’s going on as an outsider.
Hacker Noon
Two Years of Functional Programming in JavaScript: Lessons Learned
The article is not about learning FP principles or JavaScript FP libraries. There are numerous of good articles on this topic out there…
Redux 4 is here! :tada: Improved TypeScript definitions, bundled CJS and ES builds, better safety checks, and more small improvements. Enjoy! <https://github.com/reactjs/redux/releases/tag/v4.0.0>
dinero.js - :money_with_wings: An immutable library to create, calculate and format monetary values.
text-mask - Input mask for React, Angular, Ember, Vue, & plain JavaScript
regxr - A minimal, lightweight MacOS desktop application to check for regular expression pattern matches
Medium
Behavioral Programming with React: request, wait and block
Behavioral Programming (BP) is a paradigm coined by “Harel, D., Marron, A., & Weiss, G. (2012). Behavioral programming. Communications of…
The NodeSource Blog - Node.js Tutorials, Guides, and Updates
Understanding the Buffer Deprecation in Node.js 10
Shipping in Node.js 10 is a relatively uncontroversial fix for an extremely controversial issue in Node.js - the Buffer constructor. Learn about what's new!
Did Microsoft just create yet another dependency manager without lock files? And they see it as replacement for npm? <https://blogs.msdn.microsoft.com/webdev/2018/04/17/library-manager-client-side-content-manager-for-web-apps/>
fastmod - A fast partial replacement for the codemod tool
Designing very large (JavaScript) applications – Malte Ubl – Medium
This is a mildly edited transcript of my JSConf Australia talk. Watch the whole talk on YouTube.
react-circle - Renders a svg circle + progress, it just works :cupid:
If you are using babel-preset-env or autoprefixer with "last 2 versions" in your browserlist... stop doing that immediately. >>> <https://jamie.build/last-2-versions> <<< TL;DR - You are still supporting browsers that are dead or have no users, they are making your apps bigger for no reason <https://pbs.twimg.com/media/DbgRWoNUQAAa_p9.jpg>
The levels of testing code <https://pbs.twimg.com/media/DbdeEEJX4AAXni-.jpg>
I am so excited to see the release of what I honestly believe to be the next generation of styling web applications What an amazing piece of software released by <https://twitter.com/LinkedInEng|@LinkedInEng> and <https://twitter.com/chriseppstein|@chriseppstein> for the community :heart_eyes: <https://github.com/linkedin/css-blocks>
Node.js 10.0.0 has been released. <https://pbs.twimg.com/media/DbkqRwWU8AARFEI.jpg>
Interesting list of design systems/component libraries different companies have developed: <https://adele.uxpin.com> Crazy how many there are now. There’s gotta be a way we as an industry can stop reinventing the wheel. Could save everyone a ton of money and time.
now this is a cool <https://twitter.com/reasonml|@reasonml> feature: pick where you want your argument with curried functions <https://pbs.twimg.com/media/Dbjvy5UW0AAy6tV.jpg>
CSS at Scale: LinkedIn’s New Open Source Projects Take on Stylesheet Performance
Browsers use Cascading Style Sheets (CSS) to control the appearance of websites. From borders, fonts, and colors to layout, images, and animations, there are roughly 500 different style properties that can be declared with CSS. These properties are what make the visual diversity of the internet possible for your handheld device, desktop browser, and even your printer. Understanding the myriad style properties is a challenge for any front-end developer, but if you want to start an argument, bring up the question of how CSS selectors (the queries that assign style declarations to HTML elements) should be structured.
emmis - Create a chaining API for your application
hot-server - live-server with hot reloading
reason-react - Reason bindings for ReactJS
I felt that I wasn’t using the full power of my body when developing, so I added sounds :loud_sound: to webpack :point_right: <https://github.com/posva/sounds-webpack-plugin> This will change your life :raised_hands: :joy: Comes with 4 sounds (oof, nope, xpError and levelUp) :ok_hand: Add your owns :man_dancing:
I made a VGP (very good program) that makes it so it looks like I’m typing on slack whenever anyone else is typing, and stops when they stop. Everyone loves it so far and doesn’t find it annoying at all! <https://github.com/will/slacktyping>
Node.js v10 comes with <https://twitter.com/v8js|@v8js> v6.6+, meaning it supports async iterators & generators, including the `for await of` syntax. Readable streams already implement the protocol! <https://pbs.twimg.com/media/DbseeL-WAAAd_CJ.png>
<https://pbs.twimg.com/media/DbseeP3XcAELySW.png>
Soo <https://twitter.com/reasonml|@reasonml> folks, I've been working on a snazzy new playground (as part of my documentation generator). It's got lots of fancy autocomplete stuff to help you get to know the stdlib & package APIs. Try it out, and let me know what you think! <https://reason-react.surge.sh/playground.html> :gift: :tada: <https://pbs.twimg.com/media/DbxB8SwV4AAFAtw.jpg>
<https://pbs.twimg.com/media/DbxCN7mUQAAjA5P.jpg>
<https://pbs.twimg.com/media/DbxCZGsVwAAVFmf.jpg>
<https://pbs.twimg.com/media/DbxClHWUQAEjbds.jpg>
I made a meme <https://pbs.twimg.com/media/DbxXCjYUQAMZGzi.jpg>
<https://pbs.twimg.com/media/DbuEN6CWAAAIiZr.jpg>
reason-react - Reason bindings for ReactJS
:red_circle: <https://zeit.co/home>
YouTube
ZEIT Day Live Stream - YouTube
<https://zeit.co/> <https://zeit.co/day/>
"Optimizing Your Code with Babel" - <https://twitter.com/pranaygp|@pranaygp> <https://twitter.com/tom__fischer|@tom__fischer>
next.js - Framework for server-rendered or statically-exported React apps
Published my <https://twitter.com/code|@code> theme today :slightly_smiling_face: It’s focused on JS, happy to take PRs that fix it for other languages. <https://marketplace.visualstudio.com/items?itemName=gaearon.subliminal>
robinwieruch.de 
vuepress.vuejs.org 
regex101.com 
1
css-blocks.com 
LinkedIn