---
title: "Wikimedia picks Vue.js"
publication: "JavaScript Weekly"
issue: 550
published_at: "2021-08-06"
canonical_url: "https://javascriptweekly.com/issues/550"
---

Plus Kid Pix in JavaScript, NestJS explained in 100 seconds, and doing OCR in pure JavaScript. |        

#​550 — August 6, 2021 

[Unsubscribe](https://javascriptweekly.com/leave/*|UID|*)|[Read on the Web](https://javascriptweekly.com/issues/550)   

JavaScript Weekly 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/fbefajwzhfvet4735kot.jpg)](https://kidpix.app/)   

[Kid Pix as a JavaScript App](https://kidpix.app/) — Kid Pix was a drawing program for children released on the Mac in 1989 (here’s [a full story about it](https://wepresent.wetransfer.com/story/kid-pix-anniversary/), if you hadn’t heard of it before). Here’s a JavaScript reimplementation. It saves your work if you go away, and [the source](https://github.com/vikrum/kidpix) is pretty neat. 

JS Kid Pix   

[How To Build Resilient JavaScript UIs](https://www.smashingmagazine.com/2021/08/build-resilient-javascript-ui/) — An exploration of how graceful degradation, defensive coding, observability, and a healthy attitude towards failures puts you in a better position as a JavaScript developer. 

Callum Hart   [![\](https://copm.s3.amazonaws.com/695482fb.jpg)](https://fusionauth.io/download/?mtm_campaign=t-shirt&mtm_source=jsweekly&mtm_medium=ppc) 

[We're Giving Away Free T-Shirts. Just Download FusionAuth](https://fusionauth.io/download/?mtm_campaign=t-shirt&mtm_source=jsweekly&mtm_medium=ppc) — FusionAuth provides authentication, authorization, and user management for any app: deploy anywhere, integrate with anything, in minutes. It's always free for unlimited users (no CC required). Download and Install today and we'll send you a t-shirt. 

FusionAuth sponsor   

[Wikimedia Selects Vue.js As Its New Frontend Framework](https://lists.wikimedia.org/hyperkitty/list/wikitech-l@lists.wikimedia.org/thread/SOZREBYR36PUNFZXMIUBVAIOQI4N7PDU/) — This process began years ago (we even covered it at the time) but finally the folks behind Wikipedia have made an announcement concerning the future of their JavaScript oriented development and it’s a win for Vue.js. 

Wikimedia Foundation    

**QUICK BITS:** 

- 🏆 Here's [a handy guide to what's new in ES2022](https://yagmurcetintas.com/journal/whats-new-in-es2022) to skim through.
- The _JS1024_ game development contest has wrapped up with [a bunch of fantastic winners](https://js1024.fun/results/2021) – it's amazing to see [how much](https://js1024.fun/demos/2021/12) can be done with [a mere 1KB](https://js1024.fun/demos/2021/12/source) of JavaScript.
- There's [a new Visual Studio Code update](https://code.visualstudio.com/updates/v1_59) – the Live Preview extension now supports [JavaScript debugging within previews.](https://code.visualstudio.com/updates/v1_59#_live-preview)
- Chrome's intent to remove support for cross origin IFRAMEs to trigger `window.alert`, `prompt` and `confirm` dialogs has [fallen into some trouble.](https://www.theregister.com/2021/08/05/google_chrome_iframe/)
- The [Stack Overflow 2021 Developer Survey results](https://insights.stackoverflow.com/survey/2021) are out and JavaScript has fared very well. We'll digest some of the findings in coming issues.
- Google is shutting down its [Google Sign-In JavaScript Platform Library for web](https://developers.googleblog.com/2021/08/gsi-jsweb-deprecation.html) in 2023.
- [Scala.js 1.7.0](https://www.scala-js.org/news/2021/08/04/announcing-scalajs-1.7.0/), a Scala to JavaScript compiler, has been released with 'zero known bugs' – reassuring!   

**RELEASES:** 

[Bootstrap 5.1.0](https://blog.getbootstrap.com/2021/08/04/bootstrap-5-1-0/) – Responsive site creation toolkit.
 [Agenda 4.2.0](https://github.com/agenda/agenda) – Lightweight job scheduling for Node.
 [Globalize 1.7.0](https://github.com/globalizejs/globalize) – I18n and l10n library that uses official Unicode CLDR.
 [Angular 12.2](https://github.com/angular/angular/releases/tag/12.2.0) – The popular JS framework.    

💻 Jobs  

[Lead Full-Stack Software Engineer (USA)](https://grnh.se/e5b74b292us) — Join a team of engineers and designers crafting digital products for companies such as HBO, adidas, Supercell, and Nokia. 
REAKTOR   

[JavaScript Developer at X-Team (Remote)](https://x-team.com/remote-javascript-developer-jobs/?utm_source=cooperpress&utm_medium=email-ad&utm_campaign=cooperpress-js&utm_content=js) — Join the most energizing community for developers and work on long-term projects for Riot Games, FOX, Sony, Coinbase, and more. 
X-Team   

[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) — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers. 
Hired    

📖 Articles, Opinions & Tutorials 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/vs3wezn0tc7lgszaxzao.jpg)](https://hacks.mozilla.org/2021/08/mdns-autocomplete-search/)  

[How MDN’s Autocomplete Search Works](https://hacks.mozilla.org/2021/08/mdns-autocomplete-search/) — Autocomplete search was recently added to the excellent [MDN Web Docs](https://developer.mozilla.org/). Here’s a look at how the feature was implemented. 

Peter Bengtsson (Mozilla)   

[How to Use `Promise.allSettled()`](https://dmitripavlutin.com/promise-all-settled/) — How to use Promise.allSettled() to perform parallel async operations and collect the promises statuses into an array. 

Dmitri Pavlutin   

[Angular Data Grids Don’t Need to Be Hard. Check This One Out](https://www.telerik.com/campaigns/kendo-ui/free-trial-angular-data-grid-1?utm_medium=cpm&utm_source=jsweekly&utm_campaign=kendo-ui-angular-try-our-grid&utm_content=sponsored-link) — Be ready for your next data grid project by learning about the one that has already been built for you. 

Kendo UI for Angular sponsor   

[40+ Node.js Integration Test Best Practices](https://github.com/testjavascript/nodejs-integration-tests-best-practices) — Component and integration tests are increasingly popular testing techniques for backends. This repository digs into a variety of quick-fire patterns and practices for creating good component tests. There’s also a demo app and examples using Jest, Mocha, Express, Fastify and Nest.js. 

Yoni Goldberg, Michael Solomon, and Daniel Gluskin   

▶[NestJS Explained in 100 Seconds](https://www.youtube.com/watch?v=0M8AYU_hPas) — The high-level concepts of [Nest](https://nestjs.com), a framework for building scalable Node.js applications that offers more beyond what you might get with something like Express or Fastify alone, presented in around two minutes. 

Fireship   

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/n72fkwitvjided9pbnzj.jpg)](https://tympanus.net/codrops/2021/08/02/magical-marbles-in-three-js/)  

[Rendering Magical Marbles with Three.js](https://tympanus.net/codrops/2021/08/02/magical-marbles-in-three-js/) — These sorts of 3D graphics tricks are a bit over my head, but it’s neat to see how they’re done. 

Matt Rossman   

[Optional Chaining: The `?.` Operator in TypeScript](https://mariusschulz.com/blog/optional-chaining-the-operator-in-typescript) — TypeScript 3.7 added support for the `?.` operator, also known as the optional chaining operator. 

Marius Schulz   

[Auth Without Complexity](https://userfront.com) — Here is a much simpler way to build authentication and access control, with examples for React, Vue, Node.js & more. 

Userfront sponsor   

[How We Reduced Next.js Page Size by 3.5x and Achieved a 98 Lighthouse Score](https://papyrus.dev/@PapyrusBlog/how-we-reduced-next.js-page-size-by-3.5x-and-achieved-a-98-lighthouse-score) 
Colin Armstrong   

[How to Use `test.todo()` in Jest](https://heyfirst.co/blog/how-to-use-test-todo-in-jest) 
Kanisorn Sutham   

[(Why and How to) Visit the Blank Page Between Cypress Tests](https://glebbahmutov.com/blog/visit-blank-page-between-tests/) 
Gleb Bahmutov   

[Automating Accessibility Testing with Storybook](https://storybook.js.org/blog/accessibility-testing-with-storybook/) 
Varun Vachhar (Storybook)   

🛠 Code & Tools  

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60/pmrrmuzpuve4c7za1q1p.jpg)](https://meyda.js.org/)  

[Meyda: A JavaScript Audio Feature Extraction Library](https://meyda.js.org/) — The homepage has quite a visually striking demo. It supports both offline feature extraction as well as real-time feature extraction using the Web Audio API. 

Rawlinson, Segal, Fiala, Wray, et al.   

[txiki.js: A Small and Powerful JavaScript Runtime](https://github.com/saghul/txiki.js) — Stands on the shoulders of QuickJS and libuv. 

Saúl Ibarra Corretgé   

[XRegExp 5.1: Extended JavaScript Regular Expressions](https://github.com/slevithan/xregexp) — This is for you if you want to ‘spice up’ normal regular expressions beyond what browsers support natively – see [the examples](https://github.com/slevithan/xregexp#usage-examples). 

Steven Levithan   

[Tesseract.js 2.1.5: Pure JavaScript OCR for 100+ Languages](https://tesseract.projectnaptha.com/) — A pure JavaScript port of the popular C++ [Tesseract](https://github.com/tesseract-ocr/tesseract) library commonly used for visual text recognition purposes. 

Tesseract Team   

[React Hot Toast 2.0](https://react-hot-toast.com/docs/version-2) — [React Hot Toast](https://react-hot-toast.com/) is a popular React on-page notifications system. Although the opportunity to customize the notifications in the new release chips away at the original ‘toast’ metaphor, there’s a lot of configurability in the new version that will prove valuable for many. It also has better accessability and a custom renderer. [GitHub repo](https://github.com/timolins/react-hot-toast). 

Timo Lins   

[Why You Need Error Grouping - How to Minimize Noise, Pinpoint the Right Errors, and Debug Better](https://try.rollbar.com/whitepaper/why-you-need-error-grouping/?utm_source=newsletter&utm_medium=email&utm_campaign=cooper_press) 

Rollbar sponsorwhitepaper   

[React Joyride: Create Guided Tours in Your Apps](https://github.com/gilbarbara/react-joyride) — Uses [react-floater](https://github.com/gilbarbara/react-floater) to position and style floating ‘tour guide’ elements. Want a demo? [Of course you do](https://react-joyride.com/). 

Gil Barbara   

[AutoMapper 5.0: An Object-Object AutoMapper for TypeScript](https://automapperts.netlify.app/) — [GitHub repo](https://github.com/nartc/mapper). 

Chau Tran   

[ts-audio 0.6.0: Work with AudioContext More Easily](https://github.com/EvandroLG/ts-audio) — [Here’s a demo](https://codesandbox.io/s/ts-audio-audio-m54u5). 

Evandro Leopoldino Gonçalves         

Published by [Cooperpress](https://cooperpress.com/) and edited by [Peter Cooper](https://twitter.com/peterc) 

'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
