Frontend Dogma

News and Tools for Frontend Development (18)

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

  1. Deploy Your First Website Without Leaving Your IDE · ·
  2. Non-Interactive Elements With the “inert” Attribute · · ,
  3. What Is Memoization? How and When to Memoize in JavaScript and React · · , ,
  4. 11 Steps to Keep Figma Clean · · , ,
  5. 16 Top Design Trends for 2022 · · ,
  6. 8 Ways to Make Website Accessibility Easier (and Less Expensive) · ·
  7. 9 Useful Principles of UX Design · · , ,
  8. Four Eras of JavaScript Frameworks · · , ,
  9. Testing Figma Components · · , ,
  10. The “Dark Yellow Problem” in Design System Color Palettes · · , ,
  11. Deep Dive into Top Web Developer Pain Points · ·
  12. Supercharge Your Design System With Design Tokens · · ,
  13. Mobile App Versus Web Site: Which Is Better for Your Business? · · , ,
  14. Build a Lightweight Web Component With Lit.js · · ,
  15. How Web Browsers Work: Parsing the HTML · · , ,
  16. Atomic Design 2022: What We Can Learn from Eames and Other Design Giants · ·
  17. Best Font for Online Reading: No Single Answer · · , , ,
  18. Writing Strong Front-End Test Element Locators · ·
  19. Progressive Enhancement and HTML Forms: Use “FormData” · · , ,
  20. How Web Browsers Work: Navigation · · ,
  21. Why Your CSS Is Always Messy and Chaotic—Understanding CSS Complexity · · ,
  22. Building a Combined CSS Aspect Ratio Grid · · ,
  23. Web Color Is Still Broken · · , ,
  24. Mastering CSS Transitions With React 18 · · , ,
  25. TypeScript Tips and Tricks · · , ,
  26. 11 Breadcrumb SEO Best Practices for a Mobile-First Strategy · · , , ,
  27. Beyond WCAG: Losing Spoons Online · · , ,
  28. Brief Note on Buttons, Enter, and Space · ·
  29. Why Learn to Code? 17 Benefits of Learning to Code · · ,
  30. The Future of CSS: CSS Toggles · ·
  31. Debugging Node Serverless Functions on AWS Lambda · · , , , ,
  32. Faster Initialization of Instances With New Class Features · · , , ,
  33. Productivity Tips and Tools for a More Efficient Workflow · · , , ,
  34. Ordering CSS Declarations · · ,
  35. The Front-End Developer’s Guide to the Terminal · · ,
  36. The Role of Policy in Creating a Culture of Accessibility · · , , ,
  37. Routing: I’m Not Smart Enough for an SPA · · ,
  38. How to Start Testing Your Website With a Screen Reader · · , , ,
  39. Forced Colors Explained: A Practical Guide · · ,
  40. 4 Reasons to Avoid Using “npm link” · ·
  41. A Practical Guide to Centering in CSS · · , ,
  42. Does Valid and Semantic HTML Still Matter? · · , , ,
  43. The Ultimate Guide to Push Notifications for Developers · · ,
  44. Web Scraping Is Legal, U.S. Appeals Court Reaffirms · · ,
  45. When UX Goes Bad (and How to Fix It) · ·
  46. 20 Easy Ways to Be More Productive as a Developer · ·
  47. React 18—New Features and Improvement Strategies · ·
  48. Ensure Third Party Content Is Accessible · · , ,
  49. Test-Driven Development With React and Redux: Thunk, Slices, and Requests Mocking · · , ,
  50. Node.js 18 Introduces Prefix-Only Core Modules · ·
  51. Is Agile an Anti-Design Pattern? · · , ,
  52. The Most Popular Node.js Frameworks in 2022 · · ,
  53. Accessibility Why You Need to Work Toward Progress Not Perfection · ·
  54. Evaluating Design System Adoption Using Custom CSS · · , , ,
  55. Fonts for the Web: Rationale, 1996 · · ,
  56. Intro to CSS Parent Selector—“:has()” · · , , ,
  57. Implementing Micro-Frontends: A Path to Evolve Legacy Codebases · · , ,
  58. 7 Web Component Tricks · · ,
  59. A Web Renaissance · ·
  60. CSS Parent Selector · · ,
  61. Designers Are Spending Too Much Time Designing UI Variations Manually · · , ,
  62. The Ultimate Guide to Optimizing JavaScript for Quick Page Loads · · , , ,
  63. Drastically Improve Your UI Designs With This Technique · · , ,
  64. How to Write Good Code: 10 Beginner-Friendly Techniques for Instant Results · · , ,
  65. Title Rewrites: 3 Patterns to Avoid · · , , ,
  66. Usability Guidelines for Better Carousels UX · · , , ,
  67. Building a Dialog Component · · , , , ,
  68. Common Accessibility Issues That You Can Fix Today · ·
  69. Does Your Website Have Any of These 10 Most-Cited Accessibility Issues? · ·
  70. Naming Colors in Design Systems · · , ,
  71. One Million Broken Web Sites—and a Way to Prevent That · · , ,
  72. Why Accessibility Bugs Are a Good Thing and How to Handle Them · · ,
  73. 7 Collaborative Coding Tools for Remote Pair Programming · · ,
  74. Common App Design Challenges and Their Solutions · · ,
  75. Mobile-First Ecommerce Site Design Is the Future · · ,
  76. Those HTML Elements You Never Use · · ,
  77. How to Develop Your UX Design Philosophy · · , ,
  78. How to Improve UX Design Through A/B Testing · · , , , ,
  79. Childish Font Sizes · · , ,
  80. Image Borders in CSS · · , ,
  81. CSS Toggles Explainer and Proposal · ·
  82. Takeaways from The Internet Is Unusable: The Disabled View · ·
  83. CSS “:has()” a Parent Selector Now · · ,
  84. Open Accessibility Standards · · , , ,
  85. Information Architecture: Study Guide · · , , ,
  86. How to Fix Your Low-Contrast Text · · , , ,
  87. JavaScript Function Composition: What’s the Big Deal? · · ,
  88. CSS Tips and Tricks You May Need to Know · · ,
  89. There’s No Such Thing as a “Design System Designer” · · , ,
  90. 33 JavaScript Concepts Every Developer Should Know · · ,
  91. Incremental Static Regeneration for Angular · · ,
  92. MIME Types · · , , ,
  93. April 9 Is CSS Naked Day · · , ,
  94. Dynamic Data-Fetching in an Authenticated Next.js App · · , ,
  95. Nailing Your Engineering Interviews: Tips from a Technical Recruiter · · ,
  96. Use Unicode Characters for Bullet Points in CSS Using “::marker” · · ,
  97. Why Your Design System Needs Content Design · · ,
  98. Your Website Is a Pollution Machine · ·
  99. JavaScript and Node.js Testing Best Practices · · , , ,
  100. Principles of Object-Oriented Programming in TypeScript · · ,
  101. Designing Better Breadcrumbs · · , ,
  102. How to Create Animated Anchor Links Using CSS · · , , , ,
  103. 12 Years Beyond a HTML Joke · · ,
  104. A New Statistical Approach for Predicting Usability Problems · · , ,
  105. Core Web Vitals: Finding Common Ground Between SEOs and Developers · · , , ,
  106. Fonts in Use: Variable Fonts · · ,
  107. The Business Case for Accessibility · · ,
  108. Sharing State in Distributed UIs at Runtime · · , ,
  109. Animated Grid Tracks With “:has()” · · , ,
  110. Alternative Text (Alt Text) · · , , ,
  111. HTML Is All You Need to Make a Website · ·
  112. A Simple Way to Create a Slideshow Using Pure CSS · · , ,
  113. Accessible Description Exposure · · ,
  114. Thoughts on Exerting Control With Media Queries · · , ,
  115. What If… One Day Everything Got Better? · ·
  116. “aria-labelledby” Usage Notes · · , ,
  117. Tweaking in the Browser · · ,
  118. How to Respond to Growing Supply Chain Security Risks? · · , , , ,
  119. Accessible Cards · · , ,
  120. Top 3 Informational Interview Questions in UX · · , , ,
  121. Are You Using Coding Interviews for Senior Software Developers? · · , ,
  122. Why We Don’t Use a Staging Environment · · ,
  123. The WebAIM Million: The 2022 Report on the Accessibility of the Top 1,000,000 Home Pages · · ,
  124. Exciting Times for Browsers (and CSS) · · ,
  125. How to Match HTML Elements With an Indeterminate State · · , , ,
  126. Accessibility Policy Implementation: What You Need to Know · · , ,
  127. Web Accessibility Guidance Project · · ,
  128. Introduction to the SSH Protocol · · , ,
  129. Designing a Better Infinite Scroll · · , ,
  130. If We Can Make a Product Work for Anyone, It Usually Works Better for Everyone · · ,
  131. Neubrutalism Is Taking Over the Web · · ,
  132. Make Beautifully Resilient Apps With Progressive Enhancement · ·
  133. How to Optimize Your LCP (with Visuals) · · , , ,
  134. HTML-Only Keyboard Shortcuts · · , ,
  135. 7 Learning Habits for Developers: Reach Skill Goals in Less Time · ·
  136. A Guide to Hover and Pointer Media Queries · · , ,
  137. An Opinionated Guide to Unit Testing · · , ,
  138. Case: Accessibility in Software Development · ·
  139. CSS “:has” · · ,
  140. Locale Aware Sorting in JavaScript · · , , ,
  141. Optimising Largest Contentful Paint · · ,
  142. Secret Mechanisms of CSS · · ,
  143. Understanding Layout Algorithms · · ,
  144. Picture Perfect Images With the Modern “<img>” Element · · , , ,
  145. How to Document Accessibility Issues · · , ,
  146. The Art of CSS Art · · ,
  147. Why Every Programmer Must Blog · · , , ,
  148. 14 Linting Rules to Help You Write Asynchronous Code in JavaScript · · ,
  149. Building a Headless Design System · · , ,
  150. Quick Survey: Help Improve the Simulation Options of Browser Developer Tools · · , , ,
  151. Remix Routes Demystified · · ,
  152. You ≠ User · · , ,
  153. You’re Unselectable · · ,
  154. How to Use Props in React · · , ,
  155. Designing “Above the Fold”? Try the Reciprocity Principle · · ,
  156. How Should You Name Your Colors in a Design System? · · , ,
  157. Variable Fonts in Real Life: How to Use and Love Them · · ,
  158. Speed Needs Design, or: You Can’t Delight Users You’ve Annoyed · · , ,
  159. How Do Design Systems Improve Developer Efficiency? · · ,
  160. Spotlight: What Happens When a Project Team Shifts Accessibility Left? · ·
  161. The 5 Riders of Accessible Media · · ,
  162. The Web Is for Everyone: Our Vision for the Evolution of the Web · · , , , , , ,
  163. There Are No Bad Questions in Accessibility · ·
  164. Resetting Inherited CSS With “Revert” · · ,
  165. Those HTML Attributes You Never Use · ·
  166. ADA Web Site Compliance Still Not a Thing · · , ,
  167. Deep Dive into the CSS “:where()” Function · · ,
  168. Dynamically Generated Content and Accessibility: 3 Quick Tips · · ,
  169. Optimising Core Web Vitals on SPAs · · , , ,
  170. The Book on Accessibility · · , ,
  171. When to Use a Function Expression vs. Function Declaration · · , ,
  172. 4 Xs That Aren’t UX · ·
  173. Design System—Principles of Success · · ,
  174. Design Systems Aren’t Cheap · · , ,
  175. HTML Semantics · · ,
  176. Improving Your User Experience to Reduce Bounce Rates · · , , ,
  177. Usability Testing: Driving the Best User Experience for Business Success · · , ,
  178. Write HTML, the HTML Way (Not the XHTML Way) · · ,
  179. Windows High Contrast Mode, Forced Colors Mode, and CSS Custom Properties · · , , ,
  180. Design Mistakes That Hurt Your Web Site’s Conversion Rates · · , , ,
  181. “!important” Was Added for One Reason Only · · ,
  182. Do’s and Don’ts of Mobile UX Design · · , , ,
  183. Conquering JavaScript Hydration · · ,
  184. Should “Cancel” Be a Button or a Link? · · , , ,
  185. Authorization in a Microservices World · · ,
  186. UX Strategy: Definition and Components · · ,
  187. How to Use CSS Math Functions: “calc”, “min”, “max”, “clamp” · · , , ,
  188. Typography in Design Tokens for Figma and Code · · , , ,
  189. Why Is Dark Mode So Captivating? · ·
  190. The Web Doesn’t Have Version Numbers · · ,
  191. Performance Tests on Common JavaScript Array Methods · · , , ,
  192. Identifying Fonts: The Complete Guide · · , ,
  193. Migrating Our Monorepo to Yarn 2 · · , ,
  194. Optimizing SVG Patterns to Their Smallest Size · · ,
  195. The Impact That High Quality Mark-Up Can Have on Accessibility, Performance, and Discoverability · · , , ,
  196. 4 Accessibility Mistakes Plaguing Most Government Websites · · ,
  197. Guidance on Web Accessibility and the ADA · · ,
  198. How Do I Resolve Merge Conflicts? · · , ,
  199. How to Make a Drag-and-Drop File Uploader With Vue.js 3 · · , , ,
  200. Google Calendar Webhooks With Node.js · · , ,
  201. The Future of the Web and Accessibility · · , ,
  202. Accessibility, Assistive Technology, and JavaScript · · , ,
  203. What Makes You a Professional Web Developer · ·
  204. A Designer’s Guide to Documenting Accessibility and User Interactions · · , , ,
  205. Perceptually Uniform Color Models and Their Implications · · ,
  206. A Quick Guide to Closures · · ,
  207. What Every Good README Should Contain · ·
  208. How to Empathize With Your Users · · , , ,
  209. How to Prep Your SEO Strategy for a New Website · · , ,
  210. Building a Loading Bar Component · · , , ,
  211. Don’t Believe the Type! · · , , , ,
  212. What Are Micro-Frontends? · ·
  213. Making the World’s Fastest Website, and Other Mistakes · · ,
  214. React Best Practices and Patterns to Reduce Code · · , ,
  215. Prevent Technical Debt With These 3 Strategies · ·
  216. How to Automatically Size a Textarea Based on Its [Text] Using Vanilla JavaScript · · , ,
  217. Implementing JavaScript Delay for Cookie Consent Banner · · , , ,
  218. The Weirdly Obscure Art of Streamed HTML · · , ,
  219. Aligning Content in Different Wrappers · · ,
  220. Tao of Node—Design, Architecture, and Best Practices · · , ,
  221. Update Node Dependencies Automatically, Selectively, or Incrementally · · , , ,
  222. When or If · ·
  223. It Needs to Map Back to a Role · · , , ,
  224. In Defense of Sass · · ,
  225. Explaining Micro Frontends as Simply as Possible · ·
  226. How to Use Spectator to Test Your Angular Components · · , , , ,
  227. Giving New Meanings to the Color Functions in CSS · · , ,
  228. 20 Productivity Tips from Developers to Developers · · ,
  229. The Future of Web Accessibility: WCAG 3.0 · · , ,
  230. Horizontal Scrolling Nav · · ,
  231. Where TypeScript Excels · · ,
  232. 42 Tips for Getting Good at DevOps and Life · · , ,
  233. Arrow Functions in JavaScript: How to Use Fat and Concise Syntax · · , ,
  234. Don’t Alienate Your User: A Primer for Internationalisation and Localisation · · , ,
  235. Ten Years of Page Bloat: What Have We Learned? · · , ,
  236. Accumulation of Tech Debt · ·
  237. Digging into CSS Media Queries · · , ,
  238. An Introduction to User Journey Maps · · , , ,
  239. You Don’t Always Need a CMS · ·
  240. Carousels: No One Likes You · · , , ,
  241. WebGPU—All of the Cores, None of the Canvas · · ,
  242. A Look at the Dialog Element’s Super Powers · · , ,
  243. Designing the User Experience of a Rating System · · ,
  244. JavaScript Naming Conflicts: How Existing Code Can Force Proposed Features to Be Renamed · · , ,
  245. Moderated Versus Unmoderated Usability Testing · · , ,
  246. Optimizing a Web Site for Google’s New UX Criteria · · , , ,
  247. Performance Signals for Customizing Website UX · · , , ,
  248. Using HTTPS in Your Development Environment · · , ,
  249. A New Speed Milestone for Chrome · · , , ,
  250. 10 Amazing Games to Learn CSS · · ,