Frontend Dogma

News and Tools for Frontend Development (19)

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

  1. An Introduction to AWS CloudFront Functions · · , , ,
  2. Session Timeouts · · ,
  3. 7 Ways to Achieve a Faster Core Web Vitals Score · · ,
  4. Alternatives to Pagination on Product-Listing Pages · · , , ,
  5. Why I Avoid “async”/“await” · ·
  6. The Basics—Generics in PHP · · ,
  7. Creating Native Web Components · · , ,
  8. Accessibility and Limited Fine Motor Skills · ·
  9. Remix vs. Next.js · · , ,
  10. The Best Design System Is No System · ·
  11. Interop 2022: Browsers Working Together to Improve the Web for Developers · · , ,
  12. It’s Always Been You, Canvas2D · · , ,
  13. The Importance of Screen Reader Software for Web Navigation · · , , , ,
  14. How to Design Better APIs · · , ,
  15. How to Prevent SQL Injection Attacks in Node.js · · , , , ,
  16. Building Web Layouts for Dual-Screen and Foldable Devices · · , ,
  17. Dive into Node.js Streams · · ,
  18. How Do Primitive Values Get Their Properties? · ·
  19. Progressive Enhancement, the New Hotness · ·
  20. How to Make a “Raise the Curtains” Effect in CSS · · , ,
  21. How to Use Higher-Order Functions in JavaScript · · , ,
  22. Taming CSS Variables With Web Inspector · · , , ,
  23. How Many Hyperlinks Are Too Many for Accessibility? · · ,
  24. Simple Color System for Complex Digital Interfaces · · , , ,
  25. What’s Really Going On Inside Your node_modules Folder? · · , ,
  26. New CSS Features in 2022 · ·
  27. 5 Things You Don’t Need JavaScript For · ·
  28. A Recipe for a Good Design System · ·
  29. Accessibility Checklist: Five Things Usually Left Out · · ,
  30. (Not So) Short Note on Being Owned · · , ,
  31. Web Component Pseudo-Classes and Pseudo-Elements Are Easier Than You Think · · , ,
  32. Foundations: Headings · · , , ,
  33. How to Build a File Upload Service With Vanilla JavaScript · · , ,
  34. CSS “content” Property · ·
  35. Importing ES6 Modules over HTTP/HTTPS in Node.js · · , , ,
  36. Higher-Order Components in React Hooks Era · · , ,
  37. Should Frontend Devs Care About Performance? · ·
  38. Solid.js Feels Like What I Always Wanted React to Be · · , ,
  39. Top 2021 CSS Frameworks Report: The CSS File Sizes · · , , ,
  40. 4 Simple Ways to Improve Web Accessibility · · ,
  41. Overlay Position and Recommendations · · ,
  42. When to Avoid the “text-decoration” Shorthand Property · ·
  43. Screaming Architecture—Evolution of a React Folder Structure · · ,
  44. How I Structure My React Projects · · ,
  45. Accessibility and Inclusivity in Practice · · , ,
  46. Understanding Dependencies Inside Your package.json · · , , ,
  47. Deploying a React Application to Netlify · · , , ,
  48. 5 Accessibility Quick Wins You Can Implement Today · ·
  49. Container Queries, the Next Step Towards a Truly Modular CSS · · , ,
  50. Moving from Next to Remix · · , , ,
  51. Can You Get Pwned With CSS? · · ,
  52. HTML Comments Work in JavaScript Too · · , ,
  53. How to Fix Your Security Vulnerabilities With npm Override · · , , ,
  54. How to Make MPAs That Are as Fast as SPAs · · , , ,
  55. A Complete Guide to CSV Files in Node.js · · , , ,
  56. Component Tokens and Themes Example (to Learn Figma Tokens) · · , , , ,
  57. Inclusive Design vs. Accessible Design: Understanding the Differences · · , , ,
  58. Reliably Send an HTTP Request as a User Leaves a Page · ·
  59. Support for Marking Radio Buttons Required, Invalid · · ,
  60. Turning the Tables on Accessibility · ·
  61. What Is Responsible JavaScript? · · ,
  62. The Case for Adding Validation State to Your Design Tokens · · ,
  63. Favi-Gone: 6 Reasons Why Your Favicon Disappeared from the Google Search Results · · , , ,
  64. SPAs Were a Mistake · · ,
  65. Comparing Gatsby and Next.js for Website Development · · , , ,
  66. Design Systems in Figma: How to Be More Productive · · , , ,
  67. How to Prioritize Your Components · · , ,
  68. 15 Useful Placeholder Tools for Designers and Developers · · , , , , ,
  69. A Complete Guide to CSS Cascade Layers · · , ,
  70. How Websites Die · · ,
  71. Let’s Get Inclusive: Designing Products for Everyone · · ,
  72. Writing Logic in CSS · ·
  73. Design System: How to Successfully Collaborate? · · , ,
  74. CSS Quick Tip: Animating in a Newly Added Element · · , ,
  75. Column Headers and Browser Support · · , ,
  76. Invisible Characters · · ,
  77. Minimizing Google Fonts by Only Loading It for Certain Characters · · , , , ,
  78. React State Management Libraries in 2022 · · , ,
  79. You Can “throw()” Anything in JavaScript—and Other “async”/“await” Considerations · ·
  80. There Is No Character Limit for “Alt Text” · · , ,
  81. Comparing Node JavaScript to JavaScript in the Browser · · , , ,
  82. Core Web Vitals: What Next? · · , ,
  83. Structuring Documentation in Multi-Brand Design Systems · · ,
  84. Using “mask” as “clip-path” · · , ,
  85. Flexbox Dynamic Line Separator · ·
  86. What Makes Writing More Readable? · · ,
  87. Web Developers and Cognitive Biases · · ,
  88. How to Create a Search Page for a Static Website With Vanilla JS · · , , , ,
  89. An Auto-Filling CSS Grid With Max Columns of a Minimum Size · · ,
  90. The State of JavaScript 2021 · · ,
  91. The Harsh Reality for JavaScript Developers: If You Don’t Study the Fundamentals You Will Be Just Another “Coder” · · , ,
  92. 7 Lessons I’ve Learned in the Last Year as a Software Engineer · · ,
  93. Track Down the JavaScript Code Responsible for Polluting the Global Scope · · ,
  94. What Is the Difference Between WCAG Compliance Level A, AA, and AAA? · · , ,
  95. 10 Mental Models Developers Can Use to Get Unstuck · ·
  96. Colors That Make Sense · · , ,
  97. Foundations: Colour and Meaning · · ,
  98. The Basics of package.json · · , , ,
  99. Version 100 in Chrome and Firefox · · , , , , ,
  100. WCAG 2.2 Update · · ,
  101. 7 Killer One-Liners in JavaScript · ·
  102. Functions and the Future of Design Systems · ·
  103. The Entire Cascade (as a Funnel) · · , ,
  104. Hello, CSS Cascade Layers · · ,
  105. Using the Language Attribute to Make Your Website Accessible · · , ,
  106. Why Radio Buttons Are Called Radio Buttons in UIs? · · , ,
  107. Multi-Value CSS Properties With Optional Custom Property Values · · ,
  108. Moving from JavaScript to TypeScript · · ,
  109. How to Keep Your Repo Package Dependencies Up to Date Automatically · · , ,
  110. How Thinking About Hierarchical Grids Helps You Take a Content-First Approach to Design · · , ,
  111. MHTML in Chromium · · ,
  112. Only 2% of Sites Meet Accessibility Standards—Let’s Change That · ·
  113. The Difference Between Brotli and Gzip Compression Algorithms to Speed Up Your Site · · ,
  114. What I Learned Implementing a Design System for an Existing Product · ·
  115. How to Make CSS Slanted Containers · · ,
  116. Everything Publishers Need to Know About URLs · · , ,
  117. Building an Adaptive Favicon · · ,
  118. Accessibility Monitoring: How We Test · · , , ,
  119. Debugging JavaScript · · ,
  120. Aspect Ratio Is Great · · ,
  121. New in JavaScript: “reportError”—a Method to Report to Global Event Handlers · · ,
  122. Move Over JavaScript: Back-End Languages Are Coming to the Front-End · ·
  123. Developing a Focus Style for a Themable Design System · · , , ,
  124. This Is Why Your Node.js Application Is Slow · · ,
  125. Replace JavaScript Dialogs With the New HTML Dialog Element · · , ,
  126. Accessibility Testing Best Practices in CI/CD · · , , ,
  127. Creating Generative SVG Grids · · ,
  128. Modern, Single-Page Web Design: UX Design Trends and Tips · · , ,
  129. Do We Need Screen Reader for Accessibility Testing · · , , , ,
  130. How to Favicon in 2022: Six Files That Fit Most Needs · · , ,
  131. CSS Animations Tutorial: Complete Guide for Beginners · · , , ,
  132. Introducing the Dialog Element · · , ,
  133. UX and User Personas: How to Get it Right · · , ,
  134. How to Create a UX Vision Statement · · ,
  135. How to Use the Accessibility Tree for A11Y Testing · · , ,
  136. Are We Live? · · ,
  137. Design System Versioning: Single Library or Individual Components? · · ,
  138. Foundations: Colour Contrast · · , ,
  139. Understanding the W3C’s Accessibility Conformance Testing (ACT) Requirements · · , ,
  140. What Web Frameworks Solve: The Vanilla Alternative · · , ,
  141. 8 Key Elements for Creating a Culture of Accessibility · · ,
  142. The Impact of Motion Animation on Cognitive Disability · · , ,
  143. Reducing the Web’s Carbon Footprint: Optimizing Social Media Embeds · · , , ,
  144. No Accessibility Without Disabilities · · ,
  145. Why Efficient Hydration in JavaScript Frameworks Is So Challenging · · , ,
  146. Grow Your Design System from Good to Great · ·
  147. Settings Are Not a Design Failure · · , ,
  148. State of Frontend 2022 · ·
  149. Assistive Technology, Accessible Technology, and the Accessibility Tree · · , , , ,
  150. Improving JavaScript Bundle Performance With Code-Splitting · · , , , ,
  151. 5 Pitfalls of Using Micro Frontends and How to Avoid Them · ·
  152. Building Like It’s 1984: A Comprehensive Guide to Creating Intuitive Context Menus · · , ,
  153. Career Advice Nobody Gave Me: Never Ignore a Recruiter · ·
  154. Structuring Your Storybook · ·
  155. “Evergreen” Does Not Mean Immediately Available · ·
  156. CSS—Understanding the Cascade · · , ,
  157. Cascade Layers Are Coming to Your Browser · · , , ,
  158. Website Themes and Color Schemes · · , , ,
  159. 24 Lesser-Known HTML Attributes You May Want to Use · ·
  160. 4 Questions to Ask Before Using ARIA · · , , ,
  161. Accessibly Insecure · · ,
  162. Speed Matters, but It Isn’t Everything · · , ,
  163. Use Cases for CSS “fit-content” · ·
  164. Learn Responsive Design · · ,
  165. A More Easy Way to Write “if … or” Checks With Vanilla JavaScript · ·
  166. Preventing Smooth Scrolling With JavaScript · · ,
  167. The Focus-Indicated Pseudo-Class “:focus-visible” · · ,
  168. Inclusive Design · · ,
  169. Cascade Layers: First Contact · · ,
  170. Internal Onboarding for Design System Teams · · ,
  171. What Web Frameworks Solve and How to Do Without Them · · , ,
  172. How Does “!important” Actually Work? · · , ,
  173. Why You Should Use a Developer Font · · , ,
  174. Why Testing After Is a Bad Practice · ·
  175. WCAG, but in Language I Can Understand · · ,
  176. Caching Header Best Practices · · , ,
  177. Cherry Picking Commits in Git · · ,
  178. Demystifying TypeScript Discriminated Unions · ·
  179. Naming Design Tokens · · ,
  180. There’s No Such Thing as Clean Code · · ,
  181. To Create an Excellent Design System, Treat It Like a Collaborative Process · · , ,
  182. Top Ten Most Common Web Accessibility Issues · ·
  183. A Pipe Operator for JavaScript: Introduction and Use Cases · · , ,
  184. WebAssembly Feature Detection · · , ,
  185. The Baseline for Web Development in 2022 · ·
  186. The Double-Assignment Pattern in jQuery’s Source Code · · ,
  187. What’s New in DevTools? · · , , , , , , , , ,
  188. The Return of Server Side Routing · ·
  189. Design System: How to Efficiently Scale Development? · · , ,
  190. How to Convert Markdown to HTML · · , , ,
  191. Overview of Accessibility Testing Using DevTools · · , , , , , ,
  192. Fancy CSS Borders Using Masks · · , , ,
  193. Here’s What I Didn’t Know About “:where()” · · ,
  194. An Introduction to CSS Cascade Layers · · , ,
  195. Best Practices for Creating Your UX Design Portfolio · · , , ,
  196. Foundations: Text Descriptions · · ,
  197. Monorepo Explained · · ,
  198. Why Don’t Developers Take Accessibility Seriously? · ·
  199. The Risks and Rewards of App Modernization · · , ,
  200. More to Give Than Just the Div: Semantics and How to Get Them Right · · , ,
  201. Drift: Why Your Design System Isn’t Working · · ,
  202. Technology Time-Outs · · ,
  203. The Many Ways to Modify Leading and Trailing Characters from Strings With JavaScript · ·
  204. Context-Aware Web Components Are Easier Than You Think · · , ,
  205. How to Check What Item Is in Focus When Accessibility Testing · · , , ,
  206. Accessibility Acceptance Criteria · · , , ,
  207. Big Images, Blazingly Fast · · , ,
  208. Frontend Predictions for 2022 · ·
  209. Div Divisiveness · · ,
  210. Optimize Your PNGs With Oxipng and pre-commit · · , , , ,
  211. The Future of CSS: Detect At-Rule Support With “@ supports at-rule(@ keyword)” · · ,
  212. Design Systems Are Flawed · ·
  213. Giving Web Standards a Seat at the Table · · ,
  214. What Should Someone Learn About CSS If They Last Boned Up During CSS3? · ·
  215. An Introduction to High Contrast Accessibility · · , ,
  216. How to Avoid Layout Shifts Caused by Web Fonts · · , , ,
  217. How to Set Up a Node.js Project With TypeScript · · , ,
  218. Create an Open Graph Image Generator With Node.js · · , ,
  219. The Breakpoints We Tested in 2021 and 2022, and the Ones to Test in 2023 · · ,
  220. Making IT Accessible for All! · · ,
  221. Naming Conventions for Your Design System · · , ,
  222. Quick Accessibility Tests Anyone Can Do · · , ,
  223. TypeScript Features to Avoid · ·
  224. Building UI Components With SVG and CSS · · , ,
  225. Using PostCSS With Media Queries Level 4 · · , ,
  226. Becoming a Better Writer as a Software Engineer · · ,
  227. Modern Fluid Typography Using CSS Clamp · · ,
  228. Rethinking Component Libraries · ·
  229. Comparing CSS Specificity Values · · ,
  230. Find HTML Parsing Errors · · , , , ,
  231. Frontend Challenges: Front-End Engineer Assignment · · , , ,
  232. On the Peculiarities of Counting the Number of HTML Elements · ·
  233. The Real Added Costs of Accessibility · · ,
  234. “structuredClone()”: Deeply Copying Objects in JavaScript · · ,
  235. Choosing Open Source License Wisely · · ,
  236. Accessibility Data Is Not the Enemy · · ,
  237. CSS Cascade Layers: An Overview of the New “@ layer” and “layer()” CSS Primitives · · , , ,
  238. Building an Accessible Digital World · ·
  239. Rationalise It! 5 Steps to Introduce a New Component to the Design System · · ,
  240. Accessibility and 2022: 13 Design Trends from a Usability Perspective · · , , ,
  241. Git Organized: A Better Git Flow · · , ,
  242. Boolean Attributes in HTML and ARIA: What’s the Difference? · · ,
  243. Web Accessibility Lawsuits Dramatically Rose in 2021 · · , ,
  244. Website Performance and the Planet · · , ,
  245. An Introduction to Tech Debt (and Why It Can Change Your Career) · · , ,
  246. Make Beautiful Gradients · · ,
  247. PHP in 2022 · ·
  248. Remix vs. Next.js · · , ,
  249. Social Media Image Sizes 2022: Cheat Sheet for Every Network · · , ,
  250. Software Is Automating Design—What Does That Mean for Designers? · · ,