Nuxt 3.0, TypeScript 4.9, Angular 15..

#​615 — November 18, 2022

Read on the Web

JavaScript Weekly

What’s So Great About Functional Programming? — If anyone has excitedly insisted you check out Elm, PureScript, Haskell or F#, they may have caught Functionitis™ and want you to catch it too. James, author of the forthcoming Skeptic’s Guide to Functional Programming with JavaScript, sells the ideas behind functional programming here in a way we can all grok. “It’s all about confidence.”

James Sinclair

Deno 1.28 Released with (Better) npm Compatibility — Most of us are attached to the npm ecosystem and packages, so it’s great to see alternative runtime Deno making it easier to use them with no node_modules, package.json or npm install in sight.

The Deno Team

💡 Deno is worth a fresh look, if only for how it’s brought so many tools into one easy place – see this Node to Deno cheatsheet for examples.

🧈 Retire Your Legacy CMS with ButterCMS — ButterCMS is your new content backend. We’re SaaS so we host, maintain, and scale the CMS. Enable your marketing team to update website + app content without needing you. Try the #1 rated SaaS Headless CMS for your JS app today. Free for 30 days.

🧈 ButterCMS sponsor

Angular v15 Released — It may not be the newest shiny thing, but Angular is dependable, widely used, and well maintainted. In v15, its legacy compiler is gone, standalone APIs (no NgModules!) are a stable mainstream feature, and the directive composition API opens up new code reuse strategies. It’s all on display here.

Minko Gechev

Nuxt 3.0: The Vue.js-Based Webapp Framework — Two years in the making, 3.0 is a rewrite based on Vite, Vue 3, and Nitro (the server engine) with first-class TypeScript support. If Vue is your thing, this may be the full stack option for you.

Pooya Parsa

Announcing TypeScript 4.9 — The latest version of the popular typed JavaScript superset and associated tooling gains the satisfies operator for matching types without losing them, auto-accessors in classes, a change to how NaN equality checks are done, plus editor tooling and perf improvements.

Daniel Rosenwasser (Microsoft)

IN BRIEF:

  • Narwhal, the company behind the Nx monorepo-oriented build system, has raised $8.6m in seed funding. You’re gunna need a bigger monorepo.

  • CORRECTION: Apologies to Netlify for us crediting their Jamstack survey results to Vercel last week. Thanks to Cassidy Williams (& others) for letting us know. Unlike with Shopify vs Spotify, we have no excuse 😁

  • We’re loving these two new fonts from GitHub. Open licensed, variable features, and a snazzy landing page, too.

RELEASES:

📒 Articles & Tutorials

The Magical World of Particles with React Three Fiber and Shaders — You’ll learn a lot about shaders and rendering particle effects in this fascinating interactive primer.

Maxime Heckel

ECMAScript Proposal: RegExp’s /v Flag — A proposed new regular expression flag /v would improve support for multi-codepoint graphemes (like some emojis) in character classes, allow the nesting and combination of character classes, and improve case-insensitive matching for negated classes. It’s complicated but Axel boils it down.

Dr. Axel Rauschmayer

Quokka.js – The Fastest Way to Learn JavaScript / TypeScript — With 2M+ downloads, Quokka.js is the #1 tool for exploring and testing JavaScript/TypeScript. Vite support is coming soon.

Wallaby.js sponsor

Styling Form States Without JS — You can get a long way with the :has pseudo class and it’s semi-well supported.

Jen Simmons

▶  A Crash Course for GitHub Codespaces — Building a simple Node app. (40 minutes.)

Hitesh Choudhary

Component Driven Development with Storybook and Nightwatch
Andrei Rusu

🛠 Code & Tools

tslog 4.0: Expressive Logging with TypeScript Support — Feature packed, fully typed, can do stack traces via the native V8 API, show code frames, and more. Now supports both Node and the browser.

Eugene Terehov

TanStack Router: A Fully Type-Safe Router — Powerful routing and first-class search-param APIs for React, Solid, Vue and Svelte. Built in caching, auto prefetching, and more.

Tanner Linsley

Zigi: Your Automated Workflow Assistant for All Things Non-Code

Zigi sponsor

Wireit: Upgrades Your npm Scripts to Make Them Smarter and More Efficient — A library that extends npm/pnpm/yarn to make existing scripts more efficient and support things like parallelism, cascades, and result caching (essentially memoization for npm run!)

Google

AEWC: Web Component to Add the Ace Code Editor to a PageAce is a mature code editor control and this wraps it up in Web Component form.

Marketing Pipeline

Twix: Style React Components with Tailwind CSS — If you never liked having CSS in your JavaScript, how about Tailwind instead?

Kasper Mikiewicz

OverlayScrollbars 2.0: JS Scrollbar Plugin to Replace Native Scrollbars — Provides custom styleable overlay scrollbars while keeping a native functionality and feel. Use judiciously. v2.0 is a full rewrite in TypeScript and smaller, too.

Rene Haas

Build Frictionless, Secure, High-Converting Onboarding Flows — The all-in-one developer platform for auth. Launch a login flow in minutes using our API and SDKs. Start building today.

Stytch sponsor

💻 Jobs

Software Engineer — Join our “kick ass” team. Our software team operates from 17 countries and we’re always looking for more exceptional engineers.
Stickermule

Find JavaScript Jobs with Hired — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It’s free for job-seekers.
Hired

📟 Where are my Turbo Pascal, QBasic, or Turbo C++ folks at?

DOjS: A DOS JavaScript Canvas with Sound — This interesting project truly stands on the shoulders of many others. If you ever coded for DOS, you will find this impressive. +1 point for the project’s name.

SuperIlu

Related Post

Native modules become ‘built-ins’Native modules become ‘built-ins’

<table border=0 cellpadding=0 cellspacing=0 align="center" border="0"> <tr><td style="font-family: -apple-system,BlinkMacSystemFont,Helvetica,sans-serif; font-size: 15px; line-height: 1.55em; "> <div> <table border=0 cellpadding=0 cellspacing=0 border=0 cellpadding=0 cellspacing=0><tr> <td align="left" style="padding-left: 4px; font-family: -apple-system,BlinkMacSystemFont,Helvetica,sans-serif; font-size: 15px; line-height:

React v16.13.0React v16.13.0

<p>Today we are releasing React 16.13.0. It contains bugfixes and new deprecation warnings to help prepare for a future major release.</p> <h2 id="new-warnings"><a href="#new-warnings" aria-hidden class="anchor"><svg aria-hidden="true" height="16" version="1.1" viewBox="0 0