Tech does not just watch: Take action against Russia’s war on Ukraine 🇺🇦, and take action against Israel’s occupation, destruction, and ethnic cleansing of Palestine (history) 🇵🇸 Hide

Frontend Dogma

“examples” News Archive

Definition, related topics, and tag feed

“examples” RSS feed (per email)

Entry (Sources) and Additional TopicsDate#
More Invoker Commands, and More Reasons Not to Use JavaScript Please (paw)271
html
How to “@ scope” CSS Now That It’s Baseline (dxn/fro)270
css, scope
Fixing the URL Params Performance Penalty (tun/per)269
performance, urls, caching, http-headers
Using the Browser Console for Accessibility Testing268
accessibility, testing, console, javascript
Design Accessible Animation and Movement With Code Examples (pop)267
design, accessibility, animations, css, javascript
Masonry: Things You Won’t Need a Library for Anymore (pat/sma)266
css, masonry, layout, web-platform
A Pragmatic Guide to Modern CSS Colours II (kev/pic)265
guides, css, colors
Brand New Layouts With CSS Subgrid (jos)264
layout, css, grids
Use Cases for Field Sizing (sha)263
forms, css
Blogging Gets Serious in 2001 With Warblogs and Movable Type (ric)262
history, blogging, movable-type
How to Write an Accessibility Statement in 2025, With Examples (chr)261
how-tos, accessibility, documentation, compliance, legal
Reading and Writing Files in Node.js—the Complete Modern Guide (loi)260
guides, nodejs, file-handling
The New “progress()” Function in CSS (ami)259
css, functions
A Pragmatic Guide to Modern CSS Colours (kev/pic)258
guides, css, colors
A Few Fun Nesting Tips and Tricks (kev)257
css, nesting, tips-and-tricks
Accessible Form Validation With Examples and Code (pop)256
accessibility, validation, forms
How Much Do You Really Know About Media Queries? (dxn/fro)255
css, media-queries
Mastering npx: A Cheatsheet for npm and Node.js Power Users254
npx, cheat-sheets, nodejs, npm
What Can We Actually Do With “corner-shape”? (dxn/css)253
css, borders, shapes
How to Make Complex Data Accessible for Users With Disabilities (pop)252
how-tos, accessibility, information-design, visualization, tables
The Fundamentals of CSS Alignment (css)251
fundamentals, css, alignment
You No Longer Need JavaScript (reb)250
javascript, css, html
Rolling the Dice With CSS “random()” (jon+/web)249
css, functions, randomness
Another Article About Centering in CSS (bel/pic)248
css, centering
5 Useful CSS Functions Using the New “@ function” Rule (una)247
css, functions
Liquid Glass on the Web (chr/fro)246
design, effects, liquid-glass, apple, css
Eight Skunkworks Projects That Advance Accessibility Without Approval245
accessibility, advocacy
A Label and a Name Walk Into a Bar (ste)244
accessibility, labels, html, concepts
The History of React Through Code (cru/pla)243
react, history
Tips for Making Regular Expressions Easier to Use in JavaScript (rau)242
regex, javascript, tips-and-tricks
Top Storybook Documentation Examples and the Lessons You Can Learn241
storybook, documentation, lessons, link-lists
“aria-selected”: Practical Examples and Use Cases (flo/a11)240
accessibility, aria, html
Translating Accessibility (tpg)239
accessibility, localization, attributes
3 AI Websites That Will Blow Your Mind238
design
A JavaScript Developer’s Guide to Go (psu)237
guides, go, javascript
MCP—the Golden Key for AI Automation236
mcp, ai, automation
Best Examples of EAA Compliant Websites in 2025235
accessibility, eaa, compliance
Multithreading in JavaScript With Web Workers (hon)234
javascript, multithreading, web-workers
Cold vs. Hot Observables in Angular With RxJS233
angular, asynchronicity, reactivity, terminology
Guitar Chords in CSS (sto)232
css, functions
Are “CSS Carousels” Accessible? (sar)231
css, carousels, accessibility
Passkeys for Normal People (tro)230
security, authentication, passkeys, concepts
Node.js Streams With TypeScript229
nodejs, streaming, typescript
11 Practical Ways I Use AI Agents Without Losing My Authenticity (bla/ope)228
ai, creativity, processes
CSS Bursts With Conic Gradients (chr/fro)227
css, gradients, effects
Four Rules for How Design Influences Technology (uxd)226
design, product-management
React 19’s New Hooks: With Practical Examples (let)225
react, hooks, javascript
JavaScript Basics for a Senior Dev224
fundamentals, concepts, javascript
On JavaScript Closures (With Examples of Interview Questions) (mar)223
guest-posts, javascript, closures, variables, interviewing
Prompt Engineering for Web Development222
ai, prompting
Accessible Solutions Benefit Everyone: Here’s How (nng)221
videos, design, accessibility
Using and Styling the “details” Element (geo/css)220
html, css, disclosure-widgets
Learn Zod So You Can Trust Your Data and Your Types (did)219
libraries, types, typescript
Leverage on Redux to Execute Your Tests 100× Times Faster218
react, redux, testing, performance
Examples of Why the Web Needs Anchored Popovers (chr/fro)217
design, pop-overs
Documenting Web Components With Storybook216
documentation, design-systems, web-components, storybook
Extending the Cursor (kyl)215
design, interaction-design, cursors
On Building AI Understanding and Automation Muscle (With 18 Random Problems Solved With AI) (j9t)214
ai, automation
How to Use ARIA Alert Effectively (flo/a11)213
how-tos, aria, accessibility, best-practices
CSS “scroll-state()” (arg/dev)212
css, container-queries, scrolling
TypeScript Generics: A Complete Guide211
guides, typescript, generics
11 YAML Configurations for DevOps Automation210
yaml, configuration, dev-ops, ci-cd, automation
How to Make Your Angular Projects More Accessible209
how-tos, angular, accessibility
React 19 and Web Component Examples (chr/fro)208
react, web-components
Native CSS Nesting Is Here (tre)207
css, nesting
CSS Advent Calendar206
websites, css
CSS Selectors Advent Calendar 2024205
css, selectors
Goodhart’s Law in Action: 3 Webperf Examples (nom/per)204
performance, principles, lighthouse, web-vitals, metrics, google
Beautiful Focus Outlines (med)203
css, focus, accessibility
HTML Cheat Sheet202
html, semantics, cheat-sheets
You Are Not a CSS Dev if You Have Not Made a CSS Reset201
css, resets
How to Build Smaller Container Images: Docker Multi-Stage Builds200
how-tos, containerization, docker
Do’s and Don’ts of Commenting Code199
comments, documentation, best-practices
8 Examples of Versioning in Leading Design Systems198
design-systems, versioning, google, shopify, adobe, atlassian
HTML for People (bw)197
books, websites, html
The Best Examples of Data Visualization in 11 Leading Design Systems196
design-systems, information-design, visualization
A Guide to Destructuring in JavaScript (wil/pic)195
guides, javascript
SVG Coding Examples: Useful Recipes for Writing Vectors by Hand (sma)194
images, svg
Better Vue Components With TypeScript (fad)193
vuejs, components, typescript
The Undeniable Utility of CSS “:has” (jos)192
css, selectors
Understanding JavaScript Closures With Examples (tre)191
javascript, closures
Quick Guide to Web Typography for Developers (ole)190
guides, typography, fonts
How I Use “AI”189
ai, productivity
HTML Web Components Make Progressive Enhancement and CSS Encapsulation Easier (css)188
html, web-components, principles, solid, progressive-enhancement
Alternative Text in Action187
accessibility, images, alt-text, writing
Understanding JWT Authentication: A Comprehensive Guide With Examples186
guides, json-web-tokens, authentication
Simplest View Transitions Multi Page Demo (No JavaScript) (mor)185
css, view-transitions, apis
HTML Cheat Sheets: From Basics to Advanced Elements184
fundamentals, html, semantics, cheat-sheets
Live Demos of Stand Alone Web Components (chr/fro)183
web-components, link-lists
CSS-Only Custom Range Slider With Motion (bra)182
sliders, css, effects
Let’s Hang! An Intro to CSS Anchor Positioning With Basic Examples (uti)181
introductions, css, anchor-positioning
Flow Charts With CSS Anchor Positioning180
css, apis, anchor-positioning
Introducing the CSS Anchor Positioning API (una/dev)179
introductions, css, apis, anchor-positioning
Simple Implemention to Understand “worker_threads” in Node.js178
nodejs, worker-threads
Radix UI Adoption Guide: Overview, Examples, and Alternatives (log)177
guides, overviews, radix
Printing Music With CSS Grid (ste)176
css, grids
Building a Micro htmx SSR Framework (mco/pla)175
frameworks, htmx
Express.js With TypeScript—Setup, Examples, Testing174
videos, express, typescript, testing
Some Little Ways I’m Using CSS “:has()” in the Real World (bel/pic)173
css, selectors
How npm Install Scripts Can Be Weaponized: A Real-World Example of a Harmful npm Package (eth)172
npm, dependencies, security
Navbar Gallery171
websites, navigation, design-patterns
Definition of Done (DoD) Explanation and Example170
agile, scrum, processes, quality
React Props Explained With Examples169
react, props
Angular Signals: Complete Guide168
guides, angular, signals
CSS Modules (fro)167
css, modules, scope
Streams in Node.js166
nodejs, streaming
Content Negotiation in Practice (sof)165
content-negotiation, http
Svelte by Example (seb)164
websites, svelte
Color Contrast Accessibility Tools With Examples (pop)163
accessibility, tooling, link-lists, colors, contrast
Sharing State With Islands Architecture (max)162
architecture, state-management, astro, react
Securing Your Node.js Apps by Analyzing Real-World Command Injection Examples161
nodejs, security, history
The Spectrum of Openness160
foss, legal
IndexedDB Tutorial for Beginners: A Comprehensive Guide With Coding Examples159
tutorials, guides, databases, indexeddb
A Web Component Intro With Example158
introductions, web-components
Regular Expressions in JavaScript (hon)157
javascript, regex
What Are User Permissions? Concepts, Examples, and Maintenance156
permissions, authorization, concepts
The Real Difference Between “useMemo” and “Memo” in React155
react, hooks, performance
Alternative Text in the Wild: 5 Alternative Text Examples (pop)154
accessibility, writing
Tether Elements to Each Other With CSS Anchor Positioning (jhe/dev)153
css, anchor-positioning, focus, apis
Learn All About Node.js Worker Threads With Examples152
nodejs, worker-threads
Animating CSS Grid (How-To and Examples) (dxn/css)151
css, grids, layout
Useful Accessibility and Usability Examples to Help Improve Your Designs (sma)150
accessibility, usability
Get Off the Main Thread With an Inline Web Worker: An Example (sto/per)149
performance, javascript, web-workers
An Interactive Guide to JavaScript Events (ale)148
guides, javascript, events
CSS Grid vs. Flexbox: How to Decide (With Examples) (ell)147
css, grids, flexbox, layout, comparisons
CSS Selectors—Cheat Sheet for Class, Name, Child Selector List (fre)146
css, selectors, cheat-sheets
What Is HCI (Human-Computer Interaction)? Meaning, Importance, Examples, and Goals145
concepts, hci
JavaScript Obfuscation Techniques by Example144
javascript, obfuscation, techniques
HTML Cheatsheet143
html, cheat-sheets
HTML Cheat Sheet: A Quick Reference Guide for HTML Developers142
guides, html, semantics, cheat-sheets
Call to Action Examples141
websites, writing, buttons
HTML Cheat Sheet—HTML Elements List Reference (fre)140
html, semantics, cheat-sheets
Responsive Image Gallery With Animated Captions (5t3)139
images, css, animations, responsive-design
HTML Cheat Sheet138
html, semantics, cheat-sheets
11 Methods to Add CSS/JS Frontend Assets Into TYPO3 (t3p)137
typo3, css, javascript
Introduction to GSAP136
introductions, animations, gsap
HTML Cheatsheet135
html, semantics, cheat-sheets
Modular Code With Nunjucks and Eleventy (jer)134
nunjucks, eleventy
An Unreasonably Long Introduction to ARIA (With Example Implementation)133
introductions, accessibility, aria, live-regions
The Ultimate CSS Flexbox Cheat Sheet With Examples132
css, flexbox, layout, cheat-sheets
The Simplicity of Svelte131
svelte, simplicity
A Complete Guide to Custom Properties (chr/css)130
guides, css, custom-properties
The Principles of Visual Communication (sma)129
design, communication, principles
Node.js Testing Best Practices128
nodejs, testing, best-practices
What Is Parallax Scrolling, Explained With Examples127
parallax, scrolling, effects
The CSS Calculating Function Guide (chr/css)126
guides, css, functions, math
Old CSS, New CSS (eev)125
css, html, history, browser-wars, doctype-switching, dhtml, web-2.0, hacks, vendor-extensions, flexbox, layout
A Tale of CSS Resets and Everything You Need to Know About Them124
css, resets, link-lists
Liquid Templating Crash Course123
crash-courses, liquid, template-engines, jekyll
What Is Vuetify? How to Install and Key Components Overview122
vuetify, nuxt, laravel, how-tos
CSS Custom Properties in the Cascade (mia/sma)121
css, custom-properties, cascade
Getting to Know the “useReducer” React Hook (css)120
react, hooks
Micro Frontends (cam/mfo)119
architecture, micro-frontends, backend-for-frontend
How to Section Your HTML (css)118
how-tos, html, semantics
The Thinking Behind Simplifying Event Handlers (not/css)117
javascript, events
An Introduction to Gulp.js (cra)116
introductions, gulp
The Power of Named Transitions in Vue (css)115
vuejs, transitions, css
How “@ supports” Works (chr/css)114
css, feature-detection, support
An Overview of Render Props in React (css)113
overviews, react, props
A Minimal JavaScript Setup (css)112
javascript, conventions, naming, scope, performance, maintainability
What Is SVG Good For? (chr/css)111
svg, images
Introduction to Material Design110
introductions, material-design, google, mobile
Your Interactive Makes Me Sick109
accessibility, scrolling, user-experience
Styling Empty Cells With Generated Content and CSS Grid Layout (rac/sma)108
css, generated-content, grids, layout
Content Security Policy: The Easy Way to Prevent Mixed Content (css)107
csp, wordpress
Custom Elements v1—Reusable Web Components (dev)106
html, maintainability, web-components, shadow-dom, dom
All About React Router 4 (bra/css)105
react, react-router, routing
Stop Using Resets: Visual Examples of the Practical Nonsense of Resets and Normalizers (j9t)104
css, resets
(Now More Than Ever) You Might Not Need jQuery (oll/css)103
jquery, javascript, ajax, performance, comparisons
Some Extremely Handy “:nth-child” Recipes as Sass Mixins (css)102
css, selectors, sass, mixins
Simple Offline Website (chr/css)101
offline
It’s Time to Start Using CSS Custom Properties (sma)100
css, custom-properties
Let’s Define Exactly What Atomic CSS Is (joh/css)99
atomic-css, presentational-html, concepts, link-lists
CSS Grid: One Layout, Multiple Ways (geo/css)98
css, grids, layout
webcomponents.org97
websites, web-components
Spoooooky CSS Selectors (chr/css)96
css, selectors
Accessible SVGs (css)95
svg, images, accessibility
How to Use ES6 Arguments and Parameters (sma)94
how-tos, ecmascript, javascript
A History of CSS Image Replacement93
css, image-replacement, techniques, history
26 Impressive Web Projects Built With CSS Only92
css, link-lists
An Ultimate Guide to CSS Pseudo Classes and Pseudo Elements (sma)91
guides, css, selectors
Working With Images in Stylesheets With PostCSS (css)90
css, images, backgrounds, postcss
6 jQuery Infinite Scrolling Demos89
jquery, scrolling
Let’s Learn ES2015 (css)88
ecmascript, javascript, variables, functions, operators
How Good Are Your HTML and CSS Comments? (hey)87
html, css, comments, maintainability, collaboration
Why npm Scripts? (css)86
npm, nodejs, conversion, linting, minification, compression, sprites, images
A Beginner’s Guide to WebGL85
guides, webgl, tooling, link-lists
Using Multi-Step Animations and Transitions (geo/css)84
css, animations, transitions, transforms
Gulp for Beginners (zel/css)83
gulp, automation, installing
The Future Generation of CSS Selectors: Level 4 (lou)82
css, selectors
Designing for Explicit Choice (sma)81
design, forms
Sanitizing, Escaping, and Validating Data in WordPress80
wordpress, sanitization, escaping, validation
Accidental CSS Resets (chr/css)79
css, resets, shorthands
The Good, the Bad, and the Great Examples of Web Typography (sma)78
typography, fonts
A Guide to the HTML5 “time” Element77
guides, html, time
Understanding Transducers76
programming, functions
An Introduction to WAI–ARIA75
introductions, aria, accessibility
jQuery With CoffeeScript (chr/css)74
jquery, coffeescript
CSS Selectors Cheat Sheet73
css, selectors, cheat-sheets
Stripes in CSS (chr/css)72
css, gradients, effects
Using Meta Tags in HTML: Some Basics and Best Practices71
html, metadata, fundamentals, best-practices
Basics of CSS Blend Modes (chr/css)70
fundamentals, css, blend-modes, backgrounds
The Current Generation of CSS3 Selectors (lou)69
css, selectors
Understanding JavaScript “bind()” (sma)68
javascript
Grunt for People Who Think Things Like Grunt Are Weird and Hard (chr/css)67
tooling, grunt, installing
The HTML5 “meter” Element (pan/css)66
html, semantics
A Guide to Web Components (css)65
guides, web-components
Art Directed Articles—Still a Good Idea? (chr/css)64
design, trends, responsive-design, link-lists
Controlling CSS Animations and Transitions With JavaScript (zac/css)63
css, animations, transitions, javascript
CSS3 Transition Property Basics (cra)62
css, transitions, fundamentals
A Simple Guide to Semantic Versioning61
guides, semver, versioning, git
Sass Style Guide (chr/css)60
sass, style-guides
Using SVG (chr/css)59
svg, images, css, support, browsers, data-urls, tooling, link-lists
Form Follows Function58
web-platform, experiments, effects
5 Use Cases for Icon Fonts (css)57
icon-fonts, fonts, css
Getting to Know CSS3 Selectors: Structural Pseudo-Classes56
css, selectors
Exploration of Single-Page Websites (sma)55
design, navigation, landing-pages
20 Inspirational Landing Page Designs54
design, landing-pages, link-lists
David Walsh on Redesigning With Sass (chr/css)53
sass, preprocessors, mistakes
5 Inspiring (and Useful) PHP Snippets52
php
An Overview of the Web Storage API (cji)51
overviews, browser-storage, apis
Basic JavaScript Regular Expression Example50
javascript, regex
Cross-Site Scripting Attacks (XSS)49
security, xss
Demonstrating Responsive Design48
responsive-design
Responsive Web Design47
responsive-design, css, media-queries
Smallest Possible […] File (mat)46
programming, minimalism, link-lists
An Introduction to Object Oriented CSS (OOCSS) (lou/sma)45
introductions, oocss, css
An Extensive Guide to Web Form Usability (sma)44
guides, forms, usability
Top Minimalist Website Designs: Trends and Examples43
design, minimalism, trends
The Guide to CSS Animation: Principles and Examples (sma)42
guides, css, animations, principles
An Introduction to Less: Less vs. Sass (sma)41
introductions, preprocessors, less, sass
What Makes for a Semantic Class Name? (chr/css)40
html, css, attributes, naming, semantics
Examples of Sites Where localStorage Should or Is Being Used (chr/css)39
browser-storage, apis, javascript
Learning to Use the “:after” and “:before” Pseudo-Elements in CSS (lou/sma)38
css, selectors, generated-content
Useful “:nth-child” Recipes (chr/css)37
css, selectors
Website Navigation: Planning and Implementing (vit/sma)36
navigation
Getting Started With Defensive Web Design (sma)35
introductions, design
How to Use CSS3 Pseudo-Classes (sma)34
how-tos, css, selectors
The Art of the Single Page Web Site33
design, link-lists
CSS Reset32
websites, css, resets, overviews
Video for Everybody (kro)31
html, multimedia
JS1k: The JavaScript Code Golfing Competition (pvd)30
websites, javascript
The Art of the Web Background29
design, backgrounds, link-lists
CSS Gradients (chr/css)28
css, gradients, backgrounds
SVG Wow27
websites, svg, images
50 Cool JavaScript Examples and CSS3 Tricks (vit/sma)26
javascript, css, tips-and-tricks, link-lists
Taming Advanced CSS Selectors (sma)25
css, selectors
Different Ways to Format CSS (chr/css)24
css, formatting
Effective Website Maintenance: Examples and Best Practices (sma)23
maintenance, maintainability, best-practices
How to Customise Your 404 Page22
error-pages, customization, usability, user-experience
CSS Browser Hacks (dal/aja)21
css, hacks
88 Outstanding Favicons and 6 Resources to Help You Create Your Own20
images, favicons, link-lists
Groups of 50+ AJAX Examples (dal/aja)19
ajax, javascript, link-lists
Footers in Web Design: Creative Examples and Ideas (sma)18
navigation, design
Cool and Useful GWT Solutions (dal/aja)17
gwt
User Agent Style Sheets: Basics and Samples (j9t)16
browsers, css, fundamentals
CSS Specificity: Things You Should Know (sma)15
css, selectors, cascade
Seven JavaScript Techniques You Should Be Using Today (dig)14
javascript, techniques
Prepare for Attack—Making Your Web Applications More Secure13
web-apps, security, sql, xss
Usability Conventions: Basics and Examples (j9t)12
fundamentals, conventions, usability
CSS-Based Forms: Modern Solutions (sma)11
forms, css, link-lists
JavaScript Closures for Dummies10
javascript, closures
Big, Stark, and Chunky (ali)9
accessibility, zooming, screen-magnification
CSS Zen Garden: The Beauty in CSS Design (dav)8
websites, css, design, css-zen-garden
CSS Zen Garden (dav)7
css, design, css-zen-garden
A Touch of Class (tan)6
html, attributes, semantics
PHP by Example5
php
DOM Design Tricks III: Using Events in the Document Object Model (jde/ali)4
dom, javascript, events, tips-and-tricks
DOM Design Tricks II (jde/ali)3
dom, javascript, tips-and-tricks
DOM Design Tricks (jde/ali)2
dom, javascript, tips-and-tricks
Using Frames: Some Examples of Good Frames Usage1
html, frames