Frontend Dogma

News and Tools for Frontend Development (9)

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

  1. Cron Job: A Comprehensive Guide for Beginners · · ,
  2. CSS Logical Properties: A Good Use Case · · , ,
  3. I’m Done With React · · ,
  4. Speed Up or Slow Down a Video · · , ,
  5. Scroll-Driven Animations · · , ,
  6. HTTP/1 vs. HTTP/2 vs. HTTP/3 · · , ,
  7. How “:not()” Chains Multiple Selectors · · ,
  8. htmx Is the Future · · ,
  9. An Introduction to the “:has()” Selector in CSS · · , ,
  10. 5 Best Practices to Sustainably Improve Core Web Vitals · · , ,
  11. React Testing Library and Accessibility · · , , , ,
  12. GitHub Actions: All Actions Will Run on Node 16 Instead of Node 12 · · , ,
  13. Code Coverage vs. Test Coverage · · , , ,
  14. Angular v16 Is Here · · ,
  15. Don’t Use Custom CSS Scrollbars · · ,
  16. Digital Accessibility Is a Bigger Education Issue Than We Think—Here’s What We Can Do About It · · ,
  17. Where Would You Take the W3C? · · ,
  18. The Intersectionality of Web Performance · · , ,
  19. Make Your Website Load Fast by Optimizing Request Priorities · · , ,
  20. Security Implications of HTTP Response Headers · · ,
  21. How to Write More Efficient JavaScript Conditions · · , ,
  22. How to Make a CSS-Only Hamburger Menu · · , ,
  23. Detecting If an Event Was Triggered by a User or by JavaScript · · ,
  24. The Latest Innovations in Drupal · ·
  25. 7 Practical CSS Typography Tips and Tricks · · , , ,
  26. Release Notes for Safari Technology Preview 169 · · , , ,
  27. An Update on the Lock Icon · · , ,
  28. A Complete Guide to Performance Budgets · · , ,
  29. Do Logical Properties Make CSS Easier to Learn? · · , ,
  30. SupportsCSS · · , , ,
  31. 3 Engineering Mistakes That Kill Startups · · ,
  32. Short Note: Why Isn’t “role=presentation”/“none” Allowed on Focusable Elements? · · , , ,
  33. CSS Naked Day and the Missing Wikipedia Page · · ,
  34. developers.events: Maintaining a GitHub repository—What Have I Learned in 7 Years? · · , ,
  35. Why “font-size” Must Never Be in Pixels · · , , ,
  36. The Simple Trick to Transition from Height “0” to “auto” With CSS · · , , ,
  37. Creating an Animated Gradient Border With CSS · · , , ,
  38. CDNs: Speed Up Performance by Reducing Latency · · ,
  39. Testing Feature Support for Modern CSS · · , ,
  40. “:root” Isn’t Global · ·
  41. CSS Wishlist 2023 · · ,
  42. Practical Guide to Not Blocking the Event Loop · · , , ,
  43. What’s New in Svelte: May 2023 · · , ,
  44. Beyond Content Creation: How Open Source Contributions Can Help You Get Noticed · · , ,
  45. Tailwind CSS vs. UnoCSS · · , , ,
  46. This Blog Is Hosted on My Android Phone · · ,
  47. Configuring ESLint, Prettier, and TypeScript Together · · , , , , , ,
  48. Two Underused Arguments for Writing Documentation · · , ,
  49. 30th Anniversary of Licensing the Web for General Use and at No Cost · · , , , ,
  50. My Favorite Free Courses to Learn JavaScript in Depth · · , , ,
  51. The Popover API Is Exciting, Sort Of · · ,
  52. Dark Mode in 3 Lines of CSS and Other Adventures · · ,
  53. Animating the Impossible · · , ,
  54. Rebuilding a Featured News Section With Modern CSS: Vox News · · , , ,
  55. JS Private Class Fields Considered Harmful · ·
  56. New to the Web Platform in April · · , , , , , ,
  57. Write Better CSS by Borrowing Ideas from JavaScript Functions · · , , ,
  58. A Beginner’s Introduction to the Most Common Data Types in Programming · · , ,
  59. Everything You Need to Know About Webpack’s Bundle Analyzer · · , ,
  60. Accessible Target Sizes Cheatsheet · · ,
  61. Writing Unit Tests in Node.js Using Jest · · , ,
  62. Typography for Everyone · · , ,
  63. Progress over Perfection: The Better Way for Communication and Accessibility Advocacy · · , ,
  64. What Is the Value of a Design System? · ·
  65. The Most Underrated Section of Design Portfolios · · ,
  66. How to Deep Merge Arrays and Objects With JavaScript · · , , ,
  67. How to Manage Design Tokens · · , ,
  68. Modern CSS Layout Is Awesome! · · , ,
  69. The Interactive Guide to Rendering in React · · , ,
  70. The Most Important Thing Productivity Tools Are Missing About AI · · , ,
  71. Discovering the Power of JavaScript Proxy After All This Time · ·
  72. Adding Motion to the Next Decade of Atomic Design · ·
  73. Crafting the Next.js Website · ·
  74. Transition to and from “display: none” With Upcoming CSS Capabilities · · , ,
  75. Reducing the Cost of String Serialization in Node.js Core · · ,
  76. Comparing the Best Node.js Version Managers: nvm, Volta, and asdf · · , ,
  77. The Best Way to Get nvm Working in CI/CD Systems · · ,
  78. The “const” Deception · ·
  79. The Potentially Dangerous Non-Accessibility of Cookie Notices · · , , , ,
  80. Goodbye “create-react-app”: A New Approach · ·
  81. Figma, I Love You but You’re Bringing Me Down · ·
  82. Organizing a Web Design System for Scalability in Figma · · , ,
  83. Avoiding Dark Patterns in Web Design · · ,
  84. CSS Blend Modes · · ,
  85. Frontend Web Performance Checklist · · ,
  86. npm vs. Yarn vs. pnpm · · , , ,
  87. Design Debt: The Hidden Cost of Neglecting UX Investment, and How to Measure and Manage It · · , , ,
  88. Scoped CSS Is Back · · ,
  89. Exploring the Potential of Web Workers for Multithreading on the Web · · , , ,
  90. “details”/“summary” Inconsistencies · · , , ,
  91. The Effects of Technical Debt on Morale · · ,
  92. Considering Content Warnings in HTML · · , ,
  93. Meeting WCAG Level AAA · · , , ,
  94. Transitioning to Height Auto (Two Ways) · ·
  95. “The Secret List of Websites” · · , ,
  96. Dark Mode Toggle and “prefers-color-scheme” · · ,
  97. How to Write Comments in React: The Good, the Bad, and the Ugly · · , ,
  98. Upgrading Our CSS Habits: “aspect-ratio” · ·
  99. Read-Only Web Apps · · ,
  100. CSS Custom Properties Beyond the “:root” · · , ,
  101. Designing and Coding for Voice · ·
  102. 5 Topics You Should Touch on During the Recruitment Process · · , ,
  103. Spinning Diagrams With CSS · · ,
  104. Why Is Scrum the Most Popular Agile Framework? · · , ,
  105. It’s Time for the Tech Industry to Live Up to Its Ideals · · ,
  106. Intro to Runtime Performance in the Chrome DevTools Performance Panel · · , , , , , ,
  107. Visually Accessible Data Visualization · · ,
  108. Using HTML Elements as CSS Masks · ·
  109. 5 Code Refactoring Techniques to Improve Your Code · · , ,
  110. Productivity and Well-Being: A Summary of What Works · · ,
  111. Introducing npm Package Provenance · · , , , ,
  112. Generating Provenance Statements · · , ,
  113. Release Notes for Safari Technology Preview 168 · · , , ,
  114. Audio Accessibility in Miro: A Hackathon Story in 3 Acts · · , ,
  115. Node.js 20 Is Now Available! · · ,
  116. What’s New in ECMAScript 2023 · · ,
  117. DevTools: A Better Way to Visualize Your JavaScript · · , , , , , , ,
  118. Container Query Units and Fluid Typography · · , ,
  119. Signals: Fine-Grained Reactivity for JavaScript Frameworks · · , , ,
  120. How to Create an SEO Strategy · · , ,
  121. Kubernetes Quick Tutorial · · ,
  122. 8 Best Tools for Cryptography and Encryption · · , , , , ,
  123. Firefox May Soon Reject Cookie Prompts Automatically · · , , , ,
  124. Using a Muted Color Palette in Web Design · · , ,
  125. A List of Programming Playgrounds · · , ,
  126. Deno vs. Node: No One Is Ready for the Move · · , , ,
  127. Business Impacts of UI Design and UX Design · · ,
  128. What Is Design Thinking? · ·
  129. You Are What You Measure · · ,
  130. Answering “What ARIA Can I Use?” · · , , , , ,
  131. It’s Very Likely That… · · , , ,
  132. Exploring “:has()” Again · · ,
  133. The Acronyms of Rendering on the Web · · , , ,
  134. 3 Common IA Mistakes (That Are All Due to Low Information Scent) · · , ,
  135. My Favorite Courses to Learn Microservices in Depth · · , , ,
  136. How to Name Design Tokens in a Design System · · , , ,
  137. Serving Less Data to Users With the “prefers-reduced-data” Media Query · · , , ,
  138. Speeding Up the JavaScript Ecosystem—Draft-js Emoji Plugin · · , ,
  139. Angular 16 Is Huge · ·
  140. Dissecting npm Malware: Five Packages and Their Evil Install Scripts · · ,
  141. Lessons of Design · · ,
  142. 9 Bogus Reasons Why Some Designers Claim UX Research Is a Waste · · , ,
  143. Web Accessibility: A Reference to Creating Inclusive Websites · ·
  144. 4 Ways to Create an Enum in JavaScript · ·
  145. The “details” Element Is Amazing · ·
  146. Ping Animation With Minimal CSS · · ,
  147. Consume Web Streams from OpenAI Using Vanilla JavaScript · · , , , ,
  148. What’s New In DevTools: Debugging, Testing, and CSS (Chrome 110–112) · · , , , , , , ,
  149. A History of the World Wide Web from 1989 to the Present Day · · ,
  150. 10 Best Sorting Algorithms Explained · · ,
  151. Embracing AI as a Material for Design · · , ,
  152. Costly CSS Properties and How to Optimize Them · · , ,
  153. Breaking Down Accessibility Barriers: Top 4 Challenges With Screen Magnifiers · · ,
  154. The Pros and Cons of Different UI Automation Test Tools—Puppeteer · · , ,
  155. Transparent Video for the Web in 2023 · ·
  156. Passkeys: What the Heck and Why? · · ,
  157. Solving the CSS Layout and Source Order Disconnect · · ,
  158. Angular Is Back With a Vengeance · · ,
  159. Shifting Left, or: Making Accessibility Easier by Doing It Earlier · · , , ,
  160. How to Work With Dates and Times in Vanilla JavaScript · · ,
  161. CSS: Tricks for Targeting Elements With CSS · · , ,
  162. Shallow vs. Deep Copying in JavaScript · · ,
  163. Understanding CSS Preload and Other Resource Hints · · , ,
  164. HTML Accessibility API Mappings 1.0 · · , ,
  165. Expanding Grid Cards With View Transitions · · ,
  166. Firefox Rolls Out Total Cookie Protection by Default to More Users Worldwide · · , , , ,
  167. Accessibility in Design Systems: Building More Inclusive Products for a Better User Experience · · , , , ,
  168. Advanced Figma Components Tips and Tricks: Little Gems We Love · · , , ,
  169. Don’t Override Screen Reader Pronunciation · · , , , ,
  170. What’s a Basic Use Case for Cascade Layers in CSS? · · , ,
  171. New HTML Element: “search” · · ,
  172. Formulating Your Product Design North Star (aka Design Principles) · · , ,
  173. React, Visualized · · ,
  174. The Performance Golden Rule Revisited · · ,
  175. Trying Node.js Test Runner · · ,
  176. Temporal Intervals Are Handy in MySQL · · ,
  177. Document or Die: The Importance of Writing Things Down in Tech · · , ,
  178. Building Pagination in React With React Paginate · · , ,
  179. Why Astro Is My Favorite Framework · · ,
  180. CSS Text Balancing With “text-wrap: balance” · · ,
  181. Becoming a Frontend Developer in 100 Days: A Step-by-Step Guide · · , ,
  182. What’s New in CSS? · · ,
  183. Choosing Humanity over Automation · · , ,
  184. Mastering Yarn’s Lifecycle With Hooks · · ,
  185. Boost Your JavaScript With JSDoc Typing · · , ,
  186. Understanding Apache Web Server Configuration · · , ,
  187. DevTools: A Clever Overview of All Your CSS Code · · , , , , ,
  188. Chasing Rainbows · · ,
  189. Programming-Language Popularity by GitHub Pull Requests · · , , , , ,
  190. The Pattern to Make Your Frontend Tests 10× Better · ·
  191. It’s Time to Learn OKLCH Color · · , ,
  192. Stream File Uploads to S3 Object Storage and Save Money · · , , ,
  193. Frontend Developer Tries Tailwind for the First Time · · , ,
  194. Establishing Metrics for Accessibility ROI · · , ,
  195. Unlocking the Power of Design Tokens to Create Dark Mode UI · · ,
  196. 3 Methods for Scoped Styles in Web Components That Work Everywhere · · , , , , ,
  197. 10 CSS Animation Tips and Tricks · · , , ,
  198. Foundations: Accessible Names and Descriptions · · , , ,
  199. Designing for Reduced Motion · · ,
  200. Can You Create Beautiful Stroked Text in CSS? · · ,
  201. Observing CSS · · , ,
  202. What’s New in WCAG 2.2? · · , ,
  203. Choosing a Name for Your Design System · · ,
  204. The Alt Text War—SEO vs. Accessibility · · , , , ,
  205. 7 Tips for Getting Started With Vue.js · · , ,
  206. Release Notes for Safari Technology Preview 167 · · , , ,
  207. 4 GitHub Alternatives for Code Repositories · · ,
  208. Code Explanation Using GitHub Copilot · · , ,
  209. What Is Semantic HTML? · · ,
  210. New in Chrome 112 · · , , ,
  211. What Makes a Good Screenshot? · · ,
  212. Testing Localhost on Multiple Devices · · ,
  213. The Revenge of the Pop-Up · · , ,
  214. Accessibility for Designers: Where Do I Start? · · , ,
  215. Exposing Field Errors · · , , , ,
  216. How WebAssembly Is Accelerating New Web Functionality · · ,
  217. Safari Releases Are Development Hell · · , , ,
  218. Copy to Clipboard In JavaScript and React · · ,
  219. What Is a Design System and Why Should You Use One? · ·
  220. So, How Can We Measure UX? · · ,
  221. Five Pieces of Advice for More Accessible Websites · · ,
  222. A Small JavaScript Pattern I Enjoy Using · ·
  223. Quick Tip: Pull Data from an API into a Figma Layer · · , , ,
  224. A Color Wheel With Gradient · · , , , ,
  225. Slow Start and Congestion Control (Browser Networking) · · , ,
  226. Modern HTML Email (Tables No Longer Required) · · , ,
  227. Sticky Page Header Shadow on Scroll · · , ,
  228. When I Get That Low Contrast Feeling, I Need Non-Textual Healing · · , ,
  229. Why Do They Ignore My Awesome Design Documentation? · · ,
  230. The Future of Senior Developers in an AI-Driven World · · , ,
  231. 10 Ways to Hide Elements in CSS · · , ,
  232. 7 Tricks to Take the Performance of Your Website to the Moon · · , , ,
  233. We Need Accessibility Action · · ,
  234. The Ultimate Guide to Automatic Accessibility Testing in CI/CD for React Apps · · , , , , ,
  235. Folder Structure for Modern Web Applications · · ,
  236. New to the Web Platform in March · · , , , , , , , ,
  237. DevTools: Getting Data from DevTools into Your Code Editor · · ,
  238. Modern Web Development: Centering Divs in New Exciting Wrong Ways With AI · · ,
  239. The Pros and Cons of Different UI Automation Test Tools—Playwright · · , ,
  240. Alternative Text in the Wild: 5 Alternative Text Examples · · , ,
  241. A CSS Selector to Highlight Clickable Elements · · ,
  242. Checkered Background Using Two Lines of Code in CSS · · ,
  243. One in Two New npm Packages Is SEO Spam Right Now · · ,
  244. What Are Source Maps? · · ,
  245. CSS Masking · · ,
  246. Why I Quit Being a Tech “Influencer” · ·
  247. From Burnout to Balance: Why Are So Many UX Designers Fatigued? · · , , ,
  248. Why JavaScript Is a Prototype-Based OOP · · ,
  249. XUL Layout Is Gone · · , , , ,
  250. Using PHP Arrays: A Guide for Beginners · · , ,