--- title: "htmx in 100 seconds" publication: "JavaScript Weekly" issue: 647 published_at: "2023-07-13" canonical_url: "https://javascriptweekly.com/issues/647" --- Plus Prettier 3.0, Prisma 5.0, and some JavaScript Homer Simpson would approve of. | #​647 — July 13, 2023 [Read on the Web](https://javascriptweekly.com/issues/647) Together with [![Postman logo\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,e_trim,w_330,h_100/e_make_transparent/co_white,e_outline:7/ym5p9yhtqry2ntuhfxk4.png)](https://www.postman.com/product/tools/?utm_source=cooper_press&utm_medium=email&utm_campaign=javascript_weekly&utm_term=july_13_2023&utm_content=api_tools) JavaScript Weekly [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/ub5fpufhmrrewprcng02.jpg)](https://driverjs.com/) [Driver.js: Create On-Page Tours, Highlights, and Contextual Help](https://driverjs.com/) — A no-dependency, vanilla JavaScript library for putting together page tours and contextual help systems. The project is a few years old but has just been entirely rewritten and gained [numerous enhancements](https://github.com/kamranahmedse/driver.js/releases), plus a huge lick of paint. There are lots of examples to check out. Kamran Ahmed [Component Party: A Rosetta Stone of UI Library Code Examples](https://component-party.dev/) — A comparison of different frameworks (like React, Vue, Svelte, Angular, Ember, etc.) by way of simple code snippets covering various tasks. Mathieu Schimmerling [![\](https://copm.s3.amazonaws.com/d72f4df8.jpg)](https://www.postman.com/product/tools/?utm_source=cooper_press&utm_medium=email&utm_campaign=javascript_weekly&utm_term=july_13_2023&utm_content=api_tools) [Test and Validate APIs Effectively and Efficiently](https://www.postman.com/product/tools/?utm_source=cooper_press&utm_medium=email&utm_campaign=javascript_weekly&utm_term=july_13_2023&utm_content=api_tools) — Gain access to several API testing tools and features that help you automate repetitive tasks, stay organized, and build robust workflows to ensure your APIs remain reliable and performant. Postman sponsor [Prettier 3.0: Now Powered by ES Modules](https://prettier.io/blog/2023/07/05/3.0.0.html) — The popular multi-language code formatter gets a big upgrade with a refactoring to ES modules making up the biggest change (though it can still be used as a library via CommonJS). One side effect is Prettier now supports ESM-based plugins and async parsers which means [some necessary changes for Prettier plugin developers.](https://github.com/prettier/prettier/wiki/How-to-migrate-my-plugin-to-support-Prettier-v3%3F) Sosuke Suzuki [Crockford on Plain Old JavaScript and the DOM](https://www.crockford.com/domjs.html) — Over the years, Douglas has asked us to only use the _good parts_ of JavaScript, to [▶️ stop using JavaScript](https://www.youtube.com/watch?v=lc5Np9OqDHU), and now he suggests abandoning “the libraries” to instead work with the DOM directly. Lea Verou [🐦 picked up on this story](https://twitter.com/LeaVerou/status/1679273406624038918) and said this suggestion still isn't very practical for most web apps as of 2023. Douglas Crockford **🎉 RELEASES:** - [Ember 5.1](https://blog.emberjs.com/ember-released-5-1/) – The ambitious JS framework that'll never give up takes a big step into the TypeScript world [with stable TypeScript support](https://blog.emberjs.com/stable-typescript-types-in-ember-5-1/) and types-a-plenty. - [p5.js 1.7](https://github.com/processing/p5.js#p5js) – Processing-inspired JavaScript library for creative coding. [v1.7](https://github.com/processing/p5.js/releases/tag/v1.7.0) introduces WebGL 2 and frame buffer support. - [Prisma 5.0](https://www.prisma.io/blog/prisma-5-f66prwkjx72s) – A popular ORM for Node.js and TypeScript. 5.0 boasts significant performance improvements. - [typescript-eslint 6.0](https://typescript-eslint.io/blog/announcing-typescript-eslint-v6/) **⚡️ IN BRIEF:** - `obj?.prop = value;` The [optional chaining assignment proposal](https://github.com/nicolo-ribaudo/proposal-optional-chaining-assignment) advanced to stage 1 at TC39 this week. ([Explanatory slidedeck.](https://docs.google.com/presentation/d/1KL9MRyxprgXDEsxT8Ddrdro074L3fQm88zXHsWL-Dwk/edit#slide=id.p)) - Popular YouTube channel Fireship explains [▶️ htmx in 100 seconds](https://www.youtube.com/watch?v=r-GSGH2RxJs) – well timed, since [htmx](https://htmx.org/) is seeing a huge amount of fresh interest. And if you're wondering who the mastermind behind Fireship _is_, Honeypot has put up [▶️ a short documentary about him.](https://www.youtube.com/watch?v=XRoSBWYMefY) - The folks at Sandworm have shared [a look at the state of the npm registry](https://blog.sandworm.dev/state-of-npm-2023-the-overview) including lots of trivia, history, and stats on how many packages there are, as well as the most commonly used keywords in packages. - Google shares [a case study on performance of scroll-driven animations using its new browser based API](https://developer.chrome.com/blog/scroll-animation-performance-case-study/) versus 'classical JavaScript techniques.' Unsurprisingly it's much faster running away from the main thread, and the spec remains in draft for now. - npm will now check the linked source commit and repo when you view [a package's provenance information](https://docs.npmjs.com/searching-for-and-choosing-packages-to-download#package-provenance) on [npmjs.com](https://www.npmjs.com/) and [warn you when said provenance cannot be established.](https://github.blog/changelog/2023-07-11-warn-when-the-npm-provenance-source-commit-or-repository-cannot-be-found/) - GitHub is rolling out a beta of [passwordless, passkey based authentication on GitHub․com.](https://github.blog/2023-07-12-introducing-passwordless-authentication-on-github-com/) 📒 Articles & Tutorials [Useful Functions for a (Deno) HTTP Server](https://jollytoad.deno.dev/blog/http_fns) — You could think of HTTP in a functional way with requests going in and responses/results going out. The author explores Deno’s new `Deno.serve` function and how both it and the [`/x/http_fns` functions](https://deno.land/x/http_fns@v0.0.21) can provide a more functional approach to common HTTP tasks. Jollytoad [Testing the _Dark Scenarios_ of a Node.js App](https://practica.dev/blog/testing-the-dark-scenarios-of-your-nodejs-application/) — Several examples of often overlooked things you should be testing. What happens when a service times out, code is mutating things it shouldn’t, or you have zombie processes milling around? These are some of the ‘dark scenarios’ it's not too difficult to prepare for. Yoni Goldberg and Raz Luvaton [The 2023 State of the API Report Is Here](https://www.postman.com/state-of-api/?utm_source=cooper_press&utm_medium=email&utm_campaign=javascript_weekly&utm_term=july_13_2023&utm_content=state_of_the_api_2023) — The State of the API is the world's largest survey and report on APIs, with findings from over 40K developers and API professionals. Postman sponsor [Creating Randomized _Zelda: Tears of the Kingdom_ Patterns](https://cloudfour.com/thinks/coding-randomized-zelda-patterns/) — Nintendo's new Zelda game uses repeated, geometric patterns as part of its aesthetic. This post looks at how to recreate such motifs with SVG and JavaScript. Paul Hebert [5 TS Compiler Flags You Should Include in Your Project's Config](https://egorkonovalov.github.io/flycatcher/posts/3/) Igor Konovalov [Deploying a Fastify and Vue 3 Static Site to Heroku](https://www.lirantal.com/blog/deploying-a-fastify-vue-3-static-site-to-heroku) Liran Tal [Getting Started with Vector Databases in Node.js](https://thecodebarbarian.com/getting-started-with-vector-databases-in-node-js.html) Valeri Karpov 🛠 Code & Tools [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/afb6dxloemcevdils8bq.jpg)](https://mdxeditor.dev/) [MDX Editor: A Rich Markdown Editor React Component](https://mdxeditor.dev/) — A [Lexical](https://lexical.dev/)-powered Markdown editor for React apps that supports code blocks, tables, and more. [The live demo](https://mdxeditor.dev/editor/demo) shows off most of what you need to see. Petyo Ivanov [Meet Your New Favorite Teammate: Cody, the AI Coding Assistant](https://about.sourcegraph.com/cody?utm_campaign=fy24-q2-cody-newsletters&utm_medium=sponsored&utm_source=javascriptweeklynewsletter) — Code faster with Cody, the only code AI that knows your entire codebase, like the pair programmer you always wanted. Sourcegraph sponsor [electron-vite: Next Generation Electron Build Tooling](https://electron-vite.org/) — Fish and chips, Bert and Ernie.. some things are just better _together_, and so it goes with the Electron desktop app framework and the Vite frontend toolkit. There’s also an [Electron Vite Boilerplate app](https://github.com/alex8088/electron-vite-boilerplate) to kick off a new app with. Alex Wei 📊 [Vizzu 0.8: A Library for Animated Data Visualizations](https://lib.vizzuhq.com/latest/) — Making data visualizations is reasonably easy, but animating them is harder. Vizzu steps in to help you create animated data stories and explorations. There are lots of [showcases](https://lib.vizzuhq.com/latest/showcases/) and [examples](https://lib.vizzuhq.com/latest/examples/) to peruse. Vizzu Inc. 🐊 [Putout: A Configurable, Babel-Based Linter and Code Transformer](https://github.com/coderaiser/putout) — Provides typical linting functionality with ESLint and code transformation with Babel, but distinguishes itself by being prepared to make _“more drastic code transformations”_ than other tools. It’s not the most popular option but it makes a good case for itself in its [thorough README.](https://github.com/coderaiser/putout#putout----) coderaiser [Standardized Audio Context: Cross-Browser Web Audio API Wrapper](https://github.com/chrisguttandin/standardized-audio-context) — A side effect-free abstraction over a subset of the Web Audio API that works reliably across all mainstream browsers. Christoph Guttandin [Kanel: Generate TypeScript Types from Postgres](https://kristiandupont.github.io/kanel/) — It works by inspecting a live database and outputs code you can add to a TypeScript project and use with something like [Knex](https://knexjs.org/) – [GitHub repo.](https://github.com/kristiandupont/kanel) Kristian Dupont [React Authentication — Without Complexity](https://userfront.com/tutorials/react-authentication?&utm_source=javascriptweekly-com&utm_medium=newsletter&utm_campaign=brief_link&utm_content=react_authentication) Userfront sponsor - [Boa 0.17](https://boajs.dev/posts/2023-07-08-boa-release-17/) – An experimental Javascript lexer, parser and compiler written in Rust that can be embedded into other projects – it now has a module system. - [Octokit.js 3.0](https://github.com/octokit/octokit.js) ↳ Official GitHub SDK for browsers, Node, and Deno. - [Release It! 16.1](https://github.com/release-it/release-it) ↳ Automate npm package publishing and versioning. - [zlFetch 6.0](https://github.com/zellwk/zl-fetch) ↳ Convenience wrapper around the Fetch API. - [Terminalizer 0.10](https://github.com/faressoft/terminalizer) ↳ Record your terminal and generate animated GIFs. - [eslint-plugin-prettier 5.0](https://github.com/prettier/eslint-plugin-prettier) ↳ Prettier, but as an ESLint rule. - [Preact 10.16](https://github.com/preactjs/preact/releases/tag/10.16.0) – 3KB React compatible alternative. 💻 Jobs [Find JavaScript Jobs with Hired](https://hired.com/join/?utm_source=newsletter&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-all%29%28cooper-javascriptweekly%29&utm_content=find-your-next-job) — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now. Hired 🧑‍💻 Got a job listing to share? _[Here's how](https://booking.cooperpress.com/jobs)_. 🍩 Homer would approve [![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/rcdanpsqi3pw4lpt36it.jpg)](https://github.com/EvanZhouDev/donut-js) [donut.js: donut.c, But in JavaScript](https://github.com/EvanZhouDev/donut-js) — [donut.c](https://www.a1k0n.net/2006/09/15/obfuscated-c-donut.html), dating from 2006, is a donut-shaped C program that, when run, animates a spinning ASCII text donut on the screen. Here’s a fresh and hot JavaScript variant! Evan Zhou Published by [Cooperpress](https://cooperpress.com/) and edited by [Peter Cooper](https://twitter.com/cooperx86) 'JavaScript' is a trademark of Oracle Corporation in the US We are not endorsed by or affiliated with Oracle. [Change your email address](https://javascriptweekly.com/edit_subscription/*|UID|*) or [stop getting this newsletter](https://javascriptweekly.com/leave/*|UID|*). © Cooper Press Ltd · Fairfield Enterprise Centre, Louth, LN11 0LS, United Kingdom