Frontend Dogma

News and Tools for Frontend Development (8)

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

  1. Deploying a Fastify and Vue 3 Static Site to Heroku · · ,
  2. New Viewport Units · · , ,
  3. The Decline in Design (Thinking) · · ,
  4. Awesome List of Free CSS [Generators] · · , , ,
  5. Shines, Perspective, and Rotations: Fancy CSS 3D Effects for Images · · , ,
  6. htmx in 100 Seconds · · , ,
  7. Strategic UX Research Is the Next Big Thing · · , ,
  8. From Hacks to Elegance: Transforming a Card Component With Modern CSS Wizardry · · , , ,
  9. Testing the Dark Scenarios of Your Node.js Application · · ,
  10. The New “@ font-face” Syntax · · ,
  11. Four Lenses of Productivity · ·
  12. A Roadmap to Leadership Inclusion: 15 Keys to Unlocking a Diverse and Empowered Workplace · · , ,
  13. An Introduction to Native CSS Nesting · · , ,
  14. Is Lighthouse a Misleading Performance Tool? · · , , ,
  15. The Case Against Self-Closing Tags in HTML · ·
  16. There’s No Such Thing as a “Normal” User · ·
  17. Just Normal Web Things · · ,
  18. URL Explained: The Fundamentals · ·
  19. Offset Parent and Stacking Context: Positioning Elements in All Three Dimensions · · ,
  20. Resources for Procurement of Accessible Digital Products and VPAT · · , , ,
  21. Creating SVG Animations Using Tailwind CSS · · , ,
  22. CSS Only Floating Labels · · ,
  23. When User Testing Sessions Bring Up Trauma · · ,
  24. Understanding JWTs: A Simple Guide for Beginners · · ,
  25. Redundancy Is Great · ·
  26. How to Validate HTML On-Line at W3C · · , , ,
  27. Introduction to the Kanban Framework: A Beginner’s Guide to Agile Project Management · · , , ,
  28. Can We Query the Root Container? · · ,
  29. Multithreading With Worker Threads in Node.js · · , ,
  30. See What’s New in Firefox [115.0] · · , , ,
  31. Are We There Yet? · · , ,
  32. The Trick to Smoothly Animating Shadows in CSS · · , , ,
  33. Design for the Web Without Figma · · ,
  34. The “article” Element and Screen Readers · · , , , , ,
  35. What Is Page Bloat? And How Is It Hurting Your Business, Your Search Rank, and Your Users? · · , , ,
  36. Build a Simple Beginner App With Node, Bootstrap, and MongoDB · · , , ,
  37. The Fake Aura of Care in UX · ·
  38. Understanding SVG Paths · ·
  39. Your Browser May Be Having a Secret Relationship With a Screen Reader · · , , ,
  40. How I Am Blogging the IndieWeb Way · · , ,
  41. AI and the Automation of Work · · , ,
  42. 4 Design Principles I Use Every Day to Avoid Bad UX and Create Products That Work for Everyone · · , , ,
  43. And 4 More HTML Concepts You Didn’t Know · · , ,
  44. How to Use Node.js to SSH into Remote Servers: A Comprehensive Guide · · , , , , ,
  45. Identify Unused npm Packages in Your Project · · , ,
  46. Setting Expectations for the Node.js Test Runner · · , ,
  47. In Defence of “DOM­Content­Loaded” · · , ,
  48. The Big Problem With Variables in Figma · ·
  49. How to Measure the Impact of a Design System? · · , ,
  50. Observing Node.js Processes With eBPF · · ,
  51. How to Tackle Docker and Kubernetes for Frontend · · , ,
  52. Angular Is Getting New Template Syntax · ·
  53. CommonJS Is Hurting JavaScript · ·
  54. New to the Web Platform in June · · , , , , , , , ,
  55. Introduction to JSX · · , ,
  56. React Developers Love Preact, Here’s Why · · , ,
  57. The “details” Element and In-Page Search · · , , ,
  58. Accessible Overlays Aren’t Accessible · · ,
  59. Under-Engineered Comboboxen? · · , , ,
  60. What’s the Perfect Design Process? · · ,
  61. An Introduction to the View Transitions API · · , ,
  62. WCAG 2.2, Quick and Simplified · · , ,
  63. JavaScript Gom Jabbar · ·
  64. What’s Next for Redux With Mark Erikson · · , , , ,
  65. Understanding TypeScript Generators · ·
  66. How to Build Things People Want to Use · · ,
  67. Solved: Tricky Floating Image Alignment · · , ,
  68. Combat Accessibility Decay: How to Maintain Ongoing Accessibility · · , ,
  69. Introduction to MySQL Data Types · · , ,
  70. The Importance of Verifying Webhook Signatures · · ,
  71. Position-Driven Styles · · ,
  72. 4 Ways to Improve Mobile Accessibility · · ,
  73. Getting Started With Native Design Tokens in Figma · · , ,
  74. Web and App ADA Lawsuits: 6 Trends So Far in 2023 · · , ,
  75. Why You Must Commit to Grounding Every DEI-Related Effort With Data · · , , ,
  76. How to Use CSS “background-size” and “background-position” · · , ,
  77. Feature Flags Configuration, Instrumentation, and Use · · , , ,
  78. JavaScript Console Methods: A Deep Dive · · , ,
  79. Release Notes for Safari Technology Preview 173 · · , , ,
  80. Form and Search Landmarks · · , , , , ,
  81. The Massive Bug at the Heart of the npm Ecosystem · · , ,
  82. Building Sliding Cards With “position: sticky;” · ·
  83. Demystifying JavaScript Operators: What Does That Symbol Mean? · · ,
  84. What’s Next for JavaScript: New Features to Look Forward To · ·
  85. Amplify Design Values Through Building Design System · · ,
  86. Feature Management and Feature Experimentation, Why You Should Do Both—How It Helps Both Product and Software Engineering Teams · · , , ,
  87. Popular DevTools Tips · · , ,
  88. Mapping Typography · · , ,
  89. Faking a “:snapped” Selector With Scroll-Driven Animations · · , , ,
  90. AI Is Killing the Old Web, and the New Web Struggles to Be Born · · ,
  91. Going Beyond Constants With Custom Properties · · ,
  92. Transition Between Pages Smoothly With a Single Line of Code · · ,
  93. What Does the Image “decoding” Attribute Actually Do? · · , ,
  94. Learn How to Use Hue in CSS Colors With HSL · · , ,
  95. Live Regions in React · · , , ,
  96. Tips for Upgrading Your Techstack for Faster Frontend Development · · , , , ,
  97. Top Tips from a Web Accessibility Evaluator at WebAIM · · , ,
  98. Qwik Introduction—a Framework That Goes Fast · · , ,
  99. What’s Your Type? Try These Tests to Pick the Perfect Font for You · · , ,
  100. An Introduction to Parser Combinators · · ,
  101. Mixing Colors With CSS · · ,
  102. A Beginner’s Guide to Laravel: Introduction and Key Features · · , ,
  103. XML Is the Future · · ,
  104. WebSockets 101 · · , ,
  105. Text Wrap Pretty Is Coming to CSS · · ,
  106. An Introduction to Command Injection Vulnerabilities in Node.js and JavaScript · · , , ,
  107. Choosing a Color Palette · · , , ,
  108. Using BEM for Design System Tokens · · , ,
  109. Converting [a] JavaScript Codebase to TypeScript · · , , ,
  110. Understanding Authorization Before Authentication: Enhancing Web API Security · · , , , ,
  111. Debugging INP · · , , ,
  112. All You Need to Know About CORS and CORS Errors · · , ,
  113. Announcing Svelte 4 · · ,
  114. The Cost of JavaScript 2023 · · , ,
  115. Future CSS: State Container Queries · · ,
  116. Component Driven User Interface Testing (CDUIT) · · ,
  117. The Unlikely Story of UTF-8: The Text Encoding of the Web · · ,
  118. Introducing the MDN Playground: Bring Your Code to Life · · , ,
  119. What Exactly Is [the] “:root” Pseudo-Element in CSS? · · , ,
  120. Design Systems Directory · · ,
  121. Designing for Inclusion · · , ,
  122. WCAG 2.2 Removes 4.1.1 Parsing and How axe-core Is Impacted · · , , ,
  123. How Designers Can Beat AI at Design · · ,
  124. Using Multiple Selectors With JavaScript Selector Methods · · ,
  125. Cascade Layers Are Useless * · · ,
  126. Too Much JavaScript? Why the Frontend Needs to Build Better · · , ,
  127. CSS in Micro Frontends · · ,
  128. The 5 Pillars of Every HTTP Request · ·
  129. State of CSS 2023 · · ,
  130. W3C Launch Their New Website · ·
  131. Creating a Flexible Design Token Taxonomy for Intuit’s Design System · · ,
  132. Thoughts from “Meet Safari for Spatial Computing” · · , , ,
  133. Three Key Principles for an Accessible Website · · ,
  134. Authentication vs. Authorization · · , ,
  135. Making Your Design Tokens Future-Proof · ·
  136. Style Your RSS Feed · · ,
  137. Continuous Accessibility · · , ,
  138. Balancing Users’ Data Privacy and the User Experience · · ,
  139. Balancing Users’ Needs and Business Goals in UX Design · · ,
  140. Can Web Developers Be Held Liable? · · ,
  141. Packaging and Selling a Node.js App · ·
  142. Why UX Testing Is Critical to Your Web Site’s Success · · ,
  143. Gatsby Headaches and How to Cure Them: I18N II · · ,
  144. Button Types · · ,
  145. Import Maps to Natively Import JavaScript Modules Using Bare Names · ·
  146. The New CSS · · , ,
  147. The Problem With Sticky Menus That Appear on Scroll and What to Do Instead · · , ,
  148. How to Clean Up Your Local Repository With Git Commands · · , , ,
  149. It’s Time for Dimensional Thinking in Design · · ,
  150. IndexedDB Tutorial for Beginners: A Comprehensive Guide with Coding Examples · · , , , ,
  151. TypeScript 5.2’s New Keyword: “using” · ·
  152. The Five Types of People Who Produce Inaccessible Code · · ,
  153. Standardising Design Tokens · · ,
  154. Create React UI Lib: Component Library Speedrun · · , , ,
  155. Scoping · · ,
  156. Creating Scroll-Triggered Animations by Combining Scroll-Driven Animations, Custom Properties, Style Queries, and Transitions · · , , , , ,
  157. 6 Quick Tests You Can Do to Test Your Forms for Accessibility · · , ,
  158. The Next Phase of Eleventy: Return of the Side Project · ·
  159. What’s UnAI-Able · ·
  160. What Are Deceptive Patterns? · · ,
  161. An Explosion in Software Engineers Using AI Coding Tools? · · , ,
  162. A Guide to Coding Standards to Improve Code Quality · · , , , ,
  163. How to Add a CSS Reveal Animation to Your Images · · , , ,
  164. Top 10 Things You Should Add While Coding: Valuable Tips for Programmers · · ,
  165. Using Color Wheel Combinations in Your Designs · · ,
  166. Cyclic Dependency Space Toggles · · ,
  167. How (and Should?) We Stop the Infinite Scroll · · ,
  168. npm Won’t Publish Packages Containing the Word “keygen” · · , ,
  169. How to Build Server-Side Rendered (SSR) Svelte Apps With SvelteKit · · , , , ,
  170. Puppeteer in Node.js: More Antipatterns to Avoid · · , , , ,
  171. Design vs. Accessibility and the CSS “visually-hidden” Class · · , , ,
  172. Rebuilding a Comment Component With Modern CSS · · , ,
  173. The Gotchas of CSS Nesting · · ,
  174. When and Why to Use a Click Test · · ,
  175. Nuxt in 100 Seconds · · , ,
  176. Tuesday June 20 2023 Security Releases · · , ,
  177. Positioning Anchored Popovers · · ,
  178. Chrome for Testing: Reliable Downloads for Browser Automation · · , , ,
  179. Gatsby Headaches and How to Cure Them: I18N · · ,
  180. Blur Vignette Effect in CSS · · ,
  181. Naming Components · · , ,
  182. “margin-trim” as a Best Practice? · ·
  183. CSS! CSS! CSS! · · ,
  184. The Continuing Tragedy of CSS: Thoughts from CSS Day 2023 · · ,
  185. How to Highlight Required and Optional Form Fields · · , , ,
  186. Bottom Sheets: Definition and UX Guidelines · · , , ,
  187. You Can Stop Using “user-scalable=no” and “maximum-scale=1” in Viewport Meta Tags Now · · , , ,
  188. Design Under Constraints: Challenges, Opportunities, and Practical Strategies · · ,
  189. Modern CSS for Dynamic Component-Based Architecture · · , ,
  190. Shining Light on the Shadow DOM · · , ,
  191. That’s Not How I Wrote CSS Three Years Ago · · , ,
  192. Best Animation Libraries for React · · , , ,
  193. Liven Up Your Websites With Scroll-Driven Animations and View Transitions · · , , , ,
  194. CSS Containers, What Do They Know? · · , ,
  195. Internet Explorer: The 1st Browser to Support CSS · · , , , , , ,
  196. State of the CSS Community · · , ,
  197. The CSS “overscroll‑behavior” Property Can Be Used to Disable Default Browser Gestures · · ,
  198. Sticky Content: Focus in View · · , , ,
  199. No, “AI” Will Not Fix Accessibility · · ,
  200. Style Recalculation Secrets They Don’t Want You to Know · · , , ,
  201. The Universal Focus State · · , ,
  202. Why Doesn’t CSS Have Scope? · · , ,
  203. Must Know JavaScript API—IndexedDB API · · , , ,
  204. 48 Laws, Rules, and Principles of Web Development · · , ,
  205. Are Simple Websites Better for Business? · · ,
  206. Chrome DevTools Tips: Styles Pane and Elements Panel · · , , , ,
  207. Designing a Scalable Backend in Node.js · · , ,
  208. Before Your Next Frontend Pull Request, Use This Checklist · · , , , , , ,
  209. Best Practices for Container Queries · · , ,
  210. Testing Sites and Apps With Blind Users: A Cheat Sheet · · , , , , , ,
  211. Assume the Position—a Labelling Story · · , ,
  212. What’s New in CSS · · , ,
  213. Modern CSS in Real Life · ·
  214. Accessible Rich Internet Applications (WAI-ARIA) 1.2 · · , ,
  215. Be Careful With “ch” Units · · ,
  216. Reducing Complexity in Front End Development · · , , ,
  217. Styling Scrollbars · · ,
  218. Exploring Universal and Cognitive-Friendly UX Design Through Pivot Tables and Grids · · ,
  219. RSC from Scratch: Server Components · · , ,
  220. Angular at Google I/O 2023 · · , ,
  221. Tokens Are the Most Valuable Artifact a Design System Can Provide · · ,
  222. The Ultimate Guide to Writing Technical Blog Posts · · , ,
  223. Accessibility and Artificial Intelligence · · ,
  224. Primitive Objects in JavaScript: When to Use Them · · ,
  225. Accessibility Testing—Pay Attention to the Details · · ,
  226. An Introduction to Debugging in Node.js · · , ,
  227. Is React Having An Angular.js Moment? · · ,
  228. One More Thing—Apple’s Push on Web Apps on macOS · · ,
  229. The Problem With Automatically Focusing the First Input and What to Do Instead · · , , ,
  230. New Job? Negotiate as If Your Life Depends on It · ·
  231. How to Detect Unnecessary Renderings of DOM Elements in Your Web App to Improve Performance · · , , , , ,
  232. No Single Metric Captures Productivity · · ,
  233. wasmati: You Should Write Your WebAssembly in TypeScript · · , ,
  234. Every Design Team Needs Writers · · ,
  235. How Chrome Achieved High Scores on Three Browser Benchmarks · · , , ,
  236. WCAG 2.2 Misses Mark on Defining Visible Focus · · , , ,
  237. The Many Ways to Select the n-th Character from a String · ·
  238. How AI Can Make Software More Intuitive · · ,
  239. Do Not Drop Sass for CSS · · , ,
  240. New CSS Color Spaces and Functions in All Major Engines · · , , , ,
  241. An Introduction to “@ scope” in CSS · · , ,
  242. How We Created an Accessible, Scalable Color Palette · · , , , ,
  243. Announcing TypeScript 5.1 · · ,
  244. Asynchronous JavaScript for Beginners · ·
  245. The Context Dilemma · · ,
  246. Watch Transitions in Slow Motion in Chrome’s DevTools · · , , , ,
  247. Accessible Components: The Hamburger Menu · · , ,
  248. Why We Should Stop Using JavaScript According to Douglas Crockford · · ,
  249. Semantic Code in HTML: What Is It and Does It Still Matter? · · ,
  250. Performance Is Not a Checklist · · , ,