#618 — December 9, 2022
Vite 4.0 Released — From the same creator as Vue.js, Vite is an exciting piece of frontend tooling offering lots of goodies out of the box: fast hot module replacement, instant server starts, optimized builds with Rollup, TypeScript and JSX support (more on why to use Vite here). You can even give it a quick spin online via vite.new.
Evan You and Vite Contributors
Frontend Masters sponsor
npm Gains New Security Features — GitHub continues its work in making the npm ecosystem safer. Two new things: granular access tokens so package owners can better control access to publishing workflows, and a new code explorer to look directly at the contents of packages from the official npm site.
Monish Mohan (GitHub)
Console Ninja: console.log Output Right Next to Your Code — A VS Code extension that displays console.log output and runtime errors next to your code. Jack Herrington recorded ▶️ a neat 6 minute intro showing it off recently.
There’s a React documentary in production – ▶️ here’s the trailer.
? D3 7.7, the latest version of the popular data visualization framework, is out and I wanted to recommend looking at co-creator Mike Bostock’s notebooks if you want inspiration on using D3, a look at new features, etc. He posts interesting stuff.
The JS debugger in the latest VS Code release now supports console.profile for CPU profiling code, as well as nested sourcemaps.
Rome 11 – Linter in urbe novissima sunt.
Rollup 3.7 – ES module bundler.
xv 2.0 – Zero-config Node test runner.
Nx 15.3 (A huge news update post.)
Bun 0.3 – The challenger JS runtime.
? Articles & Tutorials
Sandboxing with Partytown — Partytown provides a way to run third party scripts within a Web Worker rather than on the main thread. Could this be used for sandboxing? Weston tried it out and concluded it’s not quite there.
Build a Mobile-Responsive Telehealth Pager App Using Stream’s Chat API — Build a responsive chat app with emojis/reactions, built-in GIF support, ability to edit/delete messages, direct & group chat, and more.
Is Prisma Better Than Your ‘Traditional’ ORM? — Prisma has become a very popular ORM option in the Node space in recent years. The creator of the Practica Node starter app considers if Prisma makes sense as a universal ‘go to’ ORM. No, but..
When to Use gRPC vs GraphQL — A balanced comparison of two popular API protocols to see where each works best.
Ben Popper podcast
? Code & Tools
Codux: A Visual IDE for React — One of the co-founders of Wix introduces a new standalone tool to accelerate the React development process. It currently only supports Chromium-based browsers but you can take it for a test drive or learn more from its homepage.
Nadav Abrahami (Wix)
Harlem 3.0: Simple Extensible State Management for Vue 3 — Provides a simple functional API for creating, reading, and mutating state.
Open Source Firebase Alternative for Web, Mobile, and Flutter Devs
JS Image Carver: Content-Aware Image Resizer and Object Remover — Uses the seam carving approach (if you’ve used ‘Content Aware Scale’ in Photoshop, you’ve seen it). The live demo on this one is fun to watch.
Civet: The CoffeeScript of TypeScript? — If you liked CoffeeScript back in the day, here’s the same idea in a modern TypeScript-oriented form.
Maska 2.1: Zero-Dependency Input Mask — Happy in vanilla situations, but can also integrate with Vue 2/3. GitHub repo.
node-calls-python: Call Python from Node — One use case the author mentions is plugging into Python’s rich ecosystem of machine learning tools.
reduced.to: Open Source URL Shortening App Built with Qwik — The app itself is live at reduced.to but you might find it interesting as an example of a frontend built using the Qwik framework.
? Yesterday, This Dot Media published Qwik’s creator Misko Hevery giving ▶️ a live coding introduction to Qwik – a useful way to get up to speed.
Software Engineer — Stimulus is a social platform started by Sticker Mule to show what’s possible if your mission is to increase human happiness. Join our engineering team.
Senior UI Dev — Join us and innovate with MicroFrontends, custom Node tools, build systems (Webpack/Github Actions), TypeScript, React, and more with a11y and DX in mind.
↳ Run intensive third-party scripts in a worker.
↳ React component for split views.
↳ Reveal.js presentations from Markdown files.
↳ MongoDB object modeling library.