Fabien Sanglard’s advice to writers:

By starting with a markup based generator, you rob yourselves of the opportunity to learn the core technology running the whole internet. Instead you will learn to use a layer built on top of it with little to no re-usable knowledge. Inevitably, you will want to do something the framework did not forecast and will come up with convoluted ways to do it anyway.

Additionally, depending on how long you will write and how often you do it, setting up a generator may be counterproductive.

The best way to avoid the YAGNI trap is to start as simple as possible and only add tech when you’re absolutely sure the ROI is higher than the TCO.

Nikola Đuza lays out a way you can customize your README to stand out from the crowd:

GitHub supports adding HTML in Markdown, but it is pretty aggressive when removing HTML that can be potentially dangerous to users. Things like scripts, iframes, and similar will get removed or “silenced” to avoid malicious content from being served to users.

Luckily, there’s one way to sneak in some HTML (or a web page) inside the README. You can do it via SVG and foreignObject SVG element.

A quick look at the history of building web apps, followed by a discussion of htmx and how it compares to both modern and traditional ways of building.

Fathy Boundjadj new html2svg project is pretty cool. We’ve seen a lot of efforts to convert HTML to raster images like PNG and JPG, but SVG is a different (pixel-independent) story.

This end product took some engineering, and the linked post goes deep into all the steps Fathy had to take along the way. From taking the picture to rendering to SVG to supporting shadows and more.

Estelle Weyl has been building the web since 1999 and documenting it since 2007. Today she joins Amal for a loooong and deeeep conversation about new and !important features of CSS & HTML. Sit down, strap in, and prepare to be schooled!

Tapajyoti Bose draws our attention to some obscure-but-useful elements: meter & progress, sup & sub, datalist, map & area, details & summary, object, and abbr

I love that people are bringing HTML back to the forefront:

Our mission is to enable anyone to build multi-page dynamic web apps while staying as close to the platform as possible. Enhance fills in the gaps to make building for the backend, and the browser a seamless experience for web authors and consumers.

Modern JavaScript frameworks bring more problems than they solve; recreating native web platform features adding unnecessary weight and complexity, which is challenging to unravel.

Enhance provides a dependable foundation built on standards-based web platform features, allowing developers to create web applications that are lightweight, flexible, and future-proof.

PyScript is a Pythonic alternative to Scratch, JSFiddle, and other “easy to use” programming frameworks, with the goal of making the web a friendly, hackable place where anyone can author interesting and interactive applications.

Lots of code examples of various apps (clock, repl, todos, etc) here. I love the why behind this effort:

As an industry, we have focussed on making the impossible possible, rather than focussing on making the possible accessible to all.

They want to bring programming to the 99%. Somebody’s gotta do it…

Austin Gil joins the show and KBall continues an old email correspondence about the JS community and growth. Then, the gang plays a round of TIL where Austin shares his learnings about the HTML capture attribute. Finally, Austin shares what it’s like to have a blog post blow up.

This is a nice round-up of some new(ish) HTML and JavaScript features related to forms. Now that Safari 16 is out, good stuff like requestSubmit and showPicker are looking pretty green!

11ty creator Zach Leatherman recently released a standalone HTML serializer for generating markup for Web Components. Here’s what Zach had to say about it on Twitter:

This is an early preview and I welcome feedback! I think it’s a great way to build standards-based HTML-first components without JavaScript framework overhead 🙌🏻

It’s cool to see the how far HTML has come. Every once in a while I find something that seems super powerful, wrapped up in a simple implementation. This time it was the HTML capture attribute.

This course from the folks at web.dev targets beginners and advanced developers alike.

You’ll learn PWA fundamentals like the Web App Manifest, service workers, how to design with an app in mind, what’s different from a classic web app, how to use other tools to test and debug your PWA. After these fundamentals, you’ll learn about integration with the platform and operating system, how to enhance your PWA’s installation and usage experience, and how to offer an offline experience.

Tabler is fully responsive and compatible with all modern browsers. Thanks to its modern, user-friendly design you can create a fully functional interface that users will love! Choose the layouts and components you need and customize them to make your design consistent and eye-catching. Every component has been created with attention to detail to make your interface beautiful!

Looks great!

Just copy/paste these SVGs into your HTML and you’re good to go!

Ignoring progressive enhancement could be seriously hurting your conversions. This article will show you how to build resiliency into your apps.

Hidde de Vries:

WebAIM have come out with their latest report on which accessibility issues they found in the top million websites that they tested automatically. What is some low hanging fruit you could fix today?

Louis Lazaris describes/demos somewhat obscure HTML attributes you may find useful enough to personally use in one of your projects. I learned a few things, maybe you will too.

Jen Looper from Web Dev for Beginners and Front-end Foxes joins Jerod and Ali to discuss the exciting (but also intimidating) prospect of getting in to web development in 2022! Where should you start? What technologies should you focus on? Is it better to go all-in on a framework or stick with the fundamentals? Stuff like that!

You’ll either love the humor laced throughout this YT video by Heydon Pickering… or you’ll hate it. Here’s a litmus test: does this quote tickle your funny bone at all?

But just like that time you whacked a zombie over the head with a shovel only to discover it was really your friend Jimmy with a hangover, this would be a grave mistake. And I use the term ‘grave’ advisedly, because having sent Jimmy to an early grave, this would increase the likelihood of him becoming a zombie in the not too distant future.

Chris does a great job answering what will surely be the most common question about this acquisition in his announcement post:

1. What happens to CSS-Tricks?
2. Will you still be running CSS-Tricks?
3. Why now?

The amount of value this team has given to the web world over the years is immeasurable.

I sincerely hope DigitalOcean turns out to be a worthy new steward of this precious resource and the site’s best years are ahead of it. 🤞

Install SingleFile on any major browser and then just:

1. Wait until the page is fully loaded.
2. Click on the SingleFile button in the extension toolbar to save the page.
3. You can click again on the button to cancel the action when processing a page.

Anybody who’s had to design/implement HTML emails knows how utterly painful it is. With Mailwind you get to do it the same way you’d build a site with Tailwind and then run:

mailwind --input-html email.html --output-css style.css
# or for inline styles
mailwind --input-html email.html --output-html email-inlined.html

And you’re off to the outbox! 📤

Building a modern front end in Django without reaching for a full-blown JavaScript framework. Choosing the right tools for the job, and bringing them into your project.

This is as close to a tutorial as you’ll see on Changelog News. I’m linking to it not for the step-by-step bits like talking to your “Django backend without a full-page reload”, but for the decision making bits like “when you might choose low-JavaScript.”

JS Party listeners and panelists celebrate our favorite moments from the past 100 episodes! You’ll hear from over 20 of your favorite voices across 14 episodes. We also share some behind-the-scenes and read/hear from listeners! Here’s to the last 200 episodes, and the next 200 as well. 🥂