Frontend Dogma

“how-tos” Archive (2)

Featured on Frontend Dogma? Confirm and whitelist your domain.

  1. How to Build a Magazine Layout With CSS Grid Areas (by/via) · · , ,
  2. How to Favicon in 2023: Six Files That Fit Most Needs (by/via) · · ,
  3. How to Pick a Font (That Doesn’t Suck) (by) · · , ,
  4. How to Make a Zoom Effect Using CSS (by/via) · · ,
  5. How to Get the Last Matching Item in an Array With Vanilla JavaScript (by) · · ,
  6. How to Build a Static Website (by/via) · ·
  7. Quick Tip: How to Manage Timezones in PHP (by/via) · · , ,
  8. Quick Tip: How to Manage Error Reporting in PHP (by/via) · · , ,
  9. How to Review a Web Site (via) · · , ,
  10. How to Use Pico CSS and Next.js? (by) · · ,
  11. Quick Tip: How to Read a Local File With PHP (by/via) · · , ,
  12. How to Destructure Props in Vue (Composition API) (by) · · ,
  13. Quick Tip: How to Filter Data With PHP (by/via) · · ,
  14. How to Build Great HTML Form Controls (by/via) · · ,
  15. How to Increase Your Chances of Getting Interviews and Job Offers in Tech (by) · · ,
  16. How to Write an Awesome README (by/via) · · ,
  17. How to [Set Up] Prettier (by) · · ,
  18. How to Learn in Public (by) · · ,
  19. How to Find and Fix the Top 3 Accessibility Issues (via) · · , ,
  20. How to Merge Objects in JavaScript (via) · · ,
  21. How to Create Typography Guidelines for a Product That Does Not Follow a Design System (by/via) · · ,
  22. How to Use the WAVE Extension and Start Manual Accessibility Testing (via) · · , , ,
  23. How to Transfigure Wireframes Into HTML (by/via) · · , ,
  24. How to Use Huge Type on the Web (by) · · ,
  25. How to Handle Unplanned Work in Scrum (by/via) · · , ,
  26. How to Increase Traffic to Your Website (via) · ·
  27. How to Improve User Experience and Wow Your Users (by/via) · ·
  28. How to Create the Perfect Hero Image for Your Portfolio Site (via) · ·
  29. How to Start a Content Audit (via) · · , , ,
  30. How to Create Advanced Animations With CSS (by/via) · · ,
  31. How to Build, Test, and Publish a TypeScript npm Package in 2022 (by) · · ,
  32. How to Communicate Effectively as a Developer (by) · · , ,
  33. How to Set Up the New Google Auth in a React and Express App (by/via) · · , , ,
  34. How to Build the Foundation for Digital Accessibility (by/via) · · , ,
  35. How to Rebase Stacked Git Branches (by) · ·
  36. How to Animate CSS Box Shadows and Optimize Performance (by/via) · · , , ,
  37. Quick Tip: How to Use the Ternary Operator in JavaScript (via) · · , ,
  38. How to Write Good Alt Text (by) · · , ,
  39. How to Safely Share Your Email Address on a Website (via) · · ,
  40. How to Safely Pass Data to JavaScript in a Django Template (by) · · ,
  41. Quick Tip: How to Use the Spread Operator in JavaScript (via) · · , ,
  42. How to Scale SVG (by/via) · · ,
  43. How to Center a Div Using CSS Grid (by/via) · · , ,
  44. How to Make Your Designs Scannable (and Why You Should) (by/via) · · ,
  45. How to Return Multiple Values From a Function in JavaScript (by) · · ,
  46. How to Get All Sibling Elements of a Link or Button With Vanilla JavaScript (by) · · , ,
  47. How to Create Wavy Shapes and Patterns in CSS (by/via) · · ,
  48. How to Generate Random Numbers in JavaScript With “Math.random()” (by/via) · · , ,
  49. How to Get the Current Timestamp in JavaScript (by) · ·
  50. How to (Not) Make a Button (by) · · , , ,
  51. How to Substantially Slow Down Your Node.js Server (via) · · ,
  52. How to Run Qodana CI in Backend and Frontend Sub-Folders of a Monorepo (by) · · , , , , ,
  53. How to Monitor a Next.js Application (via) · · ,
  54. How to Improve Largest Contentful Paint for Faster Load Times (by/via) · · , ,
  55. How to Build Event-Driven Architecture on AWS? (by/via) · · , ,
  56. DevTools Tips: How to Inspect and Debug CSS Flexbox (via) · · , , , , , ,
  57. How to Use localStorage in JavaScript: An Easy Guide (by/via) · · , ,
  58. How to Research Components and Patterns: Common Challenges and How to Overcome Them (by/via) · · ,
  59. Code Golfing Tips and Tricks: How to Minify Your JavaScript Code (by/via) · · , ,
  60. How to Use Multithreading in Node.js (by/via) · · ,
  61. How to Add a Subtle Gradient on Top of an Image Using CSS (by) · · ,
  62. Holograms, Light-Leaks, and How to Build CSS-Only Shaders (by) · · , ,
  63. How to Make Text Improve User Experience: Insights Into UX Writing (by/via) · · ,
  64. How to Auto-Prefix and Minify CSS? (by) · · , , ,
  65. How to Use ESLint and Prettier for Code Analysis and Formatting (by) · · , , , , ,
  66. How to Prevent Merge Conflicts (or at Least Have Less of Them) (by/via) · · ,
  67. How to Remove 99% of JavaScript From Main Thread (by/via) · · , ,
  68. How to Use Headings for Website Accessibility (via) · · , ,
  69. How to Animate SVG Shapes on Scroll (by/via) · · , ,
  70. How to Create Dark Mode for Your Designs in Figma (by/via) · · ,
  71. How to Use Variables in CSS: CSS Custom Properties (by/via) · · ,
  72. How to Pick the Least Wrong Colors (by) · · , ,
  73. How to Migrate From Yarn/npm to pnpm · · , , ,
  74. How to Fix: “Buttons Do Not Have Accessible Names” (via) · · ,
  75. How to Position Your Design System Team for Success (by/via) · · , ,
  76. How to Ask for a Promotion (by/via) · ·
  77. How to Use Google CrUX to Analyze and Compare the Performance of JS Frameworks (by/via) · · , , , ,
  78. How to Learn JavaScript Fast: Six Simple Mind Tricks (by/via) · · , ,
  79. How to Use the GitHub Pulls API to Manage Pull Requests (by/via) · · ,
  80. How to Use Videos With Alpha Transparency on the Web (by) · · , ,
  81. Design Patterns: How to Create Simple Interfaces (via) · · ,
  82. How to Create a Color Palette for Your Design System (via) · · , ,
  83. How to Reduce Figma Memory Usage (via) · ·
  84. How to Build Node.js REST API With MySQL · · , , ,
  85. CTA Modal: How to Build a Web Component (by/via) · · , ,
  86. How to Start Testing Your Website With a Screen Reader (by/via) · · , ,
  87. How to Choose the Right Static Site Generator (by/via) · · , , , , , ,
  88. How to Improve Core Web Vitals (8 Ways) (via) · · ,
  89. How to Write Good Code: 10 Beginner-Friendly Techniques for Instant Results (by/via) · · ,
  90. How to Improve UX Design Through A/B Testing (by/via) · · , , ,
  91. How to Develop Your UX Design Philosophy (by/via) · · ,
  92. How to Turn HTML Webpage Into an Image? (by) · · , ,
  93. How to Fix Your Low-Contrast Text (by) · · , ,
  94. How to Create Animated Anchor Links Using CSS (by/via) · · , , ,
  95. How to Respond to Growing Supply Chain Security Risks? (by) · · , , ,
  96. How to Match HTML Elements With an Indeterminate State (by) · · , ,
  97. How to Optimize Your LCP (with Visuals) (by) · · , ,
  98. How to Document Accessibility Issues (via) · · ,
  99. How to Use Props in React (by) · · ,
  100. How to Use CSS Math Functions: “calc”, “min”, “max”, “clamp” (via) · · , ,
  101. How to Make a Drag-and-Drop File Uploader With Vue.js 3 (by/via) · · , ,
  102. How to Prep Your SEO Strategy for a New Website (by/via) · · ,
  103. How to Empathize With Your Users (via) · · , ,
  104. How to Automatically Size a Textarea Based on Its [Text] Using Vanilla JavaScript (by) · · ,
  105. How to Use Spectator to Test Your Angular Components (by/via) · · , , ,
  106. Arrow Functions in JavaScript: How to Use Fat and Concise Syntax (by/via) · · ,
  107. How to Prevent SQL Injection Attacks in Node.js (by/via) · · , , ,
  108. How to Design Better APIs (by) · · ,
  109. How to Use Higher-Order Functions in JavaScript (by/via) · · ,
  110. How to Make a “Raise the Curtains” Effect in CSS (by/via) · · ,
  111. How to Build a File Upload Service With Vanilla JavaScript (by/via) · · ,
  112. How to Fix Your Security Vulnerabilities With npm Override (via) · · , , ,
  113. How to Make MPAs That Are as Fast as SPAs (by) · · , ,
  114. How to Prioritize Your Components (by/via) · · , ,
  115. Design Systems in Figma: How to Be More Productive (by/via) · · , ,
  116. Design System: How to Successfully Collaborate? (via) · · ,
  117. How To: Correctly Test for Python’s Version (by) · · , ,
  118. How to Create a Search Page for a Static Website With Vanilla JS (by) · · , , ,
  119. How to Keep Your Repo Package Dependencies Up to Date Automatically (by) · · , , ,
  120. How to Make CSS Slanted Containers (by/via) · ·
  121. How to Favicon in 2022: Six Files That Fit Most Needs (by/via) · · ,
  122. How to Use the Accessibility Tree for A11Y Testing · · ,
  123. How to Create a UX Vision Statement (by/via) · ·
  124. Design System: How to Efficiently Scale Development? (via) · · ,
  125. How to Convert Markdown to HTML (by/via) · · , ,
  126. How to Check What Item Is in Focus When Accessibility Testing · · , ,
  127. How to Set Up a Node.js Project With TypeScript (by/via) · · ,
  128. How to Avoid Layout Shifts Caused by Web Fonts (by) · · , ,
  129. Memory Leaks, How to Avoid Them in a React App (by) · · ,
  130. How to Measure Your Design System? (by/via) · · ,
  131. How to Define Your Relationship to Sites You Link To (by) · · , , ,
  132. How to Add and Remove a CSS Class From Multiple Elements With Vanilla JavaScript (by) · · ,
  133. How to Customize Firefox UI—Step-by-Step Tutorial · · , , , , ,
  134. How to Maintain a Large Next.js Application (by/via) · · ,
  135. How to Trim Strings in JavaScript (by) · ·
  136. How to Make Blob Menu Using HTML, CSS and JavaScript (by) · · , ,
  137. How to Create Reusable Components With the Vue 3 Composition API (by/via) · · ,
  138. How to Fetch Data in Svelte (by/via) · · ,
  139. How to Debounce and Throttle Callbacks in Vue (by) · · , , , ,
  140. The Key to Developer Happiness and How to Prevent Coding From Becoming Just Another Job (by) · ·
  141. How to Implement Memoization in React to Improve Performance (via) · · , , ,
  142. How to Get Started With Social Media Automation (by/via) · · , ,
  143. How to Cancel an HTTP Request in Node.js (by) · · ,
  144. How to Win at CORS (by) · · , , ,
  145. Internationalization: How to Boost Traffic With a Multilingual Site (via) · · ,
  146. How to Implement and Style the “Dialog” Element (by/via) · · , ,
  147. UX Accessibility: How to Start Designing for All (by/via) · · ,
  148. How to Build an Expandable Accessible Gallery (by/via) · · , ,
  149. How to Expand Your Engineering Skill Set Without Quitting Your Day Job (via) · · ,
  150. How to Use “Promise.any()” (by) · · ,
  151. Flexbox or CSS Grid? How to Make Layout Decisions That Make Sense (by/via) · · , , , ,
  152. How to Set Up an AWS S3 Static SSL Website (by/via) · · ,
  153. How to Calculate REMs From Pixels (by) · ·
  154. How to Test for Accessibility With Users at Every Design Stage (by/via) · · ,
  155. How to Use “Promise.allSettled()” (by) · · ,
  156. How to Build Resilient JavaScript UIs (by/via) · · , ,
  157. How to Stay Focused as a Self-Taught Frontend Web Developer (by) · · , ,
  158. How to Hand Off Accessible Designs to Developers? (via) · · ,
  159. How to Eliminate Render-Blocking Resources: A Deep Dive (by) · · ,
  160. How to Get a Pixel-Perfect, Linearly Scaled UI (by/via) · · , ,
  161. How to Migrate From jQuery to Next.js (by/via) · · , ,
  162. How to Convert Arrays to Human-Readable Lists in JavaScript (by) · · , ,
  163. How to Use “Promise.all()” (by) · · ,
  164. Feature Checklists Are Not Enough: How to Avoid Making Bad Software (by/via) · · , ,
  165. React Architecture: How to Structure and Organize a React Application (by) · · ,
  166. How to Use Dynamic Imports in JavaScript (by) · ·
  167. How to Center Anything in CSS Using Flexbox and Grid (by/via) · · , , ,
  168. How to Fix Cumulative Layout Shift (CLS) Issues (by/via) · · ,
  169. How to Build an Image Comparison Slider (by) · · ,
  170. How to Name Your Design System (via) · · ,
  171. How to Satisfy User Intent When Considering Search vs. Browse (via) · · , , ,
  172. Better Onboarding: How to Prevent Codebase Overwhelm (via) · ·
  173. How to Build a Developer Blog With Gatsby and MDX (by/via) · · ,
  174. How to Build a Great Developer Experience (by/via) · ·
  175. How to Use SVG Image Sprites (by/via) · · , ,
  176. How to Get a Dysfunctional Team Back on Track (by/via) · · , ,
  177. How to Use PostCSS as a Configurable Alternative to Sass (by/via) · · , ,
  178. How to Test the Accessibility of Your Components With Storybook (by) · · , ,
  179. How to Use WordPress as a Headless CMS for Eleventy (by/via) · · , , ,
  180. How to Set Up VS Code for React Development (by/via) · · , , ,
  181. How to Deal With Common React JS Problems—Actionable Tips (via) · · ,
  182. How to Find and Fix Common Website Accessibility Issues (by/via) · · , , , , ,
  183. How to Test Responsive Web Design Cross-Browser Compatibility (by/via) · · , ,
  184. How to Find the Cause of Horizontal Scrollbars (by/via) · · , ,
  185. How to Create High-Performance CSS Animations (by+/via) · · , ,
  186. How to Document the Screen Reader User Experience (via) · · , , ,
  187. How to Install Apache Web Server on Windows (by+/via) · · , , , ,
  188. How to Set Up a Blog With Eleventy (by) · · ,
  189. How to Add a Sitemap to Eleventy (by) · · ,
  190. How to Design a Brand Logo (With Ease) (via) · · , , ,
  191. How to Reevaluate Your Frontend Architecture (by/via) · ·
  192. How to Convince Others Not to Use Dark Patterns (by/via) · · , , , ,
  193. How to Succeed in Wireframe Design (by/via) · · , , ,
  194. How to Create a Compelling Landing Page (by/via) · · , ,
  195. Quick Tip: How to Hide Whitespace Changes in Git Diffs (by/via) · · , , , ,
  196. How to Create a Particle Trail Animation in JavaScript (by/via) · · ,
  197. How to Create a Native Web Component Without a Framework (by/via) · · ,
  198. How to Debug a Node.js Application: Tips, Tricks, and Tools (by/via) · · , , , ,
  199. How to Publish an Updated Version of an npm Package (by/via) · · ,
  200. How to Create a Headless WordPress Site on the Jamstack (by+/via) · · , ,
  201. Introduction to WebSockets: How to Create Responsive and Low-Latency Applications (via) · · , , ,
  202. How to Automatically Update Your JavaScript Dependencies (by/via) · · , , , ,
  203. How to Install MySQL (by/via) · · , ,
  204. How to Pass Data Between Components in Vue.js (by/via) · · ,
  205. How to Convert Variable TTF Font Files to WOFF2 (by) · · , ,
  206. How to Style and Animate the Letters in a String Using CSS (by) · · , ,
  207. How to Ease Your Team’s Development Workflow With Git Hooks (by/via) · · , ,
  208. How to Ensure Your Design System Helps to Achieve the Purpose of Your Product (by/via) · · ,
  209. What Is Vuetify? How to Install and Key Components Overview · · , , ,
  210. How to Add CSS Vendor Prefixes Automatically (by/via) · · , , , , , , ,
  211. How to Build Unique, Beautiful Websites With Tailwind CSS (by/via) · ·
  212. How to Set Up a Vue Development Environment (by/via) · · ,
  213. How to Run Heroku Scheduler Weekly (by) · ·
  214. How to Get Started With Vuetify (by/via) · · , ,
  215. How to Use Redux With React Hooks (by) · · , ,
  216. Vue.js and SEO: How to Optimize Reactive Websites for Search Engines and Bots (by/via) · · ,
  217. How to Use Spaces in Web Design With Gestalt Principles (by/via) · · ,
  218. How to Align Things in CSS (by/via) · · ,
  219. How to Conditionally Apply a CSS Class in Vue.js (by/via) · · ,
  220. How to Avoid DOM Blocking in JavaScript (by/via) · · , ,
  221. How to Migrate to Gulp.js 4.0 (by/via) · · ,
  222. When and How to Use CSS Multi-Column Layout (by/via) · · ,
  223. How to Learn CSS (by/via) · · ,
  224. From Maker to Manager: How to Take the Leap (by/via) · · ,
  225. How to Configure Lighthouse for Balanced Quality Websites (by) · · , , , ,
  226. Privacy by Design: How to Sell Privacy and Make Change (by/via) · · ,
  227. How to Get Started With CSS Animation (by/via) · · ,
  228. How to Use Gulp.js to Automate Your CSS Tasks (by/via) · · , , ,
  229. Variable Fonts: What They Are, and How to Use Them (by/via) · · , ,
  230. How to Use Feature Flags in Continuous Integration (by/via) · · , ,
  231. How to Automate a Design (via) · · ,
  232. How to Internationalize Your WordPress Website (by/via) · · , ,
  233. How to Optimize CSS and JS for Faster Sites (via) · · , , , ,
  234. How to Optimize SQL Queries for Faster Sites (by/via) · · , , , , ,
  235. Static Site Generation With Grow: How to Set Up Syndication Feeds (by) · · , ,
  236. DRY CSS: How to Use Declarations Just Once, Effectively (by) · · , ,
  237. How to Work Out What to Charge Clients: The Honest Version (by/via) · · ,
  238. How to Use AMP With WordPress (by/via) · · , ,
  239. How to Create Disaster Plans for Websites (by/via) · · ,
  240. How to Create Custom WordPress Shortcodes for Your Editors (by/via) · · ,
  241. How to Secure WordPress With SSL (by/via) · · , ,
  242. Quick Tip: How to Automate Social Media Posting With Jetpack (by/via) · · , , , ,
  243. How to Land a Development Job Without Experience (via) · ·
  244. How to Secure Your Web App With HTTP Headers (by/via) · · , , , ,
  245. How to Get Started With Marketing Automation for Free (by/via) · · , ,
  246. How to Develop an Interactive Command Line Application Using Node.js (via) · · , ,
  247. How to Design and Sell Themes (With Success) (by/via) · · , ,
  248. What Is SMACSS and How to Use It (via) · · ,
  249. How to Become a Better Developer by Coding Less (via) · · , ,
  250. How to Use Shadows and Blur Effects in Modern UI Design (by/via) · · , ,