Frontend Dogma

News and Views in Frontend Development (6)

Articles and books, tips and tricks, craft and beauty from the world of frontend development. Explore all topics. Stay informed per feed and on Twitter.

  1. Why Are Hyperlinks Blue? (tweet) · · ,
  2. Small Wins for Accessibility and Resilience (tweet) · · ,
  3. Named and Framed (tweet) · · ,
  4. How to Use “Promise.any()” (tweet) · ·
  5. Getting Started with CSS Animations (tweet) · · ,
  6. jsc: My New Best Friend (tweet) · · ,
  7. Flexbox or CSS Grid? How to Make Layout Decisions That Make Sense (tweet) · · , ,
  8. Embracing Asymmetrical Design and Overcoming the Harmful Effects of “text-overflow: ellipsis” in CSS (tweet) · · ,
  9. Scrollbar Reflowing (tweet) · · ,
  10. Key Data Structures and Their Roles in RenderingNG (tweet) · · , ,
  11. 8 Fundamental Principles of Effective Web Design (tweet) · ·
  12. HTTP/3: Performance Improvements (tweet) · · , ,
  13. 5 Ways to Undo Mistakes with Git (tweet) · ·
  14. 4 Important Differences Between Regular and Arrow Functions (tweet) · · ,
  15. Using the Platform (tweet) · · , ,
  16. How I Experience Web Today (tweet) · · ,
  17. 6 CSS Shorthand Properties to Improve Your Web Application (tweet) · ·
  18. Bootstrapping a Node.js TypeScript API: Routing, Middleware, and Custom Types and Errors Modules (tweet) · · , , , , ,
  19. What’s on the Menu? (tweet) · · ,
  20. UI Cheat Sheet: Spacing Friendships (tweet) · · , ,
  21. I Give You Feedback on Your Blog Post Draft But You Don’t Send It to Me (tweet) · ·
  22. How to Calculate REMs from Pixels (tweet) · ·
  23. Accessibility from the Ground Up (tweet) · ·
  24. Web Accessibility Checklist (tweet) · · , ,
  25. Truthy and Falsy: When All Is Not Equal in JavaScript (tweet) · ·
  26. Top 9 Lessons Learned in 12 Years as a Software Developer (tweet) · · ,
  27. I Tried Angular as a React Developer: Here Are 6 Things I Like About It (tweet) · · , ,
  28. One Favicon to Rule Them All (tweet) · · , ,
  29. Building the Same App 5 Times (tweet) · · , , , , ,
  30. What’s New in Bootstrap 5 (tweet) · · ,
  31. Using CSS Module Scripts to Import Stylesheets (tweet) · · , ,
  32. State Management in Svelte Applications (tweet) · · ,
  33. Level Up Your CSS Linting Using Stylelint (tweet) · · , ,
  34. ARIA Spec for the Uninitiated (tweet) · · , ,
  35. CSS Grid Tooling in DevTools (tweet) · · , , ,
  36. You Don’t Know “useEffect” (tweet) · ·
  37. Practical Uses of CSS Math Functions: “calc”, “clamp”, “min”, “max” (tweet) · ·
  38. Does Shadow DOM Improve Style Performance? (tweet) · · , ,
  39. Reviewing a Design for Accessibility (tweet) · · , ,
  40. Decoding AVIF: Deep Dive with Cats and imgproxy (tweet) · · ,
  41. Big O, Code Efficiency Analysis (tweet) · · ,
  42. A Guide to Designing Accessible, WCAG-Compliant Focus Indicators (tweet) · · , , ,
  43. Breaking the Web Forward (tweet) · · ,
  44. Static vs. Dynamic vs. Jamstack: Where’s the Line? (tweet) · · ,
  45. How to Test for Accessibility with Users at Every Design Stage (tweet) · · ,
  46. CSS “accent-color” (tweet) · ·
  47. Accessible Design Systems: Look Good While Doing Good (tweet) · · ,
  48. The State of Mobile First and Desktop First (tweet) · · , ,
  49. The Complete Guide to HTML Forms and Constraint Validation (tweet) · · , , ,
  50. “return await promise” vs. “return promise” in JavaScript (tweet) · · ,
  51. Principles by Design (tweet) · · ,
  52. “<Lazy>” Rendering in Vue to Improve Performance (tweet) · · ,
  53. Adding 100 Underline/Overlay Animations: The Impressive CSS Collection (tweet) · · ,
  54. Accessible Contrast Ratios and A-Levels Explained (tweet) · · , ,
  55. The World of CSS Transforms (tweet) · ·
  56. JavaScript Development: Making a Web Worker Optional (tweet) · · ,
  57. HTTP/3 from A to Z: Core Concepts (tweet) · · , ,
  58. How Writing Can Advance Your Career as a Developer (tweet) · · ,
  59. Google vs. the Web (tweet) · · , ,
  60. Exploring the CSS Paint API: Image Fragmentation Effect (tweet) · · , , ,
  61. A Performance-Focused Workflow Based on Google Tools (tweet) · · , , ,
  62. Uploading Multiple Files with Fetch (tweet) · ·
  63. Next-Level List Bullets with CSS “::marker” (tweet) · · ,
  64. On the “<dl>” (tweet) · ·
  65. Browsers and Representation (tweet) · · ,
  66. Why Are We Talking So Much About Design Leadership? (tweet) · · ,
  67. Visualizing a Codebase (tweet) · ·
  68. Sustainable Web Design, an Excerpt (tweet) · · ,
  69. Inclusive Usability Testing: The Benefits of Inclusive Design (tweet) · · , ,
  70. A Guide to Accessible Digital UX Design (tweet) · · , , ,
  71. Writing Great Alt Text: Emotion Matters (tweet) · · , ,
  72. What Are Accessibility Overlays Good For? (tweet) · ·
  73. Using CSS Shapes for Interesting User Controls and Navigation (tweet) · ·
  74. Refresher on JavaScript Callbacks and Promises (tweet) · ·
  75. React Children and Iteration Methods (tweet) · ·
  76. CSS Nesting, Specificity, and You (tweet) · · ,
  77. Accessibility Testing with Storybook (tweet) · · , ,
  78. What Devs Need (tweet) · · ,
  79. Web Accessibility Myths: Debunking 7 Common Misconceptions (tweet) · · ,
  80. Using “localStorage” with React Hooks (tweet) · · ,
  81. How to Use “Promise.allSettled()” (tweet) · ·
  82. How to Build Resilient JavaScript UIs (tweet) · · ,
  83. Building the Perfect GitHub CI Workflow for Your Frontend Team (tweet) · · ,
  84. A Deep Dive on Skipping to Content (tweet) · · , ,
  85. The (Most Comprehensive) JavaScript Design Principles Guide (tweet) · · , ,
  86. Refactoring CSS: Strategy, Regression Testing, and Maintenance (tweet) · · , , , ,
  87. Mitigating User Errors (tweet) · · ,
  88. How We Reduced Next.js Page Size by 3.5× and Achieved a 98 Lighthouse Score (tweet) · · ,
  89. 2021 Scroll Survey Report (tweet) · · , ,
  90. Why It’s Okay for Web Components to Use Frameworks (tweet) · · ,
  91. Chrome DevTools: Better Accessibility Inspection with the Source Order Viewer (tweet) · · , , ,
  92. Avoid the Most Common 18 Mistakes to Make Your UI/UX Design Better (tweet) · · ,
  93. 101 Digital Accessibility Tips and Tricks (tweet) · · , ,
  94. There Is No Such Thing as a CSS Absolute Unit (tweet) · ·
  95. Optimizing Your Own Performance as a Designer (tweet) · · ,
  96. How to Stay Focused as a Self-Taught Frontend Web Developer (tweet) · · ,
  97. CSS Architecture and Performance in Micro Frontends (tweet) · · , , ,
  98. Best Practices for Tags and Tag Managers (tweet) · · , ,
  99. 5 Git Tips to Level Up Your Workflow (tweet) · · ,
  100. Using Absolute Value, Sign, Rounding, and Modulo in CSS Today (tweet) · ·
  101. Safari Isn’t Protecting the Web, It’s Killing It (tweet) · · ,
  102. Learnings from a WebPageTest Session on CSS-Tricks (tweet) · ·
  103. How to Hand Off Accessible Designs to Developers? (tweet) · · ,
  104. Creating an Accessible Dialog from Scratch (tweet) · ·
  105. Architecting and Scaffolding a TypeScript and Express API (tweet) · · , ,
  106. When You Cannot Run Away from Using Tables on Mobile (tweet) · · ,
  107. Thinking About the Cut-Out Effect: CSS or SVG? (tweet) · · , , ,
  108. Is It Time to Ditch the Design Grid? (tweet) · · ,
  109. Global vs. Local Styling in Next.js (tweet) · · , ,
  110. CSS Logical Properties and Values (tweet) · · ,
  111. UX Principles That Include Cognitive Accessibility (tweet) · · , ,
  112. Takeaways from the 2021 State of Digital Accessibility Report (tweet) · · ,
  113. Overview of the RenderingNG Architecture (tweet) · · , ,
  114. My First CSS—What I Wish I Knew About CSS When Starting Out as a Frontender (tweet) · · ,
  115. Getting Started with React “useContext” Hook and React Context (tweet) · ·
  116. Accessible Design from the Get-Go (tweet) · · ,
  117. You Don’t Need React for Building Websites (tweet) · · ,
  118. It Is Time to Ditch the Title “Evangelist” from Accessibility (tweet) · · ,
  119. Four Factors in UX Maturity (tweet) · · ,
  120. Complete Introduction to CSS Flexbox (tweet) · · ,
  121. Break HTML Content into Newspaper-Like Columns Using Pure CSS (tweet) · · ,
  122. 5 UI Tips to Become a Better Front-End Developer (tweet) · · , ,
  123. How to Eliminate Render-Blocking Resources: a Deep Dive (tweet) · · ,
  124. Accessibility Strategy for Product Management (tweet) · · ,
  125. What We Learned About Accessibility by Scanning More Than 2 Million Federal .gov Web Pages (tweet) · ·
  126. Using Google Drive as a CMS (tweet) · · ,
  127. The Vanishing Designer (tweet) · · , ,
  128. Why the WCAG Colour Contrast Ratio Doesn’t Always Seem to Work (tweet) · · , , ,
  129. Simple Monorepos Via npm Workspaces and TypeScript Project References (tweet) · · , ,
  130. Definition of Done vs. Acceptance Criteria (tweet) · · , , ,
  131. Custom Properties and “@property” (tweet) · · ,
  132. The Accessibility Stalemate (tweet) · · ,
  133. From a Colourblind Designer to the World: Please Stop Using Red and Green Together (tweet) · · ,
  134. A Visual Guide to React Rendering—It Always Re-Renders (tweet) · · ,
  135. The Ultimate Cheat Sheet List for Web Developers (tweet) · · , , ,
  136. Practical Use Cases for Scroll-Linked Animations in CSS with Scroll Timelines (tweet) · · ,
  137. Maintaining End-to-End Quality with Visual Testing (tweet) · · , ,
  138. Journey of a Web Page—How Browsers Work (tweet) · · , ,
  139. An Introduction to Frameworkless Web Components (tweet) · · , ,
  140. 6 Useful Frontend Techniques That You May Not Know About (tweet) · · , , ,
  141. Designing for Information Density (tweet) · ·
  142. What I Learned from “Software Engineering at Google” (tweet) · · , ,
  143. The State of Developer Ecosystem 2021 (tweet) · · ,
  144. Accessibility of the “Section” Element (tweet) · · ,
  145. What Is Tree Shaking? (tweet) · · ,
  146. There’s No Such Thing as Fully Automated Web Accessibility (tweet) · · ,
  147. The Performance Effects of Too Much Lazy-Loading (tweet) · · ,
  148. How to Get a Pixel-Perfect, Linearly Scaled UI (tweet) · · , ,
  149. Hobson’s Browser—How Apple, Facebook, and Google Broke the Mobile Browser Market by Silently Undermining User Choice (tweet) · · ,
  150. For Developers, Apple’s Safari Is Crap and Outdated (tweet) · · ,
  151. Designing for the Unexpected (tweet) · · , ,
  152. Content Accessibility Fact Sheet (tweet) · · ,
  153. The Ultimate Guide to Browser-Side Storage (tweet) · · , , ,
  154. The Most Important Lessons I’ve Learned from Senior Software Engineers (tweet) · ·
  155. What’s the Difference Between the Alignment Values of “start”, “flex-start”, and “self-start”? (tweet) · ·
  156. The 3-Second Frontend Developer Test (tweet) · · , , ,
  157. I’m Changing How I Review Code (tweet) · · , ,
  158. Build Complex CSS Transitions Using Custom Properties and “cubic-bezier()” (tweet) · · , , ,
  159. Angular Is Costing Companies Billions (tweet) · · ,
  160. How to Migrate from jQuery to Next.js (tweet) · · , ,
  161. Detecting Media Query Support in CSS and JavaScript (tweet) · · , , ,
  162. What People Should Know Before Writing Articles or Creating Products About Accessibility (tweet) · · , ,
  163. TypeScript Interfaces: A Quick Guide to Help You Get Started (tweet) · · ,
  164. Refactoring CSS: Introduction (tweet) · · , ,
  165. Gridless Design (tweet) · · , ,
  166. Image Descriptions: A Human Technique That Robots Can’t Grasp (tweet) · · , ,
  167. How to Convert Arrays to Human-Readable Lists in JavaScript (tweet) · · , ,
  168. Freelance React Developer Checklist (tweet) · · ,
  169. The Document Outline (tweet) · · ,
  170. Making a Strong Case for Accessibility (tweet) · · ,
  171. The Numeric Colour Palettes in Modern Web Frameworks Explained (tweet) · · ,
  172. The Large, Small, and Dynamic Viewports (tweet) · · , ,
  173. Performance Design: The Illusion of Speed (tweet) · · ,
  174. Creating Accessible CSS Art (tweet) · · , ,
  175. TypeScript and Native ESM on Node.js (tweet) · · , ,
  176. Five Ways to Include D/Deaf Users in Your Designs (tweet) · · ,
  177. ARIA in HTML (tweet) · · , ,
  178. The Dilemma of Naming Font Size Variables (tweet) · · , ,
  179. How to Use “Promise.all()” (tweet) · ·
  180. How Does Node.js Load Its Built-In/Native Modules? (tweet) · · , ,
  181. Accessibility and Inclusivity: Distinctions in Experience Design (tweet) · · , ,
  182. Using HSL Colors in CSS (tweet) · · ,
  183. Feature Checklists Are Not Enough: How to Avoid Making Bad Software (tweet) · · , , ,
  184. Basics of JavaScript Test Driven Development (TDD) with Jest (tweet) · · , ,
  185. Where Did This Interaction Come From?—A Brief History of Interaction Design (tweet) · · , ,
  186. “export default thing” Is Different to “export { thing as default }” (tweet) · ·
  187. Short Note on Skip Links with Sticky Headers (tweet) · · ,
  188. Evaluating Color and Contrast—How Hard Can It Be? (tweet) · · , ,
  189. Towards Richer Colors on the Web (tweet) · · ,
  190. It’s a (Front-End Testing) Trap! Six Common Testing Pitfalls and How to Solve Them (tweet) · · ,
  191. Accessibility and SEO (tweet) · · , ,
  192. When a Click Is Not Just a Click (tweet) · ·
  193. The State of Web Workers in 2021 (tweet) · · ,
  194. The Internet Is Rotting (tweet) · · ,
  195. How We Built React Components for Any Front End (tweet) · · ,
  196. Encoding Data for POST Requests (tweet) · · ,
  197. Detecting Hover-Capable Devices (tweet) · ·
  198. 9 Tips to Help You Ace a Whiteboard Interview (tweet) · · , ,
  199. 10 Figma Best Practices to 10× Your Workflow (tweet) · · , , ,
  200. Use the “i” Element, and Use It Appropriately (tweet) · · ,