Frontend Dogma

News and Views in Frontend Development

Articles and books, tips and tricks, craft and beauty from the world of frontend development. Explore all topics. Stay informed per feed and on Twitter.

  1. Reduce Array of Objects to an Object in JavaScript (tweet) · · ,
  2. 9 Ways to Design Inclusive Content (tweet) · · ,
  3. Master the “:nth-child()” Pseudo-Class (tweet) · · , ,
  4. Don’t Fight the Browser Preload Scanner (tweet) · · , , ,
  5. How to Use Google CrUX to Analyze and Compare the Performance of JS Frameworks (tweet) · · , , ,
  6. Bringing Page Transitions to the Web (tweet) · · , ,
  7. Why WCAG 2.2 Is Still in the Oven (tweet) · · ,
  8. State of CSS 2022 (tweet) · ·
  9. How to Learn JavaScript Fast: Six Simple Mind Tricks (tweet) · · , ,
  10. Bridging the Gap (tweet) · · ,
  11. The Complete Modern React Developer 2022 (tweet) · · ,
  12. Magical SVG Techniques (tweet) · · , ,
  13. Cron Jobs: A Comprehensive Guide (tweet) · · , ,
  14. 2 Approaches to Accessibility on the Web (tweet) · · , ,
  15. Why SEO Is a Great Investment, Not Just a Cost (tweet) · · ,
  16. Understanding User Behaviors Across Surfaces (tweet) · · ,
  17. The Road to Universal JavaScript (tweet) · · ,
  18. “Someone Should Build X for the Web”—Why Not You? (tweet) · ·
  19. Reinventing W3C Governance (tweet) · · ,
  20. Performance Game Changer: Browser Back/Forward Cache (tweet) · · , , ,
  21. Frontend Versus Backend Web Development (tweet) · · , ,
  22. A Management Maturity Model for Performance (tweet) · · ,
  23. My Opinion on What Makes a Good Code Review (tweet) · · , ,
  24. Top 2021 CSS Frameworks Report: Validation (tweet) · · , , , ,
  25. Learn CSS Subgrid (tweet) · · ,
  26. How to Use the GitHub Pulls API to Manage Pull Requests (tweet) · · ,
  27. Resilience, Flexibility, and Immediacy: Working with Headless Systems (tweet) · · , ,
  28. Please, Stop Disabling Zoom (tweet) · · ,
  29. How to Use Videos with Alpha Transparency on the Web (tweet) · · ,
  30. Get to Know Your Browser’s Performance Profiler (tweet) · · , ,
  31. Fetch API Is [the] New Old Version of AJAX (tweet) · · , ,
  32. A Guide to Writing About Digital Accessibility (tweet) · · , ,
  33. 12 Modern CSS Techniques for Older CSS Problems (tweet) · · , ,
  34. Designing a Better Language Selector (tweet) · · , , ,
  35. Design Patterns: How to Create Simple Interfaces (tweet) · · ,
  36. You Don’t Need a UI Framework (tweet) · · , , ,
  37. Why I Don’t Miss React: A Story About Using the Platform (tweet) · · ,
  38. Microsoft Edge Overtakes Safari as World’s Second Most Popular Desktop Browser (tweet) · · , ,
  39. Lerna Has Gone—Which Monorepo Is Right for a Node.js Backend Now? (tweet) · · , , ,
  40. In Defence of the Single Page Application (tweet) · · ,
  41. How to Create a Color Palette for Your Design System (tweet) · · ,
  42. Contextual Spacing for Intrinsic Web Design (tweet) · · , ,
  43. Writing Better CSS (tweet) · · , , ,
  44. If Design Principles Are for Designs, Then Design Values Are for Designers (tweet) · · , ,
  45. Ethical Design Network (tweet) · · , ,
  46. Creating Realistic Reflections with CSS (tweet) · · ,
  47. 8 JavaScript Quiz [Questions] That May Confuse You (tweet) · · ,
  48. Under-Engineered Multi-Selects (tweet) · · , ,
  49. How to Reduce Figma Memory Usage (tweet) · ·
  50. Creating a Firework Effect with CSS (tweet) · · ,
  51. How Web Browsers Work: Parsing the CSS (tweet) · · , ,
  52. Foundations: Lists (tweet) · · ,
  53. The CSS Art Paradox (tweet) · · , , ,
  54. The Complete Guide to Regular Expressions (Regex) (tweet) · · ,
  55. Server-Side vs. Client-Side Analytics (tweet) · · ,
  56. My Browser Support Strategy (tweet) · · , , ,
  57. Introducing “inert” (tweet) · · ,
  58. How to Build Node.js REST API with MySQL (tweet) · · , , ,
  59. CTA Modal: How to Build a Web Component (tweet) · · , ,
  60. Common Frontend Interview Questions I’ve Been Asked (tweet) · · , , ,
  61. Best Practices for Integrating Content Design in Your Design System (tweet) · · , , ,
  62. The 5 Golden Rules of Code Reviews (tweet) · · , ,
  63. Stop Removing Focus (tweet) · · ,
  64. Learn to Code with JavaScript: The Most Popular Programming Language on Earth (tweet) · · ,
  65. Cool Hover Effects That Use Background Properties (tweet) · · ,
  66. A Practical Guide to Aspect Ratio in CSS (tweet) · · , ,
  67. Plain Old Semantic HTML: A Perfect Basis for Accessibility (tweet) · · , ,
  68. Non-Interactive Elements with the “inert” Attribute (tweet) · · ,
  69. Is Measuring Speed a Useful Metric for Design Systems? (tweet) · · , , ,
  70. Flexibly Centering an Element with Side-Aligned Content (tweet) · · ,
  71. Deploy Your First Website Without Leaving Your IDE (tweet) · ·
  72. A Guide to Task-Based UX Metrics (tweet) · · , ,
  73. Supercharge Your Design System with Design Tokens (tweet) · · ,
  74. Mobile App Versus Web Site: Which Is Better for Your Business? (tweet) · · ,
  75. How Web Browsers Work: Parsing the HTML (tweet) · · , ,
  76. Four Eras of JavaScript Frameworks (tweet) · · , ,
  77. Deep Dive into Top Web Developer Pain Points (tweet) · · ,
  78. Build a Lightweight Web Component with Lit.js (tweet) · · ,
  79. 9 Useful Principles of UX Design (tweet) · · , ,
  80. 8 Ways to Make Website Accessibility Easier (and Less Expensive) (tweet) · ·
  81. 16 Top Design Trends for 2022 (tweet) · · ,
  82. 11 Steps to Keep Figma Clean (tweet) · · , ,
  83. Best Font for Online Reading: No Single Answer (tweet) · · , , ,
  84. Atomic Design 2022: What We Can Learn from Eames and Other Design Giants (tweet) · ·
  85. Writing Strong Front-End Test Element Locators (tweet) · ·
  86. Why Your CSS Is Always Messy and Chaotic—Understanding CSS Complexity (tweet) · · ,
  87. Progressive Enhancement and HTML Forms: Use “FormData” (tweet) · · , ,
  88. How Web Browsers Work: Navigation (tweet) · · ,
  89. Web Color Is Still Broken (tweet) · · , ,
  90. TypeScript Tips and Tricks (tweet) · · , , ,
  91. Mastering CSS Transitions with React 18 (tweet) · · , ,
  92. Building a Combined CSS Aspect Ratio Grid (tweet) · ·
  93. Why Learn to Code? 17 Benefits of Learning to Code (tweet) · · , ,
  94. The Future of CSS: CSS Toggles (tweet) · ·
  95. Productivity Tips and Tools for a More Efficient Workflow (tweet) · · , , ,
  96. Faster Initialization of Instances with New Class Features (tweet) · · , ,
  97. Debugging Node Serverless Functions on AWS Lambda (tweet) · · , , ,
  98. Brief Note on Buttons, Enter, and Space (tweet) · ·
  99. Beyond WCAG: Losing Spoons Online (tweet) · · , ,
  100. 11 Breadcrumb SEO Best Practices for a Mobile-First Strategy (tweet) · · , , ,
  101. The Role of Policy in Creating a Culture of Accessibility (tweet) · · , ,
  102. The Front-End Developer’s Guide to the Terminal (tweet) · · ,
  103. Routing: I’m Not Smart Enough for an SPA (tweet) · · , ,
  104. Ordering CSS Declarations (tweet) · · ,
  105. How to Start Testing Your Website with a Screen Reader (tweet) · · , ,
  106. Forced Colors Explained: A Practical Guide (tweet) · · ,
  107. When UX Goes Bad (and How to Fix It) (tweet) · · ,
  108. Web Scraping Is Legal, U.S. Appeals Court Reaffirms (tweet) · · ,
  109. The Ultimate Guide to Push Notifications for Developers (tweet) · · ,
  110. React 18—New Features and Improvement Strategies (tweet) · ·
  111. Ensure Third Party Content Is Accessible (tweet) · · , ,
  112. Does Valid and Semantic HTML Still Matter? (tweet) · · , , ,
  113. A Practical Guide to Centering in CSS (tweet) · · , ,
  114. 4 Reasons to Avoid Using “npm link” (tweet) · ·
  115. 20 Easy Ways to Be More Productive as a Developer (tweet) · ·
  116. Test-Driven Development with React and Redux: Thunk, Slices, and Requests Mocking (tweet) · · , , ,
  117. Node.js 18 Introduces Prefix-Only Core Modules (tweet) · ·
  118. The Most Popular Node.js Frameworks in 2022 (tweet) · · ,
  119. Is Agile an Anti-Design Pattern? (tweet) · · , ,
  120. Intro to CSS Parent Selector—“:has()” (tweet) · · , ,
  121. Implementing Micro-Frontends: A Path to Evolve Legacy Codebases (tweet) · · , ,
  122. Fonts for the Web: Rationale, 1996 (tweet) · · ,
  123. Evaluating Design System Adoption Using Custom CSS (tweet) · · , ,
  124. Accessibility Why You Need to Work Toward Progress Not Perfection (tweet) · · ,
  125. 7 Web Component Tricks (tweet) · · ,
  126. Title Rewrites: 3 Patterns to Avoid (tweet) · · , ,
  127. The Ultimate Guide to Optimizing JavaScript for Quick Page Loads (tweet) · · , , ,
  128. How to Write Good Code: 10 Beginner-Friendly Techniques for Instant Results (tweet) · · , ,
  129. Drastically Improve Your UI Designs with This Technique (tweet) · · ,
  130. Designers Are Spending Too Much Time Designing UI Variations Manually (tweet) · · , ,
  131. CSS Parent Selector (tweet) · · ,
  132. Building a Dialog Component (tweet) · · , , ,
  133. A Web Renaissance (tweet) · · ,
  134. Why Accessibility Bugs Are a Good Thing and How to Handle Them (tweet) · · , ,
  135. One Million Broken Web Sites—and a Way to Prevent That (tweet) · · , ,
  136. Naming Colors in Design Systems (tweet) · · , ,
  137. Does Your Website Have Any of These 10 Most-Cited Accessibility Issues? (tweet) · ·
  138. Common Accessibility Issues That You Can Fix Today (tweet) · ·
  139. Those HTML Elements You Never Use (tweet) · · ,
  140. Takeaways from The Internet is Unusable: The Disabled View (tweet) · ·
  141. Mobile-First Ecommerce Site Design Is the Future (tweet) · · , ,
  142. Image Borders in CSS (tweet) · · ,
  143. How to Improve UX Design Through A/B Testing (tweet) · · , ,
  144. How to Develop Your UX Design Philosophy (tweet) · · , ,
  145. CSS Toggles Explainer and Proposal (tweet) · ·
  146. Common App Design Challenges and Their Solutions (tweet) · · ,
  147. Childish Font Sizes (tweet) · · , ,
  148. 7 Collaborative Coding Tools for Remote Pair Programming (tweet) · · , ,
  149. JavaScript Function Composition: What’s the Big Deal? (tweet) · ·
  150. Information Architecture: Study Guide (tweet) · · ,
  151. How to Fix Your Low-Contrast Text (tweet) · · , ,
  152. CSS Tips and Tricks You May Need to Know (tweet) · · , ,
  153. CSS “:has()” a Parent Selector Now (tweet) · · ,
  154. There’s No Such Thing as a “Design System Designer” (tweet) · · , , ,
  155. Incremental Static Regeneration for Angular (tweet) · · ,
  156. April 9 is CSS Naked Day (tweet) · · ,
  157. 33 JavaScript Concepts Every Developer Should Know (tweet) · · ,
  158. Use Unicode Characters for Bullet Points in CSS Using “::marker” (tweet) · · ,
  159. Dynamic Data-Fetching in an Authenticated Next.js App (tweet) · · ,
  160. Your Website Is a Pollution Machine (tweet) · · ,
  161. Why Your Design System Needs Content Design (tweet) · · ,
  162. Principles of Object-Oriented Programming in TypeScript (tweet) · · , ,
  163. JavaScript and Node.js Testing Best Practices (tweet) · · , , ,
  164. How to Create Animated Anchor Links Using CSS (tweet) · · , ,
  165. Designing Better Breadcrumbs (tweet) · · , ,
  166. The Business Case for Accessibility (tweet) · · ,
  167. HTML Is All You Need to Make a Website (tweet) · ·
  168. Fonts in Use: Variable Fonts (tweet) · · ,
  169. Core Web Vitals: Finding Common Ground Between SEOs and Developers (tweet) · · , , ,
  170. Animated Grid Tracks with “:has()” (tweet) · · , ,
  171. Alternative Text (Alt Text) (tweet) · · ,
  172. A New Statistical Approach for Predicting Usability Problems (tweet) · · , ,
  173. 12 Years Beyond a HTML Joke (tweet) · · ,
  174. What If... One Day Everything Got Better? (tweet) · · ,
  175. Thoughts on Exerting Control with Media Queries (tweet) · · , ,
  176. Accessible Description Exposure (tweet) · · ,
  177. A Simple Way to Create a Slideshow Using Pure CSS (tweet) · · , ,
  178. Tweaking in the Browser (tweet) · · , , ,
  179. How to Respond to Growing Supply Chain Security Risks? (tweet) · · , , ,
  180. “aria-labelledby” Usage Notes (tweet) · · , ,
  181. Top 3 Informational Interview Questions in UX (tweet) · · , ,
  182. Accessible Cards (tweet) · · , ,
  183. Why We Don’t Use a Staging Environment (tweet) · · ,
  184. The WebAIM Million: The 2022 Report on the Accessibility of the Top 1,000,000 Home Pages (tweet) · · ,
  185. How to Match HTML Elements with an Indeterminate State (tweet) · · , ,
  186. Exciting Times for Browsers (and CSS) (tweet) · · ,
  187. Designing a Better Infinite Scroll (tweet) · · ,
  188. Accessibility Policy Implementation: What You Need to Know (tweet) · · , ,
  189. Neubrutalism Is Taking Over the Web (tweet) · · ,
  190. Make Beautifully Resilient Apps with Progressive Enhancement (tweet) · · , ,
  191. If We Can Make a Product Work for Anyone, It Usually Works Better for Everyone (tweet) · · , ,
  192. HTML-Only Keyboard Shortcuts (tweet) · · ,
  193. How to Optimize Your LCP (with Visuals) (tweet) · · , ,
  194. Understanding Layout Algorithms (tweet) · · ,
  195. Secret Mechanisms of CSS (tweet) · · ,
  196. Picture Perfect Images with the Modern “<img>” Element (tweet) · · , , ,
  197. Optimising Largest Contentful Paint (tweet) · · ,
  198. Locale Aware Sorting in JavaScript (tweet) · · , , ,
  199. How to Document Accessibility Issues (tweet) · · ,
  200. CSS “:has” (tweet) · · ,