How you're in the 1.4%

#​536 — April 30, 2021

Unsubscribe  |  Read on the Web

JavaScript Weekly

Babel 7.14.0 Released— Here's what's new with everyone's favorite JavaScript compiler/transpiler:

• Class fields and private methods enabled by default.
• async do expression support (currently stage 1).
• importInterop: node setting to produce dual modules (ESM and CommonJS).

Babel Team

▶  What's Next? The Future of Node.js— A 27-minute session by Red Hat and IBM’s Joe Sepi, Michael Dawson and Bethany Griggs on tracking what’s coming up in the Node world, Node’s future (though Beth reminds us “there is no roadmap”) and how you can get involved if you so wish.

NearForm

ButterCMS Melts into Your React App. #1 Rated Headless CMS— ButterCMS is the #1 rated Headless CMS for React. Enable your marketing team to manage content w/ our easy to use dashboard. Fast content API for modern apps. Secure. Scalable. Less Code. Try free today for 30 days.

ButterCMS sponsor

Redux 4.1 Released— It’s not a huge release for the popular state container but the bundle size is down almost 40% and error messages are improved. You may also be intrigued in the first 1.6.0 alpha of Redux Toolkit which integrates RTK Query, a data fetching and caching library built for Redux.

Mark Erikson

Quick Bits

• Slashdata, a UK based developer research firm, says JavaScript is the most popular programming language with an estimated 12.4 million developers. So.. as a JavaScript Weekly reader, you are in the 1.4% 😄
• Vue 3 dropped IE 11 support, so is Preact and Angular too. Bye IE 11 - at 7½ years old, it's about time.
• It's still early days but the HTML Sanitizer API is a proposed API for sanitizing untrusted strings of HTML client side.
• Guy Bedford was on the ▶️ TC39er podcast, a show that interviews folks associated with TC39.

Releases

RxJS 7.0— Reactive extensions for JavaScript.
Next.js 10.2— The React framework.
Strapi 3.6— Headless CMS, now with i18n.
Replay 3.0— React video player component.
neo.mjs 2.0— WebWorker-driven UI framework.
Chart.js 3.2— HTML5 charting library.

📖 Articles, Opinions & Tutorials

The Lazy-Loading Property Pattern in JavaScript— Deferring computationally expensive operations until needed is (nearly) always a win. Plus, it’s always a pleasure to see one of the longest standing names in the JavaScript space blogging.

Nicholas C. Zakas

Building Portable Apps with Go(lang) and Next.js— It’s not often we get to see Go and JavaScript come together, but the idea here is that you can use Go’s new static embedding functionality to build a self-contained Go app that serves a Next-powered app all in one.

David Stotijn

How to Securely Implement OAuth in Vue.js- Up and Running in < 1 Hour— In this tutorial, you'll learn how to use an OAuth server (FusionAuth) to securely authenticate and authorize users.

FusionAuth sponsor

How to Use ECMAScript Modules in Node— Even the Node docs note that ES modules are the ‘official standard format’ for packaging and reusing JavaScript code, and with more developers switching from CommonJS to ESM, it’s time to look at what’s involved.

Dmitri Pavlutin

Using Asynchronous Web APIs from WebAssembly— Learn how to invoke asynchronous web APIs when compiling traditionally synchronous languages to WebAssembly.

Ingvar Stepanyan

A webpack Tutorial for Beginners: A Step-by-Step Guide— If you’ve tried other bundler options but haven’t looked into webpack (maybe because of the bigger learning curve), this introductory tutorial might be a good starting point.

Louis Lazaris

Techniques for Modeling Permissions as Types in Typescript— TypeScript makes it easy to eliminate potential sources of error. Here’s how a developer has been doing this with permissions checking.

Drew Colthorp

↑ And if you like this sort of thing, Really Advanced TypeScript Types from Rick Weber at Tableau might also be up your street. :-)

▶  Building a Realtime Chat App with React, Node.js, and Socket.io— The end result looks a lot like Facebook Messenger.

Lama Dev

From JavaScript to Paper: A Linocut Adventure— Few articles combine JavaScript with ‘murderous little knives’ but Monica delivers with this fun look at how she uses code to create art (which you can buy).

Monica Dinculescu

Observability Won’t Replace Monitoring (Because It Shouldn’t)

Lightstep sponsor

You Can Label a JavaScript if Statement— Labels are a longstanding JS feature that tend to be forgotten (for good reason) and even the author says “you can lead a very fulfilling career without ever knowing that this exists.” Nonetheless..

Alex Riviere

21 Best Practices for a Clean React Project— Specific techniques, each illustrated with a code snippet, all intended to improve the quality of your code.

Mohammad Faisal

Detecting Multiple Key Keyboard Shortcuts from JavaScript— There are libraries for doing this too, such as GitHub’s own hotkey.
Amit Merchant

Voice-Enabling an Angular App with Wake Words— Using the Web Speech API.
David Bartle

QuickSnippets: Categorized Code Snippets Sourced from Tweets— Nicely laid out, searchable, and categorized for easy filtering. Note that the snippets are generally in images, so not very accessible, but it’s a nice selection.

QuickSnippets

Scribbletune 4.0: Use Strings and Arrays to Create Rhythms and Musical Patterns— Then export your creations as MIDI files.

Scribbletune

Book a Demo. Ship Fast. Rest Easy. LaunchDarkly— Testing in production? It's scary until it's not. Control your code. Ship fast. Reduce risk. Reclaim your life.

LaunchDarkly sponsor

js-tokens 7.0: A Tiny JavaScript Tokenizer— A regex powered ‘almost spec-compliant’ JS tokenizer.

Simon Lydell

Slide Element: Async Functions for Hiding and Showing Elements— GitHub repo.

Alex MacArthur

Compodoc: The Missing Documentation Tool for Your Angular App
Vincent Ogloblinsky