Frontend Dogma

News and Tools for Frontend Development (24)

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

  1. Have Single-Page Apps Ruined the Web? · · , ,
  2. Why Does Everything Look the Same? · ·
  3. Accessibility: A Gentle Introduction · · ,
  4. Internationalization: How to Boost Traffic With a Multilingual Site · · ,
  5. How We Improved Our Design System Delivery · · , , ,
  6. Buttons vs. Links · · , , , ,
  7. A Guide to CSS Debugging · · , ,
  8. My Challenge to the Web Performance Community · ·
  9. The Options for Password-Revealing Inputs · · , , , ,
  10. RenderingNG: An Architecture That Makes and Keeps Chrome Fast for the Long Term · · , , , , ,
  11. Safe DOM Manipulation With the Sanitizer API · · ,
  12. What Is Micro-Content? · · , ,
  13. How to Implement and Style the “Dialog” Element · · , , ,
  14. Automating a Design System · · , ,
  15. What Creating a Simple Font Taught Me About Font Design · · ,
  16. UX Accessibility: How to Start Designing for All · · , ,
  17. Why Do Webdevs Keep Trying to Kill REST? · · , ,
  18. Browsing With a Mobile Screen Reader · · , , , , ,
  19. Animation Techniques for Adding and Removing Items from a Stack · · , ,
  20. Redundantly Redundant a11y Accessibility · · ,
  21. Writing Clean JavaScript Tests With the BASIC Principles · · , ,
  22. How to Build an Expandable Accessible Gallery · · , , ,
  23. Conditional Border Radius in CSS · · ,
  24. The CSS “prefers-color-scheme” User Query and Order of Preference · ·
  25. Introducing Svelte, and Comparing Svelte With React and Vue · · , , , ,
  26. Using JavaScript to Detect High Contrast and Dark Modes · · , , , ,
  27. Sorting JavaScript Arrays by Nested Properties · · , ,
  28. Understanding and Working With Submodules in Git · · ,
  29. Links, Missing “href” Attributes, and Over-Engineered Code · · , ,
  30. Declaring Page Language—and Declaring Changes in Language · · , ,
  31. How I Built a Modern Website in 2021 · · , ,
  32. Practical Frontend Philosophy · · ,
  33. 9 Tag Management Solutions You Should Consider · · , , ,
  34. Web Streams Everywhere (and Fetch for Node.js) · · , , ,
  35. Figma Cheat Sheet · · , ,
  36. Comparing Page Language Declaration Setups in Screen Readers · · , , , , , ,
  37. Guidelines for Choosing a Node.js Framework · · , ,
  38. Faster React Apps With Memoization · · , ,
  39. Design Tokens Automation Pipeline: From Design Tools to Component Libraries · · , ,
  40. Let’s Dive into Cypress for End-to-End Testing · · ,
  41. Accessibility Isn’t New—and Neither Is Ableism · ·
  42. A JavaScript Developer’s Guide to Browser Cookies · · , ,
  43. How I Make CSS Art · · ,
  44. Beware False Negatives · ·
  45. Not Releasing Late on Fridays, a Matter of Courtesy · · ,
  46. One Last Time: Custom Styling Radio Buttons and Checkboxes · · , ,
  47. 7 UI Design Fundamentals for Developers · · ,
  48. A Content Model Is Not a Design System · · ,
  49. “initial” Doesn’t Do What You Think It Does · · ,
  50. Simplifying Form Styles With “accent-color” · · ,
  51. Just Redux: The Complete Guide · · ,
  52. When Everything Is Urgent, Nothing Is: What Is Alarm Fatigue and How to Deal With It · · ,
  53. Specification for Spoken Presentation in HTML · · ,
  54. Container Units Should Be Pretty Handy · · , ,
  55. ct.css—Let’s Take a Look Inside Your “<head>” · · , ,
  56. 7 Useful HTML Attributes You May Not Know · ·
  57. 7 Practical Uses for the “::before” and “::after” Pseudo-Elements in CSS · · ,
  58. Cascade Layers? · · ,
  59. Node.js Garbage Collection Explained · ·
  60. Yarn vs. npm: Everything You Need to Know · · , ,
  61. CSS Container Queries: Container-Relative Lengths · · ,
  62. Optimising a JavaScript Library With WebAssembly, a Failed Attempt · · , ,
  63. Using Monorepos Is Not That Bad · · ,
  64. Contemporary Design Has Lost Its Soul · ·
  65. Understanding “min-content”, “max-content”, and “fit-content” in CSS · ·
  66. Simpler Block Spacing in WordPress With “:is()” and “:where()” · · , ,
  67. How I Learnt to Stop Worrying and Love Animating the Box Model · · ,
  68. Provide Pronunciation for Ambiguous Words · · , ,
  69. Practical Frontend Architecture · ·
  70. 20 Killer JavaScript One-Liners · ·
  71. CSS Container Query Units · · , ,
  72. Why Inequalities Can Appear in Digital Accessibility and Inclusive Design · · , ,
  73. The New Requirements for WCAG 2.2 · · ,
  74. Design Direction as a Step Before Design System · · ,
  75. Minding the “gap” · ·
  76. New Principle: Do Not Design Around Third-Party Tools Unless It Actually Breaks the Web · · , ,
  77. Web Quality Assurance: From User Requirements to Web Risk Management · · ,
  78. What’s the Right Font Size in Web Design? · · ,
  79. Web Vitals Patterns · ·
  80. Small Bundles, Fast Pages: What to Do With Too Much JavaScript · · , ,
  81. Accessible Palette: Stop Using HSL for Color Systems · · , , ,
  82. How to Expand Your Engineering Skill Set Without Quitting Your Day Job · · , ,
  83. Optimizing Images on the Web · · ,
  84. Reducing the Need for Pseudo-Elements · · ,
  85. 1995: MySQL Arrives, Completing the LAMP Stack · · , , ,
  86. The Future of CSS: Cascade Layers (CSS “@ layer”) · · ,
  87. Master Frontend Development by Cloning These Websites · ·
  88. Modernising CSS Infrastructure in DevTools · · , , , , ,
  89. Designing Beautiful Shadows in CSS · · ,
  90. Notes on Synthetic Speech · · ,
  91. 29 Projects to Help You Practice HTML CSS Javascript 2021 · · , ,
  92. Scripting With Google zx · ·
  93. Myths About Web Accessibility · ·
  94. The Ultimate Guide to Web Console · · , , ,
  95. Less Absolute Positioning With Modern CSS · ·
  96. Vanilla JS Is a Web Performance Decision · · ,
  97. Flexible API Design: Create Hooks for Your PHP API Pipeline · · , ,
  98. Line Length Revisited: Following the Research · · , , ,
  99. Okhsv and Okhsl · · , ,
  100. Subsets and Supersets of WCAG · · ,
  101. The Case for “Developer Experience” · ·
  102. What Is Redundant Entry, and How Does It Affect Accessibility? · · ,
  103. Developer Decisions for Building Flexible Components · ·
  104. Bundling Non-JavaScript Resources · ·
  105. Enterprise UX: Essential Resources to Design Complex Data Tables · · , , ,
  106. Blowing Up HTML Size With Responsive Images · · , , ,
  107. Becoming a Design Tokens Ambassador · ·
  108. Defining Basic JavaScript Terms: “map”, “filter”, and “reduce” · ·
  109. Using CSS 3 Overflow Properties to Make Containers Meet WCAG 2.1 · · , ,
  110. What’s New in PHP 8.1: Features, Changes, Improvements, and More · ·
  111. Firefox’s “bolder” Default Is a Problem for Variable Fonts · · , , , ,
  112. Fractional SVG Stars With CSS · · ,
  113. What’s New With DevTools: Cross-Browser Edition · · , , , , , , , , ,
  114. 13 Advanced (but Useful) Git Techniques and Shortcuts · · ,
  115. 5 Steps for Writing Alt Text for Accessibility · · , ,
  116. A Practical Guide to Creating Reusable React Components · · , ,
  117. Color and Universal Design · · , ,
  118. HTTP/3: Practical Deployment Options · · , ,
  119. Designing for Long Waits and Interruptions: Mitigating Breaks in Workflow in Complex Application Design · · , ,
  120. Avoiding FOUT With Async CSS · ·
  121. Stop! Put Down That Ternary, Lines Are Free · ·
  122. Make Accessibility Part of Your Startup’s Products and Culture from Day One · · ,
  123. Reducing Carbon Emissions on the Web · ·
  124. The Pros and Cons of Professional Language · ·
  125. Multiple Accounts and Git · ·
  126. Element Diversity · ·
  127. Threats of Using Regular Expressions in JavaScript · · ,
  128. Getting Started With Web Accessibility Testing · · , ,
  129. The Effect of CSS on Screen Readers · · , , , ,
  130. Interactive Learning Tools for Front-End Developers · ·
  131. Understanding Next.js Data Fetching (CSR, SSR, SSG, ISR) · · , , , ,
  132. It Takes a PhD to Develop That · · , ,
  133. Web Scraping With JavaScript and Node.js · · , ,
  134. Building a Split-Button Component · · , , ,
  135. Twitter’s Div Soup and Uglyfied CSS, Explained · · , ,
  136. Best Practices for Logging in Node.js · · , ,
  137. Building a Stepper Component · · , ,
  138. Rethinking User Personas · · , ,
  139. Shifting Accessibility Testing to the Left · · , ,
  140. State Management in Next.js · · ,
  141. 9.5 Ways Google Rewrites Your Title Tags · · ,
  142. Writing High-Performance JavaScript · · ,
  143. Understanding Target Size Under WCAG 2.2 and How It Affects People With Disabilities · · ,
  144. Using SVG With Media Queries · · , ,
  145. Why You Should Manage Your Energy, Not Your Time · · ,
  146. Building Reactive Systems With Node.js · · ,
  147. Color and Contrast, What Does It Mean? · · , ,
  148. 1995: Apache and Microsoft IIS Shake Up the Web Server Market · · , ,
  149. 7 Practices to Create Good JavaScript Variables · ·
  150. Times New Roman Doesn’t Have to Be Boring—Here’s Why · · ,
  151. What Are the Web Performance Metrics That Actually Matter? · · ,
  152. The Seniority Rollercoaster · ·
  153. Common npm Mistakes Every Developer Should Avoid · · ,
  154. Exploring the CSS Paint API: Blob Animation · · , ,
  155. 7 Useful CSS Cheat Sheets to Improve Your Skills · · ,
  156. Creating a Positive Culture Around Accessibility · · ,
  157. 10 Fun Things You Can Do With GitHub.dev · ·
  158. Essential Concepts in JS · · ,
  159. Compound Components in React · · ,
  160. 5 Tools to Automate Your Development · · , ,
  161. Named and Framed · · ,
  162. Small Wins for Accessibility and Resilience · · ,
  163. Getting Started With CSS Animations · · , ,
  164. How to Use “Promise.any()” · · , ,
  165. Why Are Hyperlinks Blue? · · ,
  166. Embracing Asymmetrical Design and Overcoming the Harmful Effects of “text-overflow: ellipsis” in CSS · · ,
  167. jsc: My New Best Friend · · ,
  168. Flexbox or CSS Grid? How to Make Layout Decisions That Make Sense · · , , ,
  169. Scrollbar Reflowing · · , ,
  170. 8 Fundamental Principles of Effective Web Design · ·
  171. Key Data Structures and Their Roles in RenderingNG · · , , , ,
  172. React JS—the Confusing Parts · · ,
  173. HTTP/3: Performance Improvements · · , ,
  174. 5 Ways to Undo Mistakes With Git · · , ,
  175. 4 Important Differences Between Regular and Arrow Functions · · , ,
  176. How I Experience Web Today · · ,
  177. Using the Platform · ·
  178. 6 CSS Shorthand Properties to Improve Your Web Application · · ,
  179. Bootstrapping a Node.js TypeScript API: Routing, Middleware, and Custom Types and Errors Modules · · , , , , ,
  180. Accessibility from the Ground Up · ·
  181. UI Cheat Sheet: Spacing Friendships · · , ,
  182. What’s on the Menu? · · ,
  183. I Give You Feedback on Your Blog Post Draft but You Don’t Send It to Me · · ,
  184. How to Calculate REMs from Pixels · · ,
  185. I Tried Angular as a React Developer: Here Are 6 Things I Like About It · · , ,
  186. Truthy and Falsy: When All Is Not Equal in JavaScript · ·
  187. Web Accessibility Checklist · · , ,
  188. Top 9 Lessons Learned in 12 Years as a Software Developer · · ,
  189. One Favicon to Rule Them All · · , ,
  190. Building the Same App 5 Times · · , , , , ,
  191. ARIA Spec for the Uninitiated · · , ,
  192. Level Up Your CSS Linting Using Stylelint · · , ,
  193. State Management in Svelte Applications · · ,
  194. Using CSS Module Scripts to Import Stylesheets · · , ,
  195. What’s New in Bootstrap 5 · · ,
  196. CSS Grid Tooling in DevTools · · , , , , ,
  197. Does Shadow DOM Improve Style Performance? · · , , ,
  198. You Don’t Know “useEffect” · ·
  199. Practical Uses of CSS Math Functions: “calc”, “clamp”, “min”, “max” · · , ,
  200. Reviewing a Design for Accessibility · · , ,
  201. Decoding AVIF: Deep Dive With Cats and imgproxy · · ,
  202. A Guide to Designing Accessible, WCAG-Compliant Focus Indicators · · , , , ,
  203. Big O, Code Efficiency Analysis · · ,
  204. Breaking the Web Forward · · ,
  205. Accessible Design Systems: Look Good While Doing Good · · ,
  206. How to Test for Accessibility With Users at Every Design Stage · · , ,
  207. Static vs. Dynamic vs. Jamstack: Where’s the Line? · · , , ,
  208. CSS “accent-color” · · ,
  209. Accessible Contrast Ratios and A-Levels Explained · · , ,
  210. “<Lazy>” Rendering in Vue to Improve Performance · · , , ,
  211. Principles by Design · · ,
  212. The Complete Guide to HTML Forms and Constraint Validation · · , , ,
  213. “return await promise” vs. “return promise” in JavaScript · · , ,
  214. Adding 100 Underline/Overlay Animations: The Impressive CSS Collection · · ,
  215. The State of Mobile First and Desktop First · · , ,
  216. Google vs. the Web · · ,
  217. How Writing Can Advance Your Career as a Developer · · ,
  218. HTTP/3 from A to Z: Core Concepts · · , ,
  219. JavaScript Development: Making a Web Worker Optional · · ,
  220. The World of CSS Transforms · ·
  221. A Performance-Focused Workflow Based on Google Tools · · , , ,
  222. Exploring the CSS Paint API: Image Fragmentation Effect · · , , ,
  223. Next-Level List Bullets With CSS “::marker” · · ,
  224. Uploading Multiple Files With Fetch · · , ,
  225. Pixelart and the “image-rendering” Paradox · · , ,
  226. Browsers and Representation · ·
  227. On the “<dl>” · ·
  228. A Guide to Accessible Digital UX Design · · , , ,
  229. Inclusive Usability Testing: The Benefits of Inclusive Design · · , ,
  230. Sustainable Web Design, an Excerpt · ·
  231. Visualizing a Codebase · · ,
  232. Why Are We Talking So Much About Design Leadership? · · ,
  233. React Children and Iteration Methods · ·
  234. Using CSS Shapes for Interesting User Controls and Navigation · · ,
  235. What Are Accessibility Overlays Good For? · · ,
  236. Refresher on JavaScript Callbacks and Promises · · ,
  237. CSS Nesting, Specificity, and You · · , ,
  238. Accessibility Testing With Storybook · · , ,
  239. Writing Great Alt Text: Emotion Matters · · , , ,
  240. Building the Perfect GitHub CI Workflow for Your Frontend Team · · ,
  241. Web Accessibility Myths: Debunking 7 Common Misconceptions · ·
  242. Using localStorage With React Hooks · · , ,
  243. What Devs Need · · , ,
  244. npm Security Best Practices · · , ,
  245. How to Build Resilient JavaScript UIs · · , ,
  246. How to Use “Promise.allSettled()” · · , ,
  247. Introduction to TCP: Transmission Control Protocol · · , ,
  248. A Deep Dive on Skipping to Content · · ,
  249. Mitigating User Errors · · ,
  250. Refactoring CSS: Strategy, Regression Testing, and Maintenance · · , , , , ,