Frontend Dogma

“how-tos” Archive

  1. How to Set Up a Node Server With TypeScript in 2024 · · , ,
  2. How to Fix the Invisible Scrollbar Issue in iOS Browsers · · , , ,
  3. How to Boost WordPress Security and Protect Your SEO Ranking · · , ,
  4. How to Create Rounded Gradient Borders With Any Background in CSS · · , , ,
  5. How to Favicon in 2024: Six Files That Fit Most Needs · · ,
  6. How to Get Started With Progressive Web Apps · · ,
  7. How to Get Good at Competitive Programming · ·
  8. How to Use Chrome’s Accessibility Tree · · , , ,
  9. How to Use the File System in Node.js · · , ,
  10. How to Avoid Breaking Web Pages for Keyboard Users · · ,
  11. How to Use Node.js With Docker · · ,
  12. How to Optimize MongoDB Performance for Node.js · · , ,
  13. How to Use Timeouts in Node.js · · ,
  14. How to Use npm Packages Outside of Node · · , ,
  15. How to Build a Server-Side React App Using Vite and Express · · , , ,
  16. How to Do a TypeScript Conversion · · , , , ,
  17. How to Use the Fetch API in Node.js, Deno, and Bun · · , , , , ,
  18. How to Write Good Alt Text for Screen Readers · · , , , ,
  19. Information vs. Experience: How to Build Mature Design Systems · · ,
  20. How to Find a Developer Job in 2023 (With Little or No Experience) · ·
  21. How to Map a Number Between Two Ranges · · ,
  22. How to Collaborate on Pull Requests for Beginners · · ,
  23. How to Animate Along a Path in CSS · · ,
  24. How to Use SEO to Build Long-Term Brand Recognition and Visibility · · ,
  25. How to Style Element Descendants With Tailwind CSS · ·
  26. How to Be an Accessibility Ally · · ,
  27. How to Make the Case for Design Systems · ·
  28. How to Escape CSS Selectors in JavaScript · · , , ,
  29. How to Build Trust With Others by Organizing Your Figma Files · · , ,
  30. How to Make Forms in Angular Reusable · · , , ,
  31. How to Use the New “<search>” Element With WordPress · · ,
  32. How to Make a Strong Case for Accessibility · · ,
  33. How to Make Charts and Graphs More Accessible · · , ,
  34. How to Implement SSL/TLS Pinning in Node.js · · , , ,
  35. How to Get 12% More LinkedIn Followers, Impressions, and Clicks—Practical Accessibility Tips and Tricks · · , , ,
  36. How to Make an Impact as a Developer Advocate · · ,
  37. How to Use Headless Chrome in Serverless Functions With a 50 MB Limit · · , , , , ,
  38. How to Use the CSS “gap” Property · · ,
  39. How to Test Mobile Apps on a Real Device Cloud · · ,
  40. How to Improve Performance of Your Database by Indexing Large Tables · · , ,
  41. How to Use the CSS Grid “repeat()” Function · · , ,
  42. How to Earn High-Authority Links That Drive Rankings · · ,
  43. How to Define an Array of Colors With CSS · · , ,
  44. How to Make Your Captions and Audio Descriptions WCAG-Compliant · · , , , ,
  45. How to Use CSS “aspect-ratio” · ·
  46. How to Use CSS “object-fit” and “object-position” · · ,
  47. How to Build and Deploy a Modern Day Next.js Application · · , ,
  48. How to Use Your Intuition in Your Product Design Process · · , ,
  49. ARIA Can Hurt or Help Web Accessibility: How to Review Your Website’s ARIA · · , ,
  50. How to Prevent Unnecessary React Component Re-Rendering · · , ,
  51. How to Improve the Release Frequency of Your Team? · · , , ,
  52. How to Validate HTML On-Line at W3C · · , ,
  53. How to Use Node.js to SSH into Remote Servers: A Comprehensive Guide · · , , , ,
  54. How to Tackle Docker and Kubernetes for Frontend · · ,
  55. How to Measure the Impact of a Design System? · · ,
  56. Combat Accessibility Decay: How to Maintain Ongoing Accessibility · · ,
  57. How to Build Things People Want to Use · ·
  58. How to Use CSS “background-size” and “background-position” · · ,
  59. Learn How to Use Hue in CSS Colors With HSL · · ,
  60. How to Clean Up Your Local Repository With Git Commands · · , ,
  61. How to Add a CSS Reveal Animation to Your Images · · , ,
  62. How to Build Server-Side Rendered (SSR) Svelte Apps With SvelteKit · · , , ,
  63. How to Highlight Required and Optional Form Fields · · , ,
  64. How to Detect Unnecessary Renderings of DOM Elements in Your Web App to Improve Performance · · , , , ,
  65. How to Draw Any Regular Shape With Just One JavaScript Function · · ,
  66. How to Build Lean Efficient Websites in 2023 · · , ,
  67. How to Create a Custom Range Slider Using CSS · · ,
  68. How to Handle Production Support When Using Scrum · · , ,
  69. How to Optimize Web Responsiveness With Interaction to Next Paint · · , ,
  70. How to Handle Emojis in Node.js · · , ,
  71. How to Configure Path Aliases in Frontend Projects in the Native Way · · ,
  72. How to Make a CSS-Only Hamburger Menu · · ,
  73. How to Write More Efficient JavaScript Conditions · · ,
  74. How to Manage Design Tokens · · ,
  75. How to Deep Merge Arrays and Objects With JavaScript · · , ,
  76. How to Write Comments in React: The Good, the Bad, and the Ugly · · ,
  77. How to Create an SEO Strategy · · ,
  78. How to Name Design Tokens in a Design System · · , ,
  79. How to Work With Dates and Times in Vanilla JavaScript · ·
  80. How to Use Google Fonts and “font-display” · · , ,
  81. How to Review and Refactor Code With GPT-4 (and ChatGPT) · · , , ,
  82. How to Split an Angular App into Micro-Frontend Apps · · , ,
  83. How to Start a React Project in 2023 · ·
  84. How to Stop a React Component from Rendering · · , ,
  85. How to Use “v-model” With Form Inputs in Vue · · ,
  86. How to Fix: Child Stylesheet Loading Twice (WordPress) · · ,
  87. Quick Tip: How to Cache Data in PHP · · , ,
  88. Learn How to Set Up a CI/CD Pipeline from Scratch · ·
  89. Quick Tip: How to Handle Exceptions in PHP · · , ,
  90. How to Contribute to a Project You Have No Idea About · · , ,
  91. How to Style Your Alt Text · · , ,
  92. How to Handle Date and Time With JavaScript · ·
  93. Quick Tip: How to Trim Whitespace With PHP · · ,
  94. How to Password-Protect a Static HTML Page With No JS · · , ,
  95. How to Build Offline Web Applications · · ,
  96. How to Use View Transitions in Hotwire Turbo · · ,
  97. Quick Tip: How to Hash a Password in PHP · · , , ,
  98. How to Inspect Interactions in the Browser · · , ,
  99. Git: How to Skip Hooks · ·
  100. Technical Writing Process: How to Write a Good Technical Article · · ,
  101. How to Scale Node.js Applications With Clustering · · ,
  102. Quick Tip: How to Check If a Variable Is Set in PHP · · ,
  103. How to Write Semantic CSS · · , ,
  104. How to Add an Event Handler in React · · , ,
  105. How to Build Accessible Main Navigation? · · ,
  106. How to Favicon in 2023: Six Files That Fit Most Needs · · ,
  107. How to Build a Magazine Layout With CSS Grid Areas · · ,
  108. How to Pick a Font (That Doesn’t Suck) · · , ,
  109. How to Get the Last Matching Item in an Array With Vanilla JavaScript · · ,
  110. Quick Tip: How to Manage Timezones in PHP · · , ,
  111. Quick Tip: How to Manage Error Reporting in PHP · · , ,
  112. How to Review a Web Site · · , ,
  113. Quick Tip: How to Read a Local File With PHP · · , ,
  114. How to Destructure Props in Vue (Composition API) · · ,
  115. Quick Tip: How to Filter Data With PHP · · ,
  116. How to Build Great HTML Form Controls · · ,
  117. How to Increase Your Chances of Getting Interviews and Job Offers in Tech · · ,
  118. How to Write an Awesome Readme · ·
  119. How to Learn in Public · · ,
  120. How to Find and Fix the Top 3 Accessibility Issues · · , ,
  121. How to Merge Objects in JavaScript · · ,
  122. How to Create Typography Guidelines for a Product That Does Not Follow a Design System · · ,
  123. How to Transfigure Wireframes into HTML · · , ,
  124. How to Use Huge Type on the Web · · ,
  125. How to Handle Unplanned Work in Scrum · · , ,
  126. How to Improve User Experience and Wow Your Users · ·
  127. How to Create the Perfect Hero Image for Your Portfolio Site · ·
  128. How to Start a Content Audit · · , , ,
  129. How to Create Advanced Animations With CSS · · ,
  130. How to Build, Test, and Publish a TypeScript npm Package in 2022 · · ,
  131. How to Communicate Effectively as a Developer · · , ,
  132. How to Set Up the New Google Auth in a React and Express App · · , , ,
  133. How to Build the Foundation for Digital Accessibility · · , ,
  134. How to Rebase Stacked Git Branches · ·
  135. How to Animate CSS Box Shadows and Optimize Performance · · , , ,
  136. Quick Tip: How to Use the Ternary Operator in JavaScript · · , ,
  137. How to Write Good Alt Text · · , ,
  138. How to Safely Pass Data to JavaScript in a Django Template · · ,
  139. How to Safely Share Your Email Address on a Website · · ,
  140. Quick Tip: How to Use the Spread Operator in JavaScript · · , ,
  141. How to Center a Div Using CSS Grid · ·
  142. How to Return Multiple Values from a Function in JavaScript · · ,
  143. How to Make Your Designs Scannable (and Why You Should) · · ,
  144. How to Get All Sibling Elements of a Link or Button With Vanilla JavaScript · · , ,
  145. How to Create Wavy Shapes and Patterns in CSS · · ,
  146. How to Generate Random Numbers in JavaScript With “Math.random()” · · , ,
  147. How to Get the Current Timestamp in JavaScript · ·
  148. How to (Not) Make a Button · · , , ,
  149. How to Substantially Slow Down Your Node.js Server · · ,
  150. How to Monitor a Next.js Application · · ,
  151. How to Improve Largest Contentful Paint for Faster Load Times · · , ,
  152. DevTools Tips: How to Inspect and Debug CSS Flexbox · · , , , , ,
  153. How to Use localStorage in JavaScript: An Easy Guide · · , ,
  154. Code Golfing Tips and Tricks: How to Minify Your JavaScript Code · · , ,
  155. How to Research Components and Patterns: Common Challenges and How to Overcome Them · · ,
  156. How to Use Multithreading in Node.js · · ,
  157. How to Add a Subtle Gradient on Top of an Image Using CSS · · ,
  158. Holograms, Light-Leaks, and How to Build CSS-Only Shaders · · , ,
  159. How to Make Text Improve User Experience: Insights into UX Writing · · ,
  160. How to Use ESLint and Prettier for Code Analysis and Formatting · · , , , , ,
  161. How to Remove 99% of JavaScript from Main Thread · · , ,
  162. How to Prevent Merge Conflicts (or at Least Have Less of Them) · · ,
  163. How to Use Headings for Website Accessibility · · , ,
  164. How to Animate SVG Shapes on Scroll · · , ,
  165. How to Create Dark Mode for Your Designs in Figma · · ,
  166. How to Use Variables in CSS · · ,
  167. How to Pick the Least Wrong Colors · · , ,
  168. How to Fix: “Buttons Do Not Have Accessible Names” · · ,
  169. How to Position Your Design System Team for Success · · , ,
  170. How to Ask for a Promotion · ·
  171. How to Use Google CrUX to Analyze and Compare the Performance of JS Frameworks · · , , ,
  172. How to Learn JavaScript Fast: Six Simple Mind Tricks · · , ,
  173. How to Use the GitHub Pulls API to Manage Pull Requests · · ,
  174. How to Use Videos With Alpha Transparency on the Web · · ,
  175. Design Patterns: How to Create Simple Interfaces · · ,
  176. How to Create a Color Palette for Your Design System · · , ,
  177. How to Reduce Figma Memory Usage · ·
  178. CTA Modal: How to Build a Web Component · · , ,
  179. How to Build Node.js REST API With MySQL · · , , ,
  180. How to Start Testing Your Website With a Screen Reader · · , ,
  181. How to Write Good Code: 10 Beginner-Friendly Techniques for Instant Results · · ,
  182. How to Improve UX Design Through A/B Testing · · , , ,
  183. How to Develop Your UX Design Philosophy · · ,
  184. How to Fix Your Low-Contrast Text · · , ,
  185. How to Create Animated Anchor Links Using CSS · · , , ,
  186. How to Respond to Growing Supply Chain Security Risks? · · , , ,
  187. How to Match HTML Elements With an Indeterminate State · · , ,
  188. How to Optimize Your LCP (with Visuals) · · , ,
  189. How to Document Accessibility Issues · · ,
  190. How to Use Props in React · · ,
  191. How to Use CSS Math Functions: “calc”, “min”, “max”, “clamp” · · , ,
  192. How to Make a Drag-and-Drop File Uploader With Vue.js 3 · · , ,
  193. How to Prep Your SEO Strategy for a New Website · · ,
  194. How to Empathize With Your Users · · , ,
  195. How to Automatically Size a Textarea Based on Its [Text] Using Vanilla JavaScript · · ,
  196. How to Use Spectator to Test Your Angular Components · · , , ,
  197. Arrow Functions in JavaScript: How to Use Fat and Concise Syntax · · ,
  198. How to Prevent SQL Injection Attacks in Node.js · · , , ,
  199. How to Design Better APIs · · ,
  200. How to Use Higher-Order Functions in JavaScript · · ,
  201. How to Make a “Raise the Curtains” Effect in CSS · · ,
  202. How to Build a File Upload Service With Vanilla JavaScript · · ,
  203. How to Make MPAs That Are as Fast as SPAs · · , ,
  204. How to Fix Your Security Vulnerabilities With npm Override · · , ,
  205. How to Prioritize Your Components · · ,
  206. Design Systems in Figma: How to Be More Productive · · , ,
  207. Design System: How to Successfully Collaborate? · · ,
  208. How to Create a Search Page for a Static Website With Vanilla JS · · , , ,
  209. How to Keep Your Repo Package Dependencies Up to Date Automatically · · ,
  210. How to Make CSS Slanted Containers · ·
  211. How to Favicon in 2022: Six Files That Fit Most Needs · · ,
  212. How to Use the Accessibility Tree for A11Y Testing · · ,
  213. How to Create a UX Vision Statement · ·
  214. How to Convert Markdown to HTML · · , ,
  215. Design System: How to Efficiently Scale Development? · · ,
  216. How to Check What Item Is in Focus When Accessibility Testing · · , ,
  217. How to Set Up a Node.js Project With TypeScript · · ,
  218. How to Avoid Layout Shifts Caused by Web Fonts · · , ,
  219. How to Measure Your Design System? · · ,
  220. How to Define Your Relationship to Sites You Link To · · , , ,
  221. How to Add and Remove a CSS Class from Multiple Elements With Vanilla JavaScript · · ,
  222. How to Customize Firefox UI—Step-by-Step Tutorial · · , , , , ,
  223. How to Maintain a Large Next.js Application · · ,
  224. How to Trim Strings in JavaScript · ·
  225. How to Make Blob Menu Using HTML, CSS and JavaScript · · , ,
  226. How to Create Reusable Components With the Vue 3 Composition API · · ,
  227. How to Fetch Data in Svelte · · ,
  228. How to Debounce and Throttle Callbacks in Vue · · , , ,
  229. How to Implement Memoization in React to Improve Performance · · , , ,
  230. The Key to Developer Happiness and How to Prevent Coding from Becoming Just Another Job · ·
  231. How to Cancel an HTTP Request in Node.js · · ,
  232. How to Win at CORS · · , , ,
  233. Internationalization: How to Boost Traffic With a Multilingual Site · ·
  234. How to Implement and Style the “Dialog” Element · · , ,
  235. UX Accessibility: How to Start Designing for All · · ,
  236. How to Build an Expandable Accessible Gallery · · , ,
  237. How to Expand Your Engineering Skill Set Without Quitting Your Day Job · · ,
  238. How to Use “Promise.any()” · · ,
  239. Flexbox or CSS Grid? How to Make Layout Decisions That Make Sense · · , ,
  240. How to Calculate REMs from Pixels · ·
  241. How to Test for Accessibility With Users at Every Design Stage · · ,
  242. How to Use “Promise.allSettled()” · · ,
  243. How to Build Resilient JavaScript UIs · · ,
  244. How to Stay Focused as a Self-Taught Frontend Web Developer · · , ,
  245. How to Hand Off Accessible Designs to Developers? · · ,
  246. How to Eliminate Render-Blocking Resources: a Deep Dive · · ,
  247. How to Get a Pixel-Perfect, Linearly Scaled UI · · , ,
  248. How to Migrate from jQuery to Next.js · · , ,
  249. How to Convert Arrays to Human-Readable Lists in JavaScript · · , ,
  250. How to Use “Promise.all()” · · ,