Frontend Focus is a once-weekly roundup of the best front-end news, articles and tutorials. Here is a quick overview of the code, tools and resources from this week.
Austin GL presents StyleCheck: Audit The Effect of Different CSS Sources on Plain HTML Elements, which shows you a comprehensive set of HTML elements to which you can apply a selected library (Bootstrap, Normalize, etc) or import one via URL to see how the elements behave.
There is a Font Brief information, provided by KORE – Discover Fonts Based on Font Attributes, which lets you search a curated collection of paid and free fonts using specific font qualities like elegance, friendliness, classic, and so forth.
You can find details about New Next.js Blog Starter: Headless CMS with Sitemap and Page Management, given by the sponsor of this article, AGILITY CMS, where they speak of Blog with Next.js.
Next.js is a flexible and powerful framework for building websites on the Jamstack, and we’ve unlocked that power with Agility CMS in this starter template. The code itself takes advantage of powerful tools such Tailwind CSS, a simple and lightweight utility-first CSS framework, and next/image for automatic image optimization. It all works out of the box, and you can deploy it automatically to Vercel for free, so no coding is required.
You can also view individual page components here or check out the full demo about Soft UI Dashboard: A Free Bootstrap 5 Dashboard.
There is some information about Alternative Tweet Embeds, given by Stefan Bohachek, on Embed Tweets Without Compromising Your Users’ Privacy and Your Site’s Performance, which you can read here
If you are interested in Sergey (A Tiny Static Site Generator), which is a no-configuration SSG that will render your HTML, include partials and render out slots, you can read the whole article here. The sort of thing you’d use if even Eleventy is too much.