---
title: "Remix + React Router == React Router?"
publication: "JavaScript Weekly"
issue: 688
published_at: "2024-05-16"
canonical_url: "https://javascriptweekly.com/issues/688"
---

Plus the React Compiler is here, improving your GitHub profile README, and a way to render music notation with JS. |        

#​688 — May 16, 2024 

[Read on the Web](https://javascriptweekly.com/issues/688)  

Together with [![WorkOS\](https://res.cloudinary.com/cpress/image/upload/c_fill,g_auto,w_514,h_98/e_make_transparent/co_white,e_outline:9/tdfxwgk852ui9leli4wm.png)](https://workos.com/?utm_source=cpjavascript&utm_medium=newsletter&utm_campaign=q22024)   

JavaScript Weekly 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/ibvym0ua1mtof3iplk1q.jpg)](https://deno.com/blog/document-javascript-package)  

📄 [How to Document Your JavaScript Package](https://deno.com/blog/document-javascript-package) — You’ve written some useful code, you want to distribute it.. what next? Useful docs! The Deno team demonstrates the value of [JSDoc](https://jsdoc.app/) and writing documentation alongside your usual source code. 

The Deno Team   

[Digging Into the `Promise.withResolvers()` Proposal](https://2ality.com/2024/05/proposal-promise-with-resolvers.html) — It’s _so_ good to see Dr. Axel blogging again after a year away. He digs into the proposed [`Promise.withResolvers`](https://github.com/tc39/proposal-promise-with-resolvers) feature (now at stage 4) and why you might prefer to use it to create promises in a more elegant way. 

Dr. Axel Rauschmayer   [![\](https://copm.s3.amazonaws.com/447df3fe.png)](https://workos.com/?utm_source=cpjavascript&utm_medium=newsletter&utm_campaign=q22024) 

[WorkOS: Enterprise-Grade Auth You Can Implement in Minutes](https://workos.com/?utm_source=cpjavascript&utm_medium=newsletter&utm_campaign=q22024) — Like an enterprise plan in a box: WorkOS provides flexible, easy-to-use APIs to integrate SSO, SCIM, Audit Logs, User Management, and more. Used by some of the hottest startups including Perplexity, Vercel, & Webflow. Future-proof your auth stack with WorkOS. 

WorkOS sponsor   

[Now You Can Try the _React Compiler_](https://react.dev/learn/react-compiler) — A big item at this week’s [React Conf](https://conf.react.dev/) was the open sourcing of React’s experimental _compiler_ to optimize React code at build time. They’ve also created a [React Compiler Playground](https://playground.react.dev/) to experiment with. 

The React Team   

**IN BRIEF:**  

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/dq2va148ftkr1mgsdasc.jpg)](https://webstatus.dev/)  

- At Google I/O, the Google team [unveiled](https://web.dev/blog/web-platform-dashboard) the [Web Platform Dashboard](https://webstatus.dev/) _(above)_, a way to see the web platform mapped as a set of features, along with their cross browser support.
- ⭐ [Remix](https://remix.run/) and [React Router](https://reactrouter.com/en/main) have a shared history (and, increasingly, features) and that's culminating in [the merging of Remix and React Router](https://remix.run/blog/merging-remix-and-react-router): _"What we planned to release as Remix v3 is now going to be released as React Router v7."_
- The Deno Standard Library is [now available on JSR](https://deno.com/blog/std-on-jsr).   

**RELEASES:** 

- [zx 8.1](https://github.com/google/zx/releases/tag/8.1.0) – Google's tool for better Node shell scripting. Both CommonJS and ESM now supported, increased Node version support, and Deno 1.x support.
- [Node.js 22.2 (Current)](https://nodejs.org/en/blog/release/v22.2.0), [Storybook 8.1](https://github.com/storybookjs/storybook/releases/tag/v8.1.0), [Astro 4.8](https://astro.build/blog/astro-480/), [Bun 1.1.8](https://bun.sh/blog/bun-v1.1.8)
- [ReacType v21](https://medium.com/@sfryan95/introducing-reactype-v21-lowering-the-barrier-to-entry-and-raising-the-bar-in-react-development-945173a9f3b8) – Visual prototyping tool for React apps.  

📒 Articles & Tutorials 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/fj4f5qwg6qh0umgzqd3s.jpg)](https://tduyng.github.io/blog/dynamic-github-profile-with-bun-typescript/)   

[Make Your GitHub Profile Dynamic with Bun and TypeScript](https://tduyng.github.io/blog/dynamic-github-profile-with-bun-typescript/) — GitHub offers the ability to upload [a profile README file](https://docs.github.com/en/account-and-profile/setting-up-and-managing-your-github-profile/customizing-your-profile/managing-your-profile-readme) that’s rendered at the top of your user page. If you want to have it _dynamically_ update with links to your latest blog posts, statistics, or other bits of info, you can do it with a little JavaScript and GitHub Actions. 

Duy Ng   

[Your Fastest Path to Production](https://render.com) — Build, deploy, and scale your apps with unparalleled ease – from your first user to your billionth. 

Render sponsor   

▶[Learn with Me: Hono](https://www.youtube.com/watch?v=gY-TK33G6kQ) — I’m biased, since I think Takuya’s videos are amazing and am a huge fan of [his note taking app, Inkdrop](https://www.inkdrop.app/), but it’s neat to see someone sink their teeth into trying the [Hono](https://hono.dev/) JS app framework. 

Takuya Matsuyama   

📄 [Build Your Own React.js in 400 Lines of Code](https://webdeveloper.beehiiv.com/p/build-react-400-lines-code) – A learning exercise. Zachary Lee 

📄 [The Carcinization of Web Frameworks](https://toddle.dev/blog/the-carcinization-of-web-frameworks) – Are frameworks all starting to look alike? Jacob Kofoed 

📄 [Five Basic Things About JavaScript to Help Non JavaScript-Focused Web Designers](https://frontendmasters.com/blog/5-things-designers-can-do-with-javascript/) Chris Coyier 

📄 [Personal-Scale Web Scraping for Fun and Profit](https://bhmt.dev/blog/scraping/) Sean Morrissey  

🛠 Code & Tools 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/kecm1ybrbztpf7djmajv.jpg)](https://cpojer.net/posts/athena-crisis-open-source)  

🕹️ [_Athena Crisis:_ A Quality, JS-Powered Game](https://cpojer.net/posts/athena-crisis-open-source) — A commercial, turn-based strategy game available [on the Steam Store](https://store.steampowered.com/app/2456430/Athena_Crisis/), **but now with an open sourced engine and tooling.** The game is published by [Null](https://null.com/), an indie game publisher founded by GitHub cofounder Chris Wanstrath. 

Christoph Nakazawa   

[fuzzysort 3.0: Fast Fuzzy Search Library](https://github.com/farzher/fuzzysort) — Check out [the live example](https://rawgit.com/farzher/fuzzysort/master/test/test.html) – it certainly feels quick. 

Stephen Kamenar   

[Make the Scary Things Boring 😅](https://link.testdouble.com/61w) — Been told to do more with less? Talk to Test Double about how to deliver with fewer people without losing quality. 

Test Double sponsor   

[GraphQL Yoga: A Full-Featured GraphQL Server](https://the-guild.dev/graphql/yoga-server) — Create a schema, spin up a server, and you’re good to go (then you get to wire everything up). Supports GraphQL subscriptions via SSE. Designed to run across environments from Node to AWS Lambda, Deno, Bun, etc. [GitHub repo](https://github.com/dotansimha/graphql-yoga). 

The Guild   

[Vue Fluid DnD: An Animated Drag-and-Drop Library for Vue](https://vue-fluid-dnd.netlify.app/) — Designed for lists of items and you can view a variety of [examples here](https://vue-fluid-dnd.netlify.app/example/vertical-list/single-vertical-list/), including one where the items are draggable using handles. [GitHub repo.](https://github.com/carlosjorger/vue-fluid-dnd) 

Carlos Jorge Rodriguez   

[Transformational Auth & Identity | Userfront](https://userfront.com/?&utm_source=javascriptweekly-com&utm_medium=newsletter_sponsored_link&utm_campaign=magnitude&utm_content=transformational) — "Compared to our previous experiences in the security/auth space, Userfront is an order of magnitude simpler to use." 

Userfront sponsor   

🗾 [React Google Maps 1.0: Components and Hooks for Google Maps](https://visgl.github.io/react-google-maps/) — Provides a way to integrate Google’s Maps API into a React app, with components to lay down markers, draw over maps, etc. [GitHub repo.](https://github.com/visgl/react-google-maps) 

OpenJS Foundation   

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/cwxzljgjzatd8aloyhhf.jpg)](https://github.com/CoderLine/alphaTab)  

- [alphaTab 1.3](https://www.alphatab.net/) _(above)_ – Music notation and guitar tablature rendering library. It's able to _play_ the music, too, although the vibrato on the guitar sounded rather odd on my machine.. 😅
- [React Awesome Query Builder 6.5](https://github.com/ukrbublik/react-awesome-query-builder) – Logical query builder control. ([Demo.](https://ukrbublik.github.io/react-awesome-query-builder/))
- 🎨 [jquery-color 3.0](https://github.com/jquery/jquery-color) – jQuery plugin for color manipulation and transitions.
- [Jdenticon 3.3](https://jdenticon.com/) – Library for generating geometric 'identicons'.
- [OverlayScrollbars 2.8](https://kingsora.github.io/OverlayScrollbars/) – JS custom scrollbar plugin.
- [NodeBB 3.8](https://github.com/NodeBB/NodeBB) – Node.js based forum system.  

🎁 And one for fun.. 

[![\](https://res.cloudinary.com/cpress/image/upload/w_1280,e_sharpen:60,q_auto/rdjbs4kqsi76cggeb4ff.jpg)](https://marketplace.visualstudio.com/items?itemName=Vkrsi.code-screenshot#codescreenshot)  

[Code Screenshot: A VS Code Extension to Create Code Screenshots](https://marketplace.visualstudio.com/items?itemName=Vkrsi.code-screenshot#codescreenshot) — It basically loads your code into [this site](https://cs.vkrsi.com/) (which you can use directly, if you'd rather not install an extension) where you can tweak settings/theme and export to either a PNG or SVG. 

Vkrsi / Visual Studio Marketplace   

💡 [Carbon](https://carbon.now.sh/) remains a great option for this task, too.        

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