#448 — August 2, 2019

Read on the Web

JavaScript Weekly

Hotkey: Trigger an Action on an Element When a Keyboard 'Hotkey' is Pressed — Want quick and simple keyboard shortcuts for elements on your page? Set the data-hotkey attribute and use Hotkey. It even supports multiple keys pressed in sequence. GitHub built and uses it (view source on any GitHub page and look for the data-hotkey attributes).


Electron 6.0 Released — Just 3 months after version 5 was released, the popular JavaScript-based cross-platform desktop app building platform hits version 6 and uses Chromium 76, Node 12.4, and V8 7.6 under the hood.

Electron.js Team

New Introduction to Gatsby Course with Jason Lengstorf — Build blazing 🔥 fast website by default with Gatsby. In this course, you'll build up a blog from scratch and deploy your brand new blog to Netlify for the world to see!

Frontend Masters sponsor

Did You Know String.prototype.replace Supports Replacement Patterns? — It feels a bit Perl-like, but this is an interesting feature I’d never seen in JavaScript before (despite being in the MDN docs). Example: 'abc'.replace('b', '$&-$&') === 'ab-bc'.

Stefan Judis

Writing a Simple MVC App in Plain JavaScript — If you’re tired of hearing about React, Angular, Mithril, Ember, and the rest, and just want to write JavaScript, this is for you. (Ultimately, all of those frameworks are very useful but being able to work without them first will help you appreciate what they do!)

Tania Rascia

Taking Redux Off of the Main Thread with Comlink — Using Web Workers carefully can yield major UX and performance benefits by taking computation off of the UI thread. Here’s one way to do it when using Redux.


Quick bytes:

💻 Jobs

JavaScript Developer at X-Team (Remote) — Join the most energizing community for developers. Work from anywhere with the world's leading brands.


Front-end Engineer — Goldstar is looking for front-end Engineers with React experience on-site in Portland, Oregon and Pasadena, California.


Get Hired Based on Your Skills Not Your CV — Our AI makes it easier and quicker to match with top JavaScript jobs, with no recruiters and an average salary of £70k.


📘 Tutorials, Opinions, and Videos

▶  Let's Learn About Scope in JavaScript — Google’s dynamic JavaScript duo, Jake and Surma, present an entertaining chat about variable scoping, complete with tablet-based demos.

Google Chrome Developers

Looking at the Optional Chaining ES Proposal — Boils down the proposal to exactly the essentials you need to know.

Dr. Axel Rauschmayer

The Developer’s Guide to Not Losing the Metrics You Need — Gathering and storing metrics is a part of production. When adverse events occur, you need to have the metrics available to debug the problems.

InfluxData sponsor

Do React Hooks Replace Redux? — This question has bounced around in the community a lot recently as more use cases for hooks emerge.. but Eric’s TLDR is ‘Hooks are Great, but No.’ and he explains why in depth.

Eric Elliott

Getting Started with Vuetify 2.0Vuetify is a Material Design-based component library for Vue.js.

Ben Hong

Quick Tips for Using Mocks when Unit Testing with Jest

Daniel Caldas

First-Class Functions in JavaScript — A brief tutorial aimed at beginners who might be wondering why being able to treat functions as first-class citizens (i.e. as objects in their own right) has merit.

Nick Scialli

Top 10 GitHub Best Practices - Lessons from Thousands of Repositories

Datree.io sponsor

My VS Code Setup: Making The Most Out of VS Code — A grab bag of addons and tools to consider if you’re a VS Code user.

Deepu K Sasidharan

Understanding RxJS Observables and Why You Need ThemRxJS is a reactive programming library based around ‘observables’ and is used by Angular for its reactivity.. but you can use it separately too.

Nwose Lotanna

🔧 Code and Tools

Hackathon Starter: A Boilerplate for Node Web Apps — A boilerplate for when you want to start building a Node app quickly (such as at a hackathon) as it includes almost everything you’d need.

Sahat Yalkabov

Esprint: Runs ESLint Across Multiple Threads for More Performance — It’s been considered that this could be merged into ESLint itself.


Ensure That Your Code Is Error-Free Before Merging — Set standards on coverage, duplication, complexity, and style issues and see real-time feedback in your Git workflow.

Codacy sponsor

Treeverse: Walk Tree Structures Depth- or Breadth-First

Isaac Z Schlueter

Rollup: A Modern ES6 Module Bundler — Not a new project, but it's been getting plenty of releases lately. Write your code using ES modules and get tree-shaking/dead code elimination and bundling to the format you require. One of Rollup’s wins over more popular alternatives is its speed.

Rollup Contributors

Top 25 JavaScript Plugins for WebStorm and IntelliJ

Ilana Brudo

⚡️ Quick Releases