Frontend Dogma

News and Views in Frontend Development (9)

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. Angular Is Costing Companies Billions (tweet this) · ·
  2. How to Migrate from jQuery to Next.js (tweet this) · · , ,
  3. Detecting Media Query Support in CSS and JavaScript (tweet this) · · , , ,
  4. What People Should Know Before Writing Articles or Creating Products About Accessibility (tweet this) · · ,
  5. TypeScript Interfaces: A Quick Guide to Help You Get Started (tweet this) · · ,
  6. Refactoring CSS: Introduction (tweet this) · · , ,
  7. Gridless Design (tweet this) · · , ,
  8. Image Descriptions: A Human Technique That Robots Can’t Grasp (tweet this) · · ,
  9. How to Convert Arrays to Human-Readable Lists in JavaScript (tweet this) · · , ,
  10. Freelance React Developer Checklist (tweet this) · · ,
  11. The Document Outline (tweet this) · · ,
  12. Making a Strong Case for Accessibility (tweet this) · ·
  13. The Numeric Colour Palettes in Modern Web Frameworks Explained (tweet this) · · ,
  14. The Large, Small, and Dynamic Viewports (tweet this) · · , ,
  15. Performance Design: The Illusion of Speed (tweet this) · · ,
  16. Creating Accessible CSS Art (tweet this) · · , ,
  17. TypeScript and Native ESM on Node.js (tweet this) · · , ,
  18. Five Ways to Include D/Deaf Users in Your Designs (tweet this) · · ,
  19. ARIA in HTML (tweet this) · · , ,
  20. The Dilemma of Naming Font Size Variables (tweet this) · · , ,
  21. How to Use “Promise.all()” (tweet this) · ·
  22. How Does Node.js Load Its Built-In/Native Modules? (tweet this) · · , ,
  23. Accessibility and Inclusivity: Distinctions in Experience Design (tweet this) · · , ,
  24. Using HSL Colors in CSS (tweet this) · · ,
  25. Feature Checklists Are Not Enough: How to Avoid Making Bad Software (tweet this) · · , , ,
  26. Basics of JavaScript Test Driven Development (TDD) with Jest (tweet this) · · , ,
  27. Where Did This Interaction Come From?—A Brief History of Interaction Design (tweet this) · · ,
  28. “export default thing” Is Different to “export { thing as default }” (tweet this) · ·
  29. Short Note on Skip Links with Sticky Headers (tweet this) · · ,
  30. Evaluating Color and Contrast—How Hard Can It Be? (tweet this) · · , ,
  31. Towards Richer Colors on the Web (tweet this) · · ,
  32. It’s a (Front-End Testing) Trap! Six Common Testing Pitfalls and How to Solve Them (tweet this) · · ,
  33. Accessibility and SEO (tweet this) · · , ,
  34. When a Click Is Not Just a Click (tweet this) · ·
  35. The State of Web Workers in 2021 (tweet this) · · ,
  36. The Internet Is Rotting (tweet this) · · ,
  37. How We Built React Components for Any Front End (tweet this) · · ,
  38. Encoding Data for POST Requests (tweet this) · · ,
  39. Detecting Hover-Capable Devices (tweet this) · ·
  40. 9 Tips to Help You Ace a Whiteboard Interview (tweet this) · · ,
  41. 10 Figma Best Practices to 10× Your Workflow (tweet this) · · , , ,
  42. Use the “i” Element, and Use It Appropriately (tweet this) · · ,
  43. Tip: Don’t Preprocess What You Can Design Token (tweet this) · · ,
  44. The Most Popular Design Thinking Strategy Is BS (tweet this) · · ,
  45. Screen Readers: Hearing the Unseen (tweet this) · · , ,
  46. Resource Inlining in JavaScript Frameworks (tweet this) · · , , ,
  47. Good News: Google No Longer Requires Publishers to Use the AMP Format (tweet this) · · , ,
  48. CSS Frameworks in Vogue, But Don’t Forget Style Fundamentals (tweet this) · · , ,
  49. My Journey from a Novice to a Front-End Engineer (tweet this) · ·
  50. I Regret Being a Hipster in Tech (tweet this) · ·
  51. timefind (tweet this) · · , ,
  52. All You Need Is 5 Fonts (tweet this) · · , ,
  53. Using CSS to Enforce Accessibility (tweet this) · · ,
  54. JavaScript Frameworks and the Lost Art of HTML (tweet this) · · , ,
  55. Debugging JavaScript and Front-End (tweet this) · · , ,
  56. Container Queries and the Future of CSS (tweet this) · · , ,
  57. Building a Responsive Layout with CSS Grid and Container Queries (tweet this) · · , , , ,
  58. The True Cost of a Redesign (tweet this) · · ,
  59. React Architecture: How to Structure and Organize a React Application (tweet this) · · ,
  60. No Code Reviews by Default (tweet this) · ·
  61. Making the Web—Faster (tweet this) · · , , ,
  62. Accessibility in React (tweet this) · · ,
  63. What’s New in ES2021 (tweet this) · · , ,
  64. Sorting Colors in JavaScript (tweet this) · · , ,
  65. RenderingNG—Ready for the Next Generation of Web Content (tweet this) · · , ,
  66. Demystifying Styled Components (tweet this) · · , ,
  67. Custom Scrollbars in CSS (tweet this) · ·
  68. Craft Good Questions for Usability Tests (tweet this) · · ,
  69. A Framework for Building Open Graph Images (tweet this) · · ,
  70. Blogged Answers: The Evolution of Redux Testing Approaches (tweet this) · · , , ,
  71. Organize Your CSS Declarations Alphabetically (tweet this) · · ,
  72. Keeping It Consistent: Design Tokens (tweet this) · · , ,
  73. How to Use Dynamic Imports in JavaScript (tweet this) · ·
  74. Updating a 25-Year-Old Website (tweet this) · ·
  75. Optical Size, the Hidden Superpower of Variable Fonts (tweet this) · · , ,
  76. OMG, SVG Favicons FTW! (tweet this) · · , , ,
  77. How Apple Changed the Way We Navigate—Forever (tweet this) · · ,
  78. Shut Up, Old Man… (tweet this) · ·
  79. NPM Global Audit (tweet this) · · , , , ,
  80. A Complete Guide to Accessibility Tooling (tweet this) · · , ,
  81. Understanding and Preventing Common Security Vulnerabilities (tweet this) · ·
  82. Everyday Accessibility (tweet this) · ·
  83. Regular Expressions (RegEx) in Google Search Console (tweet this) · · , ,
  84. Provided “As Is,” Without Warranty of Any Kind (tweet this) · · , ,
  85. When CSS Isn’t Enough: JavaScript Requirements for Accessible Components (tweet this) · · , ,
  86. The Art of Frontend Engineering (tweet this) · ·
  87. Serving Sharp Images to High Density Screens (tweet this) · · ,
  88. React Cheat Sheet (Updated June 2021) (tweet this) · · ,
  89. Half the Size of Images by Optimising for High Density Displays (tweet this) · · , ,
  90. How to Center Anything in CSS Using Flexbox and Grid (tweet this) · · ,
  91. Adding Shadows to SVG Icons with CSS and SVG Filters (tweet this) · · , ,
  92. The Ultimate CSS Flexbox Cheat Sheet with Examples (tweet this) · · , ,
  93. Let’s Learn About Aspect Ratio in CSS (tweet this) · ·
  94. Why Validate? (tweet this) · · , , ,
  95. Ready-Made Counter Styles (tweet this) · · ,
  96. Micro-Expressions in User Testing: When Users Reveal Their True Emotional States (tweet this) · · ,
  97. Meet :has, a Native CSS Parent Selector (And More) (tweet this) · ·
  98. Building a Color Scheme (tweet this) · · , ,
  99. An Interactive Guide to CSS Transitions (tweet this) · · , ,
  100. Reasons Why Bugs Might Feel “Impossible” (tweet this) · · ,
  101. Improving the UX of Your Design System (tweet this) · · ,
  102. Component-Specific Design Tokens (tweet this) · · ,
  103. Vue.js vs. React—Not Your Usual Comparison (tweet this) · · , , ,
  104. Using AVIF to Compress Images on Your Site (tweet this) · · , , ,
  105. What Can the HTTP Archive Tell Us About Largest Contentful Paint? (tweet this) · ·
  106. An Accessibility Strategy (tweet this) · · ,
  107. Accessible Overflow (tweet this) · · , ,
  108. 10 Utility Functions for Working with Objects in JavaScript (tweet this) · ·
  109. Open Source Insights (tweet this) · · , , , ,
  110. CSS System Colors (tweet this) · · ,
  111. How To Fix Cumulative Layout Shift (CLS) Issues (tweet this) · ·
  112. CSS for Web Vitals (tweet this) · · , ,
  113. The Hidden World of “aria-hidden” (tweet this) · · ,
  114. Embracing Design Constraints (tweet this) · ·
  115. Thoughts for the Aging Web Developer (tweet this) · ·
  116. Why Accessibility Overlays Hurt More Than Help (tweet this) · ·
  117. Disabling a Link (tweet this) · · ,
  118. What Makes a Great Component Library? (tweet this) · · ,
  119. How to Build an Image Comparison Slider (tweet this) · · ,
  120. Writing Better Regular Expressions in PHP (tweet this) · · , ,
  121. A Thorough Analysis of CSS-in-JS (tweet this) · ·
  122. Accessible Web Forms (tweet this) · · , ,
  123. Your Design System Is Actually a Product—Treat It Like One (tweet this) · ·
  124. 25 Years of CSS (tweet this) · · ,
  125. CSS Container Queries: Use Cases and Migration Strategies (tweet this) · · ,
  126. Access Guide (tweet this) · · , ,
  127. Svelte for the Experienced React Dev (tweet this) · · ,
  128. Useful and Useless Code Comments (tweet this) · ·
  129. The New Responsive: Web Design in a Component-Driven World (tweet this) · · , ,
  130. How to Name Your Design System (tweet this) · · ,
  131. Don’t Overabstract Your Components (tweet this) · · , ,
  132. We Need to Talk About WCAG (tweet this) · · ,
  133. Theoretical Foundations for Server-Side Rendering and Static-Rendering (tweet this) · · ,
  134. The Button Cheat Sheet (tweet this) · · ,
  135. Container Queries in Web Components (tweet this) · · ,
  136. Making Disabled Buttons More Inclusive (tweet this) · · ,
  137. Building a React Design System for Adoption and Scale (tweet this) · · ,
  138. A Complete Guide to Grid (tweet this) · · , ,
  139. Web Application Development: The Ultimate Guide (2021) (tweet this) · · , ,
  140. Rethinking Component Libraries (tweet this) · ·
  141. Everything You Need to Know About A/B Testing (tweet this) · · ,
  142. Introduction to HTTP Cookies (tweet this) · · ,
  143. Custom Attributes Are Fast Good and Cheap (tweet this) · · ,
  144. Overreliance on Overlays Is Counter to Enculturation of Accessibility (tweet this) · · ,
  145. Auditing Design Systems for Accessibility (tweet this) · · , , ,
  146. Understanding Design Systems—Designing Component APIs (tweet this) · · , ,
  147. Better Onboarding: How to Prevent Codebase Overwhelm (tweet this) · ·
  148. Sometimes, a Billion Laughs Aren’t So Funny—Improving CSS Variables in WebKit (tweet this) · · ,
  149. A Guide to Newly Supported, Modern CSS Pseudo-Class Selectors (tweet this) · · , , ,
  150. 136 Facts Every Web Dev Should Know Before They Burn Out and Turn to Landscape Painting or Nude Modelling (tweet this) · ·
  151. Intrinsic Typography is the Future of Styling Text on the Web (tweet this) · · ,
  152. Five Reasons Your First Design System Will Fail (tweet this) · ·
  153. CSS Hell (tweet this) · · ,
  154. Content-Aware Image Resizing in JavaScript (tweet this) · · ,
  155. The 5 Most Popular Front-End Frameworks Compared (tweet this) · · , , , , , ,
  156. Fifteen Design Trends from an Accessibility Perspective (tweet this) · · , ,
  157. Web Developer’s Guide to AVIF Images (tweet this) · · , ,
  158. Variable Scope, Lexical Scope, and Code Blocks in JavaScript (tweet this) · ·
  159. Top 7 Facts About Web Content Accessibility Guidelines WCAG 2.2 You Must Know (tweet this) · · ,
  160. Understanding Logical Focus Order (tweet this) · · ,
  161. Comparing the New Generation of Build Tools (tweet this) · · , ,
  162. Write a Plugin for Tailwind CSS (tweet this) · ·
  163. Using Design Tokens to Accelerate Design Systems (tweet this) · · , ,
  164. Code in Quarantine (tweet this) · · ,
  165. How to Build a Developer Blog with Gatsby and MDX (tweet this) · · ,
  166. 5 Things I’m Thinking About When I Check a Pull Request for Accessibility (tweet this) · · ,
  167. Primitive Values, Objects, and References in JavaScript Made Simple (tweet this) · ·
  168. Why Should We Care About Developer Experience (DX) (tweet this) · ·
  169. Not Your Typical Horizontal Rules (tweet this) · ·
  170. Human-Readable JavaScript: A Tale of Two Experts (tweet this) · · ,
  171. Why Skip-Links Are Important for Accessibility (tweet this) · · ,
  172. How to Build a Great Developer Experience (tweet this) · ·
  173. React vs. Vue in 2021: Best JavaScript Framework (tweet this) · · , , ,
  174. “prefers-reduced-motion”: Taking a No-Motion-First Approach to Animations (tweet this) · · , ,
  175. The 5-Hour CDN (tweet this) · · ,
  176. Comparing Svelte and React (tweet this) · · , ,
  177. A Comprehensive Guide to JavaScript Design Patterns (tweet this) · · , ,
  178. You Want Enabling CSS Selectors, Not Disabling Ones (tweet this) · · ,
  179. JavaScript: What Is the Meaning of “this”? (tweet this) · ·
  180. Beyond “console.log()”—Level Up Your Debugging Skills (tweet this) · · ,
  181. Enforce, Enable, and Empower (tweet this) · ·
  182. Automating the Accessibility Tests of Your Source Code with GitHub Actions (tweet this) · · , ,
  183. Hello World (tweet this) · ·
  184. Managing CSS Colors Systems with a Single Source of Truth (tweet this) · · , ,
  185. Understanding Z-Index in CSS (tweet this) · ·
  186. Seven Myths About Alt Text (tweet this) · ·
  187. 5 Tips for Your Next Promotion or Salary Raise (tweet this) · ·
  188. One Figma Component—3,360 Variants (tweet this) · · ,
  189. Uniwidth Typefaces for Interface Design (tweet this) · · ,
  190. Building a Consistent Platform (tweet this) · ·
  191. In Critical Defense of Frontend Development (tweet this) · · ,
  192. The Definitive Guide to Feature Management (tweet this) · · , ,
  193. HTML: The 16 Content Categories and Their Elements (tweet this) · · ,
  194. How Does CSS Work? (tweet this) · ·
  195. HTML and CSS Techniques to Reduce Your JavaScript (tweet this) · · , , ,
  196. Ethical Design Guide (tweet this) · · , ,
  197. Using “throw” as an Expression in PHP 8 (tweet this) · ·
  198. Symbols to Copy (tweet this) · · , ,
  199. Ignore AMP (tweet this) · ·
  200. Why You Should Self-Host Google Fonts in 2021 (tweet this) · · ,