Preact creator Jason Miller joins Jerod and Nick to discuss WMR– the tiny all-in-one development tool for modern web apps.
We ask Jason what “modern web app” means, how WMR fits in to the JS tooling landscape, why the Preact team created it in the first place, and dig into all it has to offer. Where’s My Roomba?
What would happen if browsers came pre-installed with Node.js, an IDE, and a simple runtime environment?
…there’s been a kind of revolution around coding. “Javascript everywhere” (i.e. node.js) has really become the default web-development paradigm. Javascript is alluring - partly because every computer has a javascript GUI and runtime - the browser! You can code in javascript on your computer using a text editor and a browser - without ever touching the command line!
But, what if a full-fledged dev environment for JavaScript was just as ubiquitous as the runtime in the browser?
There’s a new stack in town. PETAL. It destructures to Phoenix, Elixir, Tailwind, Alpine and LiveView. So what is it? Well, it helps you build web applications. Let me tell you about it…
I love posts like these from startups/projects that share how they’re doing over time:
Excalidraw started as a way to procrastinate on January 1st, 2020, and ended up being a fully fledged whiteboard product only one year later! In this post, we’ll go over the most important features that made Excalidraw great at being a virtual whiteboard for sketching hand-drawn like diagrams.
They detail their open source tech stack, new features the team shipped last year, cool things people are doing with the tool, and more.
(The tool itself, btw, looks totally rad and is definitely something I’ll be toying with over the coming weeks.)
KBall, Amal, Chris, Divya, Jerod, and Emma discuss 2020: the good, the bad, and the ugly. Then they change direction and discuss their 2021 resolutions and wishes!
A Chrome and Firefox extension that mounts your browser tabs as a filesystem on your computer.
This gives you a ton of power, because now you can apply all the existing tools on your computer that already know how to deal with files – terminal commands, scripting languages, point-and-click explorers, etc – and use them to control and communicate with your browser.
Now you don’t need to code up a browser extension from scratch every time you want to do anything. You can write a script that talks to your browser in, like, a melange of Python and bash, and you can save it as a single ordinary file that you can run whenever, and it’s no different from scripting any other part of your computer.
Today we welcome Mike Pennisi into our Maintainer Spotlight. This is a special flavor of The Changelog where we go deep into a maintainer’s story. Mike is the maintainer of JSHint which, since its creation in 2011, was encumbered by a license that made it very hard for legally-conscious teams to use the project. The license was the widely-used MIT Expat license, but it included one additional clause: “The Software shall be used for Good, not Evil.” Because of this clause, many teams could not use JSHint.
Today’s episode with Mike covers the full gamut of JSHint’s journey and how non-free licensing can poison the well of free software.
Amal and Divya turn our spotlight inward and interview our very own Christopher “Boneskull” Hiller about maintaining Mocha.js. Mocha has been a mainstay in the JavaScript testing community for ten (!) years now! They discuss the secret to Mocha’s success, what it’s like to maintain it, and how to make maintainers (and users) happy!
You can clone, deploy, and fully customize your own virtual event from this open source repo that was used to run Next.js Conf 2020 (which hosted 40k+ attendees). Features!
Congrats to Guillermo and the entire team on this big vote of confidence!
When responding to investors, we told them the stories of our customers, from independent developers to Fortune 10 companies, and the lessons we learned this year about how Next.js and Vercel help teams collaborate and move faster with greater flexibility.
It’s fascinating how front-and-center Next is in Vercel’s story.
Related: we have an excellent episode of The Changelog coming down the pipeline with Guillermo and JS Party regular Amal Hussein discussing where the web is headed in 2021 and beyond.
Something to look forward to. 😉
The engineering teams at Lyft were facing some serious issues:
we were running into headwinds trying to maintain our own frontend platform — an internal set of Webpack configurations, ESLint libraries and framework code — and finding ourselves bogged down troubleshooting cryptic build errors and generally finding our productivity sapped by such support requests. Because codebases began to diverge (as they do in microservice architectures), our developers found the task of upgrading to new versions of our frontend platform to be time-intensive and frustrating.
With over 100 frontend services and nearly as many frontend engineers, it was clear something needed to be done in order to ensure that our platform was maintainable for Lyft’s growth.
With a team that large and the freedom to spin up a new microservice whenever the need arises, it must be terribly difficult to fend off divergence in coding architecture, style, tooling, and dependencies. Unless you unify everyone one a common foundation. A framework, if you will…
Curious if and how your site would benefit from switching to modern JS syntax? Plug the URL into this tool and find out. Here’s what the output looks like when we point it changelog.com 👇
Fun to read the comments as people collaborated on making it smaller and smaller. TLDR:
<body onload=z=c.getContext`2d`,setInterval(`c.width=W=150,Y<W&&P<Y&Y<P+E|9<p?z.fillText(S++${Y=`,9,9|z.fillRect(p`}*0,Y-=--M${Y+Y},P+E,9,W),P))):p=M=Y=S=6,p=p-6||(P=S%E,W)`,E=49) onclick=M=9><canvas id=c>
Lighthouse has been part of my daily work for the last few months and it is time to share how I am using the tool in a product used by millions of people and what I have discovered during this process.
In this post, I cover what is my tooling and how I am approaching the audit opportunities.
JavaScript cops a lot of sneers and snide remarks. Some of them are deserved. Others, not so much. One that often comes up is floating point numbers. And in days past, it was a legitimate criticism.
It’s not that JavaScript did floating point numbers any worse than other languages. It uses the same IEEE standard that most of them do. The trouble is that floating point numbers were the only option. There was no other number type in JavaScript.
That’s no longer the case.
For over a year now, BigInt has officially been part of the TC39 ECMAScript standard. So we have another option for number types, besides floating point.
How does that help though?
Well, BigInt values are not restricted to 64 bits. They can be arbitrarily long. With a little mathematical care, we can use them to make very high precision calculations. And it’s not terribly hard either. You can write your own library from scratch with the power of BigInt.
k6 is a modern load testing tool, building on Load Impact’s years of experience in the load and performance testing industry. It provides a clean, approachable scripting API, local and cloud execution, and flexible configuration.
Suz, Amal, and Chris join Jerod to discuss what APIs are all about, share some APIs they admire, and lay out principles and practices we can all use in our APIs.
Screenity is a Chrome extension that will help you level up your screen recording/sharing game. How does it compare with other offerings in this category? Here’s a google sheet with the feature breakdown.
Nick, and Kball are joined by Mike Hartington to talk about Ionic, the state of web components, developer tooling, and more!
What the what is DivOps?! That’s the question Jonathan Creamer is here to answer. In so doing, we cover the past, present, and future of frontend tooling.
Aleph.js doesn’t need webpack or other bundler since it uses the ESM imports syntax. Every module only needs to be compiled once and then cached on the disk. When a module changes, Aleph.js just needs to re-compile that single module, there’s no time wasted to re-bundle every changes, and instantly updates in the browser by HMR (Hot Module Replacement) with React Fast Refresh.
The “$X but for Deno” meta trend is starting to pick up steam. Expect more like this in 2021 and beyond.
Frontend Feud returns! Emma heads up team Boooooleans 👻 and Nick captains the Whiteboard Interviews Millionaires. We played this game for our friends at HalfStack Conf and the full video of the session is on our YouTube channel too. Take the survey!
The article explains how you can use the new Shape Detection and Text Detection APIs to detect faces, barcodes, QR codes, and text on images. Sample code and working demo are available, too.
Timelines are hard to get right and React-Chrono looks really well done. It has 3 modes (vertical, horizontal, and vertical alternating where cards alternate between left and right side of timeline), lets you include images & videos, and is highly customizable.
