Frontend Dogma

News and Tools for Frontend Development (12)

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

  1. Business Impacts of UI Design and UX Design · · ,
  2. What Is Design Thinking? · ·
  3. You Are What You Measure · · ,
  4. Answering “What ARIA Can I Use?” · · , , , , ,
  5. It’s Very Likely That… · · , , ,
  6. Exploring “:has()” Again · · ,
  7. The Acronyms of Rendering on the Web · · , , ,
  8. 3 Common IA Mistakes (That Are All Due to Low Information Scent) · · , ,
  9. My Favorite Courses to Learn Microservices in Depth · · , , ,
  10. How to Name Design Tokens in a Design System · · , , ,
  11. Serving Less Data to Users With the “prefers-reduced-data” Media Query · · , , ,
  12. Speeding Up the JavaScript Ecosystem—Draft-js Emoji Plugin · · , ,
  13. Angular 16 Is Huge · ·
  14. Dissecting npm Malware: Five Packages and Their Evil Install Scripts · · ,
  15. Lessons of Design · · ,
  16. 9 Bogus Reasons Why Some Designers Claim UX Research Is a Waste · · , ,
  17. Web Accessibility: A Reference to Creating Inclusive Websites · ·
  18. 4 Ways to Create an Enum in JavaScript · ·
  19. Ping Animation With Minimal CSS · · ,
  20. Consume Web Streams from OpenAI Using Vanilla JavaScript · · , , , ,
  21. The “details” Element Is Amazing · ·
  22. What’s New In DevTools: Debugging, Testing, and CSS (Chrome 110–112) · · , , , , , , ,
  23. A History of the World Wide Web from 1989 to the Present Day · · ,
  24. 10 Best Sorting Algorithms Explained · · ,
  25. Embracing AI as a Material for Design · · , ,
  26. Costly CSS Properties and How to Optimize Them · · , ,
  27. The Pros and Cons of Different UI Automation Test Tools—Puppeteer · · , ,
  28. Breaking Down Accessibility Barriers: Top 4 Challenges With Screen Magnifiers · · , ,
  29. Transparent Video for the Web in 2023 · ·
  30. Passkeys: What the Heck and Why? · · ,
  31. Solving the CSS Layout and Source Order Disconnect · · ,
  32. Angular Is Back With a Vengeance · · ,
  33. Shifting Left, or: Making Accessibility Easier by Doing It Earlier · · , , ,
  34. How to Work With Dates and Times in Vanilla JavaScript · · ,
  35. CSS: Tricks for Targeting Elements With CSS · · , ,
  36. Shallow vs. Deep Copying in JavaScript · · ,
  37. Understanding CSS Preload and Other Resource Hints · · , ,
  38. HTML Accessibility API Mappings 1.0 · · , ,
  39. Expanding Grid Cards With View Transitions · · ,
  40. Firefox Rolls Out Total Cookie Protection by Default to More Users Worldwide · · , , , ,
  41. Accessibility in Design Systems: Building More Inclusive Products for a Better User Experience · · , , , ,
  42. Advanced Figma Components Tips and Tricks: Little Gems We Love · · , , ,
  43. Don’t Override Screen Reader Pronunciation · · , , , ,
  44. What’s a Basic Use Case for Cascade Layers in CSS? · · , ,
  45. New HTML Element: “search” · · ,
  46. Formulating Your Product Design North Star (aka Design Principles) · · , ,
  47. The Performance Golden Rule Revisited · · ,
  48. Trying Node.js Test Runner · · ,
  49. Temporal Intervals Are Handy in MySQL · · ,
  50. Document or Die: The Importance of Writing Things Down in Tech · · , ,
  51. Building Pagination in React With React Paginate · · , ,
  52. React, Visualized · · ,
  53. Why Astro Is My Favorite Framework · · ,
  54. CSS Text Balancing With “text-wrap: balance” · · ,
  55. Becoming a Frontend Developer in 100 Days: A Step-by-Step Guide · · , ,
  56. What’s New in CSS? · · ,
  57. Choosing Humanity over Automation · · , ,
  58. Mastering Yarn’s Lifecycle With Hooks · · ,
  59. Understanding Apache Web Server Configuration · · , ,
  60. Boost Your JavaScript With JSDoc Typing · · , , ,
  61. DevTools: A Clever Overview of All Your CSS Code · · , , , , ,
  62. Chasing Rainbows · · ,
  63. The Pattern to Make Your Frontend Tests 10× Better · ·
  64. It’s Time to Learn OKLCH Color · · , ,
  65. Stream File Uploads to S3 Object Storage and Save Money · · , , ,
  66. Programming-Language Popularity by GitHub Pull Requests · · , , , , , ,
  67. Frontend Developer Tries Tailwind for the First Time · · , ,
  68. Establishing Metrics for Accessibility ROI · · , ,
  69. Unlocking the Power of Design Tokens to Create Dark Mode UI · · ,
  70. 3 Methods for Scoped Styles in Web Components That Work Everywhere · · , , , , ,
  71. 10 CSS Animation Tips and Tricks · · , , ,
  72. Foundations: Accessible Names and Descriptions · · , , ,
  73. Designing for Reduced Motion · · ,
  74. Can You Create Beautiful Stroked Text in CSS? · · ,
  75. Observing CSS · · , ,
  76. What’s New in WCAG 2.2? · · , ,
  77. Choosing a Name for Your Design System · · ,
  78. The Alt Text War—SEO vs. Accessibility · · , , , ,
  79. 7 Tips for Getting Started With Vue.js · · , ,
  80. Release Notes for Safari Technology Preview 167 · · , , ,
  81. 4 GitHub Alternatives for Code Repositories · · ,
  82. Code Explanation Using GitHub Copilot · · , ,
  83. What Is Semantic HTML? · · ,
  84. New in Chrome 112 · · , , ,
  85. What Makes a Good Screenshot? · · ,
  86. Testing Localhost on Multiple Devices · · ,
  87. The Revenge of the Pop-Up · · , ,
  88. Accessibility for Designers: Where Do I Start? · · , ,
  89. Exposing Field Errors · · , , , ,
  90. How WebAssembly Is Accelerating New Web Functionality · · ,
  91. Safari Releases Are Development Hell · · , , ,
  92. Copy to Clipboard In JavaScript and React · · ,
  93. What Is a Design System and Why Should You Use One? · ·
  94. So, How Can We Measure UX? · · ,
  95. Five Pieces of Advice for More Accessible Websites · · ,
  96. A Small JavaScript Pattern I Enjoy Using · ·
  97. Quick Tip: Pull Data from an API into a Figma Layer · · , , ,
  98. A Color Wheel With Gradient · · , , , ,
  99. Slow Start and Congestion Control (Browser Networking) · · , ,
  100. JSON vs. XML With Douglas Crockford · · , , , , ,
  101. Modern HTML Email (Tables No Longer Required) · · , ,
  102. Sticky Page Header Shadow on Scroll · · , ,
  103. When I Get That Low Contrast Feeling, I Need Non-Textual Healing · · , ,
  104. Why Do They Ignore My Awesome Design Documentation? · · ,
  105. The Future of Senior Developers in an AI-Driven World · · , ,
  106. 10 Ways to Hide Elements in CSS · · , ,
  107. 7 Tricks to Take the Performance of Your Website to the Moon · · , , ,
  108. We Need Accessibility Action · · ,
  109. The Ultimate Guide to Automatic Accessibility Testing in CI/CD for React Apps · · , , , , ,
  110. Folder Structure for Modern Web Applications · · ,
  111. New to the Web Platform in March · · , , , , , , , ,
  112. DevTools: Getting Data from DevTools into Your Code Editor · · ,
  113. Modern Web Development: Centering Divs in New Exciting Wrong Ways With AI · · ,
  114. The Pros and Cons of Different UI Automation Test Tools—Playwright · · , ,
  115. Alternative Text in the Wild: 5 Alternative Text Examples · · , ,
  116. A CSS Selector to Highlight Clickable Elements · · ,
  117. Checkered Background Using Two Lines of Code in CSS · · ,
  118. One in Two New npm Packages Is SEO Spam Right Now · · ,
  119. What Are Source Maps? · · ,
  120. CSS Masking · · ,
  121. Why I Quit Being a Tech “Influencer” · ·
  122. From Burnout to Balance: Why Are So Many UX Designers Fatigued? · · , , ,
  123. Why JavaScript Is a Prototype-Based OOP · · ,
  124. XUL Layout Is Gone · · , , , ,
  125. Using PHP Arrays: A Guide for Beginners · · , ,
  126. Framework Popularity on Netlify · · , , , ,
  127. Usability Heuristics in Game Design · · , ,
  128. 6 Steps to Reduce the Carbon Footprint of Your Website · ·
  129. HTML: Help Users to Download Files With the HTML “download” Attribute · ·
  130. How to Use Google Fonts and “font-display” · · , , ,
  131. Flutter Performance Optimization Techniques and Best Practices · · , , ,
  132. The WebAIM Million · · , , ,
  133. JavaScript Import Maps Are Now Supported Cross-Browser · · , ,
  134. 10 AI Tools for Content Writing · · , , , ,
  135. Guardrails for Better Accessibility Support in Frontend · · , ,
  136. Accessibility vs. Emojis · · , , ,
  137. How to Split an Angular App into Micro-Frontend Apps · · , , ,
  138. How to Review and Refactor Code With GPT-4 (and ChatGPT) · · , , , ,
  139. Improving CSS Shapes With Trigonometric Functions · · ,
  140. In Praise of Vite · ·
  141. TypeScript Function Types: A Beginner’s Guide · · , ,
  142. Connecting Dots of an Accessibility Audit · · ,
  143. File Uploads for the Web: File Uploads in Node and Nuxt · · , ,
  144. Fighting Inter-Component HTML Bloat · · , , ,
  145. Defaulting on Single Page Applications (SPA) · · , ,
  146. Mastering the JavaScript “switch” Statement · ·
  147. CSS Creator Håkon Wium Lie Interview · · ,
  148. Getting Started With HTML Tables · · , ,
  149. AI-Enhanced Development Makes Me More Ambitious With My Projects · · , ,
  150. Function Overloading in TypeScript · · ,
  151. A Quick Guide to Reviewing a VPAT ACR · · , , ,
  152. UX Principles for AI Products · · , ,
  153. Using TypeScript Without Compilation · ·
  154. UX Basics: Study Guide · · , , , ,
  155. CSS-Only Widgets Are Inaccessible · · ,
  156. Harnessing GPT-4 for Writing Assistance and Content Creation · · , , ,
  157. Brief Introduction to Edge Computing · · ,
  158. The “search” Element · · , ,
  159. WYSIWYGPT · · ,
  160. Usability 101 · · ,
  161. CSS “overflow” Property · ·
  162. The IL1 Typography Test · · , , , ,
  163. The State of JS Frameworks · · , , ,
  164. The Causes of Unreliable Software · · ,
  165. The Landscape of npm Packages for CLI Apps · · , , ,
  166. What Is Strict Mode in React? · ·
  167. DevTools: Convert Network Requests to Code, or Even to a Terminal Command · · , , ,
  168. The Ultimate Guide to Image Optimisation · · , , , ,
  169. What We’ve Learned About Designing for Accessibility from Our Users · · ,
  170. Everything You Wanted to Know About Video Storage APIs · · , ,
  171. The Machines Won’t Save Your Design System · · ,
  172. A Complete Visual Guide to Understanding the Node.js Event Loop · · , ,
  173. Circular Text With CSS? · ·
  174. Accessible but Never Boring: Rebranding the Wise Design System for Everyone II · · , ,
  175. 5 Lesser-Known Spacing Tips for Product Designers · · ,
  176. Some Cross-Browser DevTools Features You Might Not Know · · , , , , , , ,
  177. Certifications Should Be Hard · · , ,
  178. Automatic npm Publishing With GitHub Actions and npm Granular Tokens · · , ,
  179. What’s New in Eleventy 2: A Great SSG Just Got Better · ·
  180. With or Without the JS Framework · · , ,
  181. Annotating Designs for Accessibility · · , ,
  182. The Carbon Cost of Social Media · · ,
  183. That Time When SVG Almost Got Network Support for Raw Sockets · · , ,
  184. Visually Hidden Content Is a Hack That Needs to Be Resolved, Not Enshrined · · , , , ,
  185. How to Start a React Project in 2023 · · ,
  186. File Uploads for the Web: Upload Files With JavaScript · · ,
  187. When Is “:focus-visible” Visible? · · , ,
  188. State of Node.js 2023 · · ,
  189. 7 Ways Web Developers and UX Designers Can Collaborate · · ,
  190. Why We Added package.json Support to Deno · · , , ,
  191. What Is Git Merge and How to Use It? · ·
  192. The End of Front-End Development · · , ,
  193. The Intersection of Data Visualization and UX Design · · , ,
  194. The Age of Average · ·
  195. Preventing Too-Short Final Lines of Text Blocks · · ,
  196. Regression Testing in the Agile Universe · · , , ,
  197. The Cost of Craft · · , , ,
  198. CSS Is Dead! · ·
  199. 5 Ways to Modernize Your Web Application · · , , , , , , ,
  200. The 5 Best Status Page Tools · · , , ,
  201. Rich Harris Talks SvelteKit and What’s Next for Svelte · · , ,
  202. Using “forRoot()” and “forChild()” in Angular · ·
  203. Laying Out a Print Book With CSS · · ,
  204. Deep Dive into How Web Browsers Work (with Illustrations) · · ,
  205. Speeding Up the JavaScript Ecosystem—npm Scripts · · , , ,
  206. Introduction to Flutter: Getting Started With Cross-Platform Development · · ,
  207. Design System Guide · · , ,
  208. Unexpected Moments of JavaScript That Will Challenge Your Understanding of the Language · ·
  209. How to Stop a React Component from Rendering · · , , ,
  210. DevTools: Tricks for Copying the Styling from Any Website · · , , , ,
  211. Foundations: Pointer Gestures · · ,
  212. Retro-Specifying Fetch/Performance · · , ,
  213. Hijacking Screenreaders With CSS · · , , , , ,
  214. How Screen Readers Read Special Characters: An Update · · , , , , ,
  215. Everything You Need to Know About the Updated React Docs · · ,
  216. How to Use “v-model” With Form Inputs in Vue · · , ,
  217. The Problem With React · ·
  218. 5 Tips for New Prototypers · · , ,
  219. Cryptographically Protecting Your SPA · · , ,
  220. It’s About Time CAPTCHAs Become Accessible · · ,
  221. Accessibility Beyond Code Compliance · · ,
  222. Accessibility and Design Systems: The Deep-Dive Q&A · · , ,
  223. DevTools: Faster Searching in DevTools With CSS Selectors · · , , , , ,
  224. Internationalization in Next.js 13 With React Server Components · · , , ,
  225. Tracking the Fake GitHub Star Black Market With Dagster, dbt, and BigQuery · · , ,
  226. Versioning Design Tokens · · , ,
  227. Scraping Single-Page Applications With Playwright · · , ,
  228. The Ultimate Guide to Micro-Content · · , ,
  229. JavaScript Polyfills · · ,
  230. Future CSS: Anchor Positioning · · ,
  231. JavaScript for Beginners: Data Structures · · , ,
  232. Git Fundamentals, a Complete Guide · · , ,
  233. The H1 Conundrum: Understanding the Challenges of Heading Level One · · , , ,
  234. Cool Frontend Arts of Local-First: Storage, Sync, Conflicts · · , ,
  235. 6 CSS Snippets Every Front-End Developer Should Know in 2023 · ·
  236. Modern Font Stacks · · , ,
  237. What Leonardo Da Vinci Can Teach Us About Web Design · · ,
  238. JavaScript: Automatically Remove an Event Listener After It Has Executed · · ,
  239. Fix Color Contrast—Web Accessibility for Text and UI Design · · , ,
  240. Circling Back on Design and Everything Else · ·
  241. How Design Is Governance · ·
  242. Progressively Enhancing a Table With a Web Component · · , , , ,
  243. Advice from a Software Engineer With 8 Years of Experience · ·
  244. Accepting Design · ·
  245. Useful Tips and Tricks for Laravel · · ,
  246. TCP Echo Server for Node.js · · , ,
  247. Best Practices for Structuring Accessibility Testing · · , ,
  248. Why Aren’t Logical Properties Taking Over Everything? · · , ,
  249. Making Calendars With Accessibility and Internationalization in Mind · · , ,
  250. The Ternary Operator in JavaScript · · ,