#545 — July 2, 2021
JavaScript Weekly
Temporal: Getting Started with JavaScript’s New Date and Time API — JavaScript’s Date object and API is hard work at the best of times, but a lot of work has been done on Temporal, an all new approach currently at stage 3. Dr. Axel gives us a through, practical tour. Fantastic.
Dr. Axel Rauschmayer
Solid 1.0: A Declarative JavaScript UI Library Worth Investigating — JavaScript isn’t short of good reactive frameworks (React, Svelte, Vue..) but Solid’s creator is determined and adamant to demonstrate how Solid addresses React’s shortcomings while offering Svelte-like simplicity. He makes a good case, so try and give him at least a few minutes of your time.
Ryan Carniato
Download FusionAuth Today and Get a Free T-Shirt — FusionAuth is a modern CIAM that’s fully customizable for your team. Implement complex standards like OAuth, SAML, and OpenID Connect. Build out additional features like SSO, MFA, and branded login pages. Plus, it’s always free for unlimited users.
FusionAuth sponsor
🎲 The ‘JS is Weird’ Quiz — How well do you think you know the trickiest corners of JavaScript syntax and dynamic typing? Put yourself to the test with these 25 questions. I’m not even going to share my pathetic score.. 😂
Jacob Bergdahl
Quick Bits
Think you can make something cool happen in just 1024 bytes of JavaScript? JS1024 is for you. It’s an annual contest to create the most striking thing in 1KB. Here’s one of last year’s winners.
There are fresh security releases of each maintained Node.js branch.
The Chrome team has unveiled the work they’re doing to create the ‘next generation’ of rendering engine for Chrome.
Google has delayed its plans to block third-party cookies in Chrome until 2023.
Need some weekend reading? Read this (extremely) thorough guide to JavaScript’s first 20 years.
Releases
TypeScript 4.4 beta 1 — The JavaScript superset.
p5.js 1.4.0 — Processing-inspired creative coding library.
Stepzilla 7.0 — Form/wizard helper for React components.
web3.js 1.4 — Ethereum JS API.
Plotly.js 2.2 — Charting library.
Espree 8.0 — Esprima-compatible pure JS JavaScript parser.
💻 Jobs
Lead Full-Stack Software Engineer (USA) — Join a team of engineers and designers crafting digital products for companies such as HBO, adidas, Supercell, and Nokia.
Reaktor
Now Hiring: Work with the Best, Building the Best — The sharpest developers, building the fastest websites. Looking for more, to build more. Join us.
Econify
Find a Job Through Hired — 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
Encoding Data for POST Requests Properly — While we’re talking Copilot, Jake noticed that an example it threw up isn’t all that great security wise, and spun it into a good lesson about creating HTTP data bodies properly, while covering things like URLSearchParams and FormData along the way.
Jake Archibald
How to Structure and Organize a React App — We’ve featured a variety of “how to structure React apps” pieces in the past, but it remains a perennially interesting topic as there really is no one way. Tania is always fantastic at explaining things though, so we really like this one.
Tania Rascia
Continuously Improve Your Code with Rollbar — Deploy with confidence at every development stage & set up AI-assisted workflows for fast resolution. Spend more time building. Less time fixing. Try it for free.
Rollbar sponsor
Sorting Colors in JavaScript — Sounds easy but.. there’s some nuance to doing this. An interesting exploration.
Tomek Nieżurawski
Lessons From Building a Static Site Generator — The backstory behind Elder.js and the thinking behind the biggest design decisions involved.
Nick Reese
Image To Text Conversion With React and Tesseract.js
Ayobami Ogundiran
🛠 Code & Tools
Milkdown: A Plugin-Driven WYSIWYG Markdown Editor — Built on top of CodeMirror, the plugin system lets you easily enable or disable features like tables, LaTex support, and slash commands. Try it out here.
Saul Mirone
A Code Generator for Making HTTP Requests — A simple but sweet tool for defining what HTTP request you want to make (including headers, request body, and certain types of auth) and you can then copy/paste code for Node (Axios is used here), curl, fetch in the browser, or Google Apps Script (it’s JavaScript but very specific to Google’s environment).
Amit Agarwal
Instant GraphQL Backend for Your Apps | Get Started for Free in 30 Seconds — Point Hasura at your data & instantly get realtime GraphQL APIs without the need to build & operate a GraphQL Server.
Hasura sponsor
Slowfil.es: Deliberately Slow HTTP Resources for Testing — We’re all told to make our sites as fast as possible and there are numerous ways to improve the experience when page elements like images or fonts are slow to load, but if you want to test what happens for real.. this service could help introduce some true sluggishness into your system.
Harry Roberts and Ryan Townsend
Google’s New Tool for Understanding Package Dependencies — deps.dev is an experimental project by Google that scans places like GitHub and the npm registry for package info, determines full dependency graphs, and then lets you navigate this data.
Million: A Less-than-1KB Virtual DOM Implementation — Aims to fix many of the problems in other abandoned and overcomplicated solutions with a library-agnostic virtual DOM alternative. GitHub repo.
Million
Gute: A Simple JS Library for Building Web Games — Currently provides game loop, input, sounds, music, and tilesets for building simple web-based games. See an example here.
Coke And Code
Build In-App Chat Like iMessage, Telegram or Slack with Stream’s React Native SDK
Stream sponsor
wait-on 6.0: A CLI and Node Library to Wait for Ports, Files, Sockets, etc. — For when you need to wait until files, ports, sockets, and similar resources become available (or the opposite).
Jeff Barczewski
XO: An Opinionated but Configurable ESLint Wrapper
XO
👾 And one for fun..
A Fortnite-Inspired VS Code Theme — No, me neither, but I’ve gotta admit I really like this color scheme. Vibrant!
Sarah Drasner
Permanent link to this post here
