Frontend Dogma

News and Tools for Frontend Development (5)

(Stay up-to-date on all topics by RSS feed or on Mastodon.)

  1. What the Heck Is a Homomorphic Mapped Type? · ·
  2. Inspecting WCAG 2.2: Accessible Authentication · · , , , ,
  3. Everything You Need to Know About Responsive Logo Design · · , , ,
  4. HTML Validation—Pros and Cons · · ,
  5. Every Container Queries Demo Is a Card · · ,
  6. Future of Storybook in 2024 · · ,
  7. Frontend Predictions for 2024 · · ,
  8. I Made JSX for Lua (Because I Hate Static Sites) · ·
  9. The New Old: Jamstack and MACH’s Journey Towards Traditional CMS Concepts · · , ,
  10. Coding Challenges 2024: What’s Your New Year’s Resolution? · · ,
  11. CSS Wishlist · · ,
  12. JS Design Patterns: A Comprehensive Guide · · , ,
  13. I Built the Same App 7 Times: Which JS Framework Is Best? · · , ,
  14. Container Style Queries · · ,
  15. Never Underestimate HTML · · , ,
  16. Measuring, Monitoring, and Optimizing TTFB With Server Timing · · , , ,
  17. Responsive SVGs · · ,
  18. The Devil Is in the Details: A Look into a Disclosure Widget Markup · · , ,
  19. Why AI Is a Disaster for the Climate · · ,
  20. CSS-Based State Management · · ,
  21. Session-Based vs. Token-Based Authentication: Which Is Better? · · , , ,
  22. The View Transitions API And Delightful UI Animations · · , , ,
  23. FileReader API · · ,
  24. ARIA Live Regions · · , ,
  25. WCAG 2.1 Developer Tips: Character Key Shortcuts and Label in Name · · , , ,
  26. GitHub Copilot: Tips and Tricks for Flutter Devs · · , , , ,
  27. The Implied Web · · , ,
  28. Cool Wiggly Hover Animation With CSS · · , ,
  29. 2023 Digital Accessibility Year in Review · · ,
  30. Scroll-Driven Animations · · , ,
  31. JavaScript Frameworks—Heading into 2024 · · , ,
  32. The Top Accessibility Errors Found in 2023 · · , , , ,
  33. “HTML First” Is Not HTML First · · , , ,
  34. Container Queries and Units · · , ,
  35. Turn Your Vue App into an Offline-Ready Progressive Web App · · , ,
  36. Screen Reader Users and the Tab Key · · , , , , ,
  37. The State of Benchmarking in Node.js · · , ,
  38. The Complete Playwright Cheatsheet · · , ,
  39. Recapturing Early-Internet Whimsy With HTML · · , , , ,
  40. Debugging Fetch Priority · · , , , ,
  41. New CSS Viewport Units Do Not Solve the Classic Scrollbar Problem · · , ,
  42. Clean Architecture: Theming With Tailwind and CSS Variables · · , , ,
  43. 10 Best Practices for Secure Code Review of Node.js Code · · , , ,
  44. CSS Nesting · · ,
  45. Locking Scroll With “:has()” · · , ,
  46. The Golden Rule of Web Performance and Different Performance Engineering Specializations · · ,
  47. Classes vs. Prototypes in JavaScript · · ,
  48. Release Notes for Safari Technology Preview 185 · · , , ,
  49. Are We Too Pedantic With Semantic · · , ,
  50. See What’s New in Firefox [121.0] · · , , ,
  51. New to the Web Platform in December · · , , , , , , , ,
  52. “align-content” in Block Layout · · , , ,
  53. View Transitions · · , ,
  54. Eigensolutions: Composability as the Antidote to Overfit · · ,
  55. Practical “img” Element Defaults · · , ,
  56. Reflow Red Flags · · , ,
  57. We Can :has It All · · , , ,
  58. Border Images in CSS: A Key Focus Area for Interop 2023 · · , , , , ,
  59. AI for Web Devs: AI Image Generation · · , , ,
  60. Making Data Visualizations Accessible · · ,
  61. RLI (Recently Logged-In) Browser Cache Bypassing · · , ,
  62. The Road to HTMHell Is Paved With Semantics · · , ,
  63. New JS Array Methods · · ,
  64. The Goldilocks Principle for Prototyping · · , , ,
  65. Good Design Is Subjective, Contextual, and Intentional · · ,
  66. Building Components for Consumption, Not Complexity II · · , ,
  67. Think About Your Future Self · ·
  68. Thank You to Those Who Helped Me to Be the CSS Developer I Am Today · · ,
  69. How to Center an Element in CSS Without Adding a Wrapper in HTML · · , , ,
  70. React Props Explained With Examples · · , ,
  71. A Checklist for CLS Scenarios · · , ,
  72. Revisiting Fundamentals—Semantic Lists for Improved Accessibility · · , , ,
  73. CSS “animation-composition” · · ,
  74. Baseline Does Not Really Cover Baseline Support · · , , , ,
  75. HTML Can Do This? · ·
  76. Sharing a State Between Windows Without a Server · · , , ,
  77. Swallowing Camels · ·
  78. Naming Design Tokens: The Art of Clarity and Consistency · · , ,
  79. Web Components · · , , ,
  80. Stop Normalizing Unprofessional Behaviour in the Name of Agility · · , , ,
  81. The Ghosts of Markup Past · · , ,
  82. Crafting Effective Documentation · ·
  83. Who Stole My Largest Contentful Paint? · · , ,
  84. Introducing JavaScript Support in MySQL · · , , ,
  85. CSS “@ scope” · · ,
  86. How We Reduced CSS Size and Improved Performance Across GOV.UK · · , , ,
  87. Christmas Tree Animations Made With CSS and JS · · , , , ,
  88. The WordPress Showcase and Accessibility · · ,
  89. Managing Node.js Processes · · ,
  90. Announcing SvelteKit 2 · · ,
  91. V8 Is Faster and Safer Than Ever · · , , ,
  92. Getting Started With Web Performance · · , , ,
  93. The Unspoken Struggle of Aging in a Tech-Driven World · · , ,
  94. Anchor Positioning · ·
  95. Addressing Unconscious Bias in Developer Relations: Strategies for Creating Fair and Inclusive Experiences · · , , ,
  96. Design Systems Teams: Understand Your Users So They Can Serve Theirs · · , , ,
  97. The Financial Argument for Using an Outside Firm for Accessibility Remediation · · ,
  98. Ten Optimisation Tips for an Initial Web Performance Audit · · , , ,
  99. HTML: The Bad Parts · ·
  100. 6 Techniques for Conditional Rendering in React, With Examples · · ,
  101. What Really Is Technical Debt? · · , ,
  102. How to Get Good at Competitive Programming · · ,
  103. CSS Scroll Snapping Aligned With Global Page Layout: A Full-Width Slider Case Study · · , , ,
  104. My Accessibility Journey · · ,
  105. Popover API · · , ,
  106. What Vue’s Creator Learned the Hard Way With Vue 3 · · ,
  107. Baseline 2023 · · , , ,
  108. Test-Driven HTML and Accessibility · · , , ,
  109. Engineering Progression for Humans · · ,
  110. Extending Responsive Video With HTML Web Components · · , , ,
  111. Three Modern CSS Properties Your Website Must Have · ·
  112. Can UX Design Actually Be Ethical? · · , ,
  113. Using Nodemon and Watch in Node.js for Live Restarts · · ,
  114. Using Date-Based CSS to Make Old Web Pages Look Old · · ,
  115. Accessibility Overlays · · , ,
  116. The “hidden” Attribute in HTML · ·
  117. Why Designers Quit (2023 Report) · · ,
  118. Chrome Enables Desktop Mode by Default on Premium Tablets · · , , ,
  119. Developer Relations Is an All-Company Effort · · , ,
  120. Behavior Belongs in the HTML · · , ,
  121. Building Components for Consumption, Not Complexity · · , ,
  122. Improve App Performance With Angular 17 “defer” · · , , ,
  123. Video Subtitles, Captions, Audio Descriptions, and Transcripts · · , ,
  124. The “await” Event Horizon in JavaScript · · ,
  125. Node.js, TypeScript, and ESM: It Doesn’t Have to Be Painful · · , ,
  126. Quantity Queries Are Very Easy With CSS “:has()” · · ,
  127. WebKit Features in Safari 17.2 · · , , , ,
  128. ARIA, the Good Parts · · , ,
  129. Screen Reader User Survey #10 · · , , , ,
  130. Decoding Compound Tokens · · ,
  131. How to Enable Experimental CSS and JS Features in Chrome, Firefox, and Safari · · , , , , , , , , ,
  132. Template for Accessibility Guidelines · · , ,
  133. A List of JavaScript Engines, Runtimes, Interpreters · · , , ,
  134. Task Automation and Debugging With AI-Powered Tools · · , , ,
  135. How I Brought LCP Down to Under 350 ms for Google-Referred Users on My Website · · , , ,
  136. Signals of Interface Quality · · ,
  137. Potential Problems With Accessibility Audits and What to Do About Them · · , ,
  138. Media Queries in HTML Video · · , , , ,
  139. What the Slot? · · , , ,
  140. Audit Your Site for Third-Party Cookies · · , , ,
  141. All Technical Debt Is a Risk to the Product and to Your Business · · , , ,
  142. Oh No! My JSON! · ·
  143. Scroll Fading 101 · · , ,
  144. Preparing for Interaction to Next Paint, a New Web Core Vital · · , ,
  145. CSS Wrapped: 2023! · · , , , ,
  146. Security Headers Using “<meta>” · · , ,
  147. CSS Snapshot 2023 · ·
  148. A Beginner’s Guide to Accessible Text · · , , , ,
  149. Is PHP Still a Viable Choice in 2023? · · ,
  150. Insights: Mobile Accessibility · · , , ,
  151. Accessibility-Specific Tech Requirements? It Depends! · · ,
  152. The Most Accessible Font · · , , ,
  153. The Shrinkwrap Problem: Possible Future Solutions · ·
  154. React Performance Optimization · · , ,
  155. Release Notes for Safari Technology Preview 184 · · , , ,
  156. The Last 5 Years of V8’s Garbage Collector · · , , ,
  157. Stop Nesting Ternaries in JavaScript · · ,
  158. HTML5 Boilerplate v9.0.0 Released · · , ,
  159. Understanding the New WCAG 2.2 Criteria · · ,
  160. TypeScript’s Hidden Feature: Subtypes · ·
  161. Custom Events in Web Components · · , ,
  162. Fine, I’ll Use a Super Basic CSS Processing Setup · · , ,
  163. The Complete Puppeteer Cheatsheet · · , ,
  164. Overview of Drupal · · ,
  165. Dark Design Patterns Catalog · · , ,
  166. “sizes="auto"” Pretty Much Requires “width” and “height” Attributes · · , ,
  167. Astro 4.0 · · ,
  168. Maglev—V8’s Fastest Optimizing JIT · · , , , ,
  169. A Definition Update for Baseline · · , , ,
  170. Baseline’s Evolution on MDN · · , , , ,
  171. The Hellish History of HTML: An Incomplete and Personal Account · · ,
  172. Web Chat Accessibility Considerations · · , , ,
  173. Scale Your React App With Storybook and Chromatic · · , ,
  174. My 3 Rules for Documenting Code · · , ,
  175. Blind CSS Exfiltration: Exfiltrate Unknown Web Pages · · ,
  176. Better Vue.js Inputs With Generics: The Select · · ,
  177. 4 Dead Simple Ways of Customizing Bootstrap · · , ,
  178. Testing the Performance of Social Media Embeds · · , , ,
  179. 12 Important User-Interface Design Guidelines · · , ,
  180. 100 Bucket List Ideas for Programmers · · ,
  181. An Informed Pre-Caching Strategy for Large Sites · · , ,
  182. Of Time and the Web · · , , ,
  183. The State of UX in 2024: Enter Late-Stage UX · ·
  184. Pen, Paper, IDE: A DevTool Founder’s Early-Stage Product Design Guide · · , , ,
  185. The Importance of User Feedback and Data in UX Design · · ,
  186. How Marketing Changed OOP in JavaScript · · , ,
  187. Why Carousels Don’t Work · · , ,
  188. CSS Media Query for Scripting Support · · , , ,
  189. Color Psychology in Visual Design: A Practical Guide to Impacting User Behavior · · , , ,
  190. Back to Basics: 5 HTML Attributes for Improved Accessibility and User Experience · · , , ,
  191. The Pros and Cons of Using React Today · · ,
  192. Is the Flat Design Trend Finally Over? · · ,
  193. The “form” Attribute—Enhancing Form Layout Flexibility · · ,
  194. Let’s Learn How Modern JavaScript Frameworks Work by Building One · · , , , ,
  195. You Don’t Need JavaScript for That · ·
  196. A More Holistic Design Workflow: Gluing Jira, Figma, and Zeplin Together · · , ,
  197. Fastest Way of Passing State to JavaScript, Re-Visited · · , ,
  198. Recovering Deleted Files from Your Git Working Tree · · ,
  199. Deceptive Patterns in UX: How to Recognize and Avoid Them · · ,
  200. The UX of HTML · · , ,
  201. Web Development Advent Calendars for 2023 · · ,
  202. Create Dynamic Web Experiences With Interactive SVG Animations · · , ,
  203. Does Web Design Matter? · · ,
  204. I Replaced npm, Yarn, and nvm With pnpm · · , , , ,
  205. CSS Relative Colors · · ,
  206. Search vs. Browse · · , , ,
  207. How to Use a Color Font · · , ,
  208. Debugging BFCache, Make Your Page Load Instantly · · , , , , , , ,
  209. How to Use Chrome’s Accessibility Tree · · , , , ,
  210. Node v21.3.0 · · ,
  211. Firefox on the Brink? · · , ,
  212. Preparing for a Live Demo · ·
  213. Creating a Marquee Effect With CSS Animations · · , ,
  214. Not All Screen Reader Users Are Blind · · , , , ,
  215. New to the Web Platform in November · · , , , , , ,
  216. Is 2024 the Year of CSS Nesting? · · ,
  217. Hide and Debug Empty Elements With CSS · ·
  218. Fetch API, Do You Really Know How to Handle Errors? · · , ,
  219. Measure LCP Sub-Parts to Improve Largest Contentful Paint · · , ,
  220. Testing in Production With Canary Deployments: A How-To Guide · · , ,
  221. Design That Scales · · , , , ,
  222. Oh No, Overflow! · · ,
  223. Care Beyond Code: 7 Best Design Practices for Frontend Developers · · ,
  224. The Difference Between Nesting an “@ layer” in “@ media” and “@ container” Query · · , , , ,
  225. How to Use the File System in Node.js · · , , ,
  226. Checking the Type of a String in PHP · ·
  227. Accessibility: A Practical Perspective · ·
  228. Kicking the Excessive JavaScript Habit · · , , ,
  229. Resource Loading at the Cutting Edge · · ,
  230. The “hanging-punctuation” Property in CSS · · ,
  231. Web Components Eliminate JavaScript Framework Lock-In · · , , ,
  232. 10 JavaScript Changes You Missed in 2023 · · , ,
  233. Keyboard Accessibility Myths and WCAG · · , ,
  234. “An Accessible Website Won’t Be Beautiful”… Really?! · · ,
  235. Burnout in the Digital Accessibility Field · · ,
  236. A Complete Guide to pnpm · · , ,
  237. Are Design Ethics Useless? · · ,
  238. “oklch()” Retains Perceived Lightness for Different Hue Angles · · , , ,
  239. OOP Design Patterns in JavaScript · · ,
  240. Progressive Enhancement vs. Graceful Degradation: Approaches to Web Development · · , ,
  241. Preventing Scroll “Bounce” With CSS · · ,
  242. A Few Ways CSS Is Easier to Write in 2023 · · , ,
  243. Accessibility Is Leadership · · ,
  244. Design Systems Metrics—What I Have Learned Leading the [Design System] of the Biggest Edtech in Latin America · · , ,
  245. Weird HTML Hacks · · , , ,
  246. State of JavaScript 2023 · · ,
  247. How to Test 3.3.7 Redundant Entry · · , , ,
  248. Browsers Only Update “:target” on Page Load and During Fragment Navigation · · ,
  249. Choosing a Green Web Host · · ,
  250. Test Often to Keep Your Designs Simple · · , , ,