#598 — July 15, 2022
▶️ Vite explained in 100 seconds by Fireship.
▶️ A 13 minute introduction to Vite by Evan You himself.
Ladle – Vite-backed React component dev tool, and Storybook alternative.
Fastify DX – in-development full stack framework on top of Fastify & Vite.
Evan You and Contributors
CKEditor 5 Is Here to Make Collaborative Writing Easy — A customizable rich text editor that allows you to build collaboration within your application in hours. Ready-to-use features like comments, track changes, real-time collaboration, version history and many more. Start your free trial to implement it now.
CKEditor 5 sponsor
Rety: Live Coding Without the Stress — Last week we mentioned Lea Verou’s ▶️ CSS variables talk – a talk that had some ‘live coding’ sections which were orchestrated in advance using Rety, which Lea has released to us all.
Node-RED 3.0 Released — Node-RED is a popular Node.js-based low/no-code programming environment heavily used in the IoT space (though not exclusively). v3.0 requires Node 14+ and includes numerous UI/DX enhancements. Well worth a try if the idea of visually joining together logical components appeals to you.
📆 EmberFest, a European Ember.js conference, is taking place in Paris this September 22–23.
Mark Erikson shares some useful pointers on how to research the level of npm package use.
Ember 4.5 – The productive, battle-tested framework.
Preact 10.10 – Fast 3KB React alternative.
pkg 5.8 – Package a Node app into an executable.
React Big Calendar 1.4 – Google Calendar-esque component.
AdminJS 6.0 – Node.js admin panel system.
📒 Articles & Tutorials
Josh W Comeau
Testing Bun’s Speed and Compatibility with Node.js — David decided to put Bun through its paces to see how it would fare with a real world app vs Node.js. Unsurprisingly for an app with real world pressures (file system, network, et al.) the difference in performance was minor, but he was impressed at how seamlessly it worked.
Don’t Let Your Issue Tracker Be a Four-Letter Word. Use Shortcut — The best issue tracking software is one that software developers are actually happy to use.
Shortcut (formerly Clubhouse.io) sponsor
Applying SOLID Principles in React — The so-called SOLID object oriented design principles have stood the test of time—they were first introduced by Robert Martin in 2000. Although much has changed since, they are still valid and can be valuable when applied in React apps.
Getting Started with Vue Composables — For when you want to extract stateful functionality to reuse across components.
▶ An Introduction to Functional Programming in JS — A light hearted, yet useful, introduction to the ‘mustachioed hipster of programming paradigms.’ Perfect for beginners.
Working with File System Paths on Node.js
Dr. Axel Rauschmayer
Build Your Own Wordle for Numbers
🛠 Code & Tools
Add to Calendar Button: Add a Quick Way to Let Users ‘Add to Calendar’ — The button is pre-styled and it drops down to show options for various calendars – Apple, GCal, iCal, Microsoft 365, Outlook..
Luxon 3.0: Library for Working with Dates and Times — If you’re familiar with something like Moment.js, it’s like that but with immutable objects, 1-indexed months, Intl-powered localization (so no locale or timezone files needed!) and more.
Integrate eSignatures in Your App in Less Than a Week — Enable document signing from anywhere with HelloSign’s eSignature functionality. Test the API for free.
HelloSign, a Dropbox Company sponsor
NestJS v9 Released — Nest is a TypeScript-based server-side framework for when you need a more fleshed out and complete platform to work on (or get support from) than straight Express, say. v9 introduces a handy REPL, a configurable module builder, durable providers, and more.
Link Preview JS: Get Information about a Link’s Target Page — Uses the OpenGraph metadata that folks like Facebook and Twitter use when showing link previews.
Commander.js 9.4 – Node.js CLI app library.
eruda 2.5 – Web console for mobile browsers.
Tedious 15.0 – TDS module for connecting to SQL Server.
mux.js 6.2 – Utilities for inspecting video container formats.
🤔 DID YOU KNOW..
.. you can hold the Shift key when looking at network requests in Chrome’s devtools to see what initiated the request and its dependencies?
.. you can easily ‘test drive’ over 100 programming-focused fonts at programmingfonts.org?
.. if you’re a frontend developer, we also have 💌 Frontend Focus, a newsletter focused entirely on frontend, browser, and Web design related news, tech, and tools. Here’s the latest issue.