Editor's Pick
Why I Won't Use Next.js
From the perspective of web standards to concerns about increasing complexity, Kent C. Dodds shares his opinions on why he won't use Next.js.
Accessibility
A11y is not accessible
Accessibility is a long word. It’s not the simplest of words to read or to spell, so it seems like a word that would be a good candidate for abbreviation. The common abbreviation of accessibility is a11y. We take the A and Y from the beginning and end of accessibility, and 11 for the number of letters in between. This abbreviation also creates a pleasing homophone for ‘ally.’
The irony of this abbreviation is that a11y isn’t accessible. Using jargon in this way can be a fail for WCAG guideline 3.1.3.
CSS
Tailwind vs Semantic CSS
This study compares two websites with a similar design: the official Tailwind “spotlight” template from the developers of Tailwind, and the same site crafted with semantic CSS and Nue server components. We’ll take a deep look at what is under the hood and how the sites are built.
A Couple of New CSS Functions I’d Never Heard Of
Featuring:
- light-dark()
- xywh()
- round()
- perspective()
HTML
Select element: now with horizontal rules
The select element gets a small but mighty upgrade in Chrome 119, with a feature that also landed in Safari 17. Now, you can add <hr> (horizontal rule) elements into the list of select options and they will appear as separators to help visually break up the options for a better user experience.
JavaScript
jessquery - a modern jQuery and it's only 4kb after gzip
jessquery is a lightweight wrapper around the DOM API that offers the intuitive elegance of jQuery, but streamlined for the modern web.
Rekindle your love for method chaining-- now in a lightweight, type-safe package! With 43 custom methods that are sneakily powerful, jessquery helps you seamlessly handle asynchronous tasks, customize error behaviors, and ensure your DOM operations always execute in order.
Web Components Will Outlive Your JavaScript Framework
If we're building things that we want to work in five or ten or even 20 years, we need to avoid dependencies and use the web with no layers in between.
How to Think About Security in Next.js
Learn about what security protections are built-in Next.js and view a guide for auditing applications.
Stop learning JavaScript frameworks (& libraries)
When your "blank slate" html document contains a framework or library, your front-end's default state is mediocre loading, and it can only get worse from there.
If you understand how to do something using only JavaScript, you can easily figure out how to replicate the behavior in any framework. However, you'll have a hard time converting a behavior from a framework to vanilla JS, or harder yet, another framework. Once you get something working with vanilla JS, you can reuse that code anywhere. Very few frameworks have painless conversion to other frameworks.
Why I Won't Use Next.js
From the perspective of web standards to concerns about increasing complexity, Kent C. Dodds shares his opinions on why he won't use Next.js.
You Don't Know JS Yet (book series) - 2nd Edition
This is a series of books diving deep into the core mechanisms of the JavaScript language. You're able to read these books online here entirely for free.
Crypto.js vulnerability makes PBKDF2 1k times weaker than specified in 1993
crypto-js is a JavaScript library of crypto standards. Prior to version 4.2.0, crypto-js PBKDF2 is 1,000 times weaker than originally specified in 1993, and at least 1,300,000 times weaker than current industry standard. This is because it both defaults to SHA1, a cryptographic hash algorithm considered insecure since at least 2005, and defaults to one single iteration, a 'strength' or 'difficulty' value specified at 1,000 when specified in 1993.
Web Scraping in Javascript and Nodejs (Tutorial for Beginner)
How to scrape data from a website with Javascript? A complete step-by-step tutorial for beginners. Using Cheerios, Axios, and Puppeteer.
React Scheduler
Display any kind of resources on a blazing fast timeline using lightweight and flexible React component for free.
UX
Modals Are The Worst
This is my "Hot Take" for the front-end world. I truly think modals are bad. Bad for the end user, and a crutch that too many developers and UX folk rely on.
The Negative Impact of Mobile-First Web Design on Desktop
Mobile-first web designs cause significant usability issues when viewed on desktop. Content becomes overly dispersed across long scrolling pages with expansive white space and enlarged images and fonts, making it difficult for users to consume and understand the information.
Miscellaneous
TeleportHQ Front-End Platform: Integrated UI Dev and Headless Static Sites
Front-end development platform, with a visual builder and headless content modelling capabilities. Static website creation, and UI development tools.
Trace Pixels To Vectors in Full Color
Convert your JPEG and PNG bitmaps to SVG vectors quickly and easily.
Free while in Beta.
It's 2023, here is why your web design sucks.
Exploring the reasons why we no longer have web designers.
3D Book Image CSS Generator
Generate an animated 3D image from a book cover and export to HTML/CSS to embed on your website.