Frontend Dogma

“how-tos” Archive (2)

Entry (Sources) and Other Related TopicsDate#
How to Write More Efficient JavaScript Conditions (fre)391
,
How to Deep Merge Arrays and Objects With JavaScript (cfe)390
, ,
How to Manage Design Tokens (zet)389
,
How to Write Comments in React: The Good, the Bad, and the Ugly (pan)388
,
Why CloudFront Invalidation Is Required After Every New Deployment and How to Implement It? (viv)387
, ,
How to Create an SEO Strategy (zac/moz)386
,
How to Name Design Tokens in a Design System (cao/uxd)385
, ,
How to Work With Dates and Times in Vanilla JavaScript (cfe)384
How to Use Google Fonts and “font-display” (dax/sit)383
, ,
How to Review and Refactor Code With GPT-4 (and ChatGPT) (mar/sit)382
, , , ,
How to Split an Angular App Into Micro-Frontend Apps381
, ,
How to Start a React Project in 2023 (rwi)380
How to Stop a React Component From Rendering (ami)379
, ,
How to Use “v-model” With Form Inputs in Vue (pan)378
,
How to Fix: Child Stylesheet Loading Twice (WordPress) (sta)377
,
Quick Tip: How to Cache Data in PHP (cla/sit)376
, ,
Learn How to Set Up a CI/CD Pipeline From Scratch (pav)375
Quick Tip: How to Handle Exceptions in PHP (cla/sit)374
, ,
How to Style Your Alt Text (ede)373
, , ,
How to Contribute to a Project You Have No Idea About (mic)372
, ,
How to Handle Date and Time With JavaScript (sta)371
Quick Tip: How to Trim Whitespace With PHP (cla/sit)370
, ,
How to Cheat at CSS (des)369
, , ,
How to Password-Protect a Static HTML Page With No JS (ede)368
, ,
How to Build Offline Web Applications (sco)367
,
How to Use View Transitions in Hotwire Turbo (bor/nej)366
, ,
How to Use WebSockets in a Redux Application (tan)365
, ,
How to Inspect Interactions in the Browser (sam/bui)364
, ,
Quick Tip: How to Hash a Password in PHP (cla/sit)363
, , ,
Git: How to Skip Hooks (ada)362
Technical Writing Process: How to Write a Good Technical Article (the)361
,
How to Scale Node.js Applications With Clustering (sta/dig)360
,
How to Build Accessible Main Navigation? (tim/iod)359
,
How to Write Semantic CSS (kev)358
, ,
How to Add an Event Handler in React (vin)357
, ,
Quick Tip: How to Check if a Variable Is Set in PHP (cla/sit)356
,
How to Favicon in 2023: Six Files That Fit Most Needs (sit/evi)355
,
How to Build a Magazine Layout With CSS Grid Areas (pfe/sma)354
, ,
How to Pick a Font (That Doesn’t Suck) (kad)353
, ,
How to Make a Zoom Effect Using CSS (css/ver)352
,
How to Build a Static Website (erc/san)351
How to Get the Last Matching Item in an Array With Vanilla JavaScript (cfe)350
,
Quick Tip: How to Manage Timezones in PHP (cla/sit)349
, ,
Quick Tip: How to Manage Error Reporting in PHP (cla/sit)348
, ,
How to Review a Web Site (uxm)347
, ,
How to Use Pico CSS and Next.js? (off)346
,
Quick Tip: How to Read a Local File With PHP (cla/sit)345
, ,
How to Destructure Props in Vue (Composition API) (pan)344
,
Quick Tip: How to Filter Data With PHP (cla/sit)343
,
How to Build Great HTML Form Controls (aus/fre)342
,
How to Increase Your Chances of Getting Interviews and Job Offers in Tech (and)341
,
How to Write an Awesome README (sur/doc)340
,
How to [Set Up] Prettier (dev)339
,
How to Learn in Public (bla)338
,
How to Find and Fix the Top 3 Accessibility Issues (deq)337
, ,
How to Merge Objects in JavaScript (sta)336
,
How to Create Typography Guidelines for a Product That Does Not Follow a Design System (edw/uxd)335
,
How to Use the WAVE Extension and Start Manual Accessibility Testing (pop)334
, , ,
How to Transfigure Wireframes Into HTML (lar/mat)333
, ,
How to Use Huge Type on the Web (mat)332
,
How to Handle Unplanned Work in Scrum (reb/scr)331
, ,
How to Increase Traffic to Your Website (for)330
How to Improve User Experience and Wow Your Users (hag/all)329
How to Create the Perfect Hero Image for Your Portfolio Site (sit)328
How to Adjust Alignment and Indentation for Ordered Lists in CSS (pro)327
, , ,
How to Start a Content Audit (con)326
, , ,
How to Create Advanced Animations With CSS (yos/sma)325
,
How to Build, Test, and Publish a TypeScript npm Package in 2022 (jan)324
,
How to Communicate Effectively as a Developer (kar)323
, ,
How to Set Up the New Google Auth in a React and Express App (bon/sit)322
, , ,
How to Build the Foundation for Digital Accessibility (a11/deq)321
, ,
How to Rebase Stacked Git Branches (ada)320
How to Animate CSS Box Shadows and Optimize Performance (osc/sit)319
, , ,
Quick Tip: How to Use the Ternary Operator in JavaScript (sit)318
, ,
How to Write Good Alt Text (cfe)317
, , ,
How to Safely Pass Data to JavaScript in a Django Template (ada)316
,
How to Safely Share Your Email Address on a Website (css)315
,
Quick Tip: How to Use the Spread Operator in JavaScript (sit)314
, ,
How to Scale SVG (ame/css)313
,
How to Center a Div Using CSS Grid (fim/sit)312
, ,
How to Return Multiple Values From a Function in JavaScript (ami)311
,
How to Make Your Designs Scannable (and Why You Should) (ben/web)310
,
How to Create Wavy Shapes and Patterns in CSS (css/css)309
,
How to Get All Sibling Elements of a Link or Button With Vanilla JavaScript (cfe)308
, ,
How to Generate Random Numbers in JavaScript With “Math.random()” (daz/sit)307
, ,
How to Get the Current Timestamp in JavaScript (vin)306
How to (Not) Make a Button (pus)305
, , ,
How to Substantially Slow Down Your Node.js Server (tri)304
,
How to Run Qodana CI in Backend and Frontend Sub-Folders of a Monorepo (pes)303
, , , , ,
How to Monitor a Next.js Application (new)302
,
How to Improve Largest Contentful Paint for Faster Load Times (fox/cal)301
, ,
How to Build Event-Driven Architecture on AWS? (san/has)300
, ,
DevTools Tips: How to Inspect and Debug CSS Flexbox (dev)299
, , , , , ,
How to Use localStorage in JavaScript: An Easy Guide (jus/bit)298
, ,
How to Research Components and Patterns: Common Challenges and How to Overcome Them (cjf/eff)297
,
Code Golfing Tips and Tricks: How to Minify Your JavaScript Code (cip/get)296
, ,
How to Use Multithreading in Node.js (sta/dig)295
,
How to Add a Subtle Gradient on Top of an Image Using CSS (the)294
,
Holograms, Light-Leaks, and How to Build CSS-Only Shaders (rob)293
, ,
How to Make Text Improve User Experience: Insights Into UX Writing (mya/d4u)292
,
How to Auto-Prefix and Minify CSS? (mur)291
, , ,
How to Serve WebP Images on nginx290
, , ,
How to Use ESLint and Prettier for Code Analysis and Formatting (and)289
, , , , ,
How to Prevent Merge Conflicts (or at Least Have Less of Them) (bla/git)288
,
How to Remove 99% of JavaScript From Main Thread (mhe/wea)287
, ,
Notes From the Dev: Essential Advice on How to Use MJML (meg/ema)286
,
How to Use Headings for Website Accessibility (usa)285
, ,
How to Animate SVG Shapes on Scroll (crn/cod)284
, ,
How to Create Dark Mode for Your Designs in Figma (sep/uxd)283
,
How to Use Variables in CSS: CSS Custom Properties (web/sit)282
,
How to Pick the Least Wrong Colors (ili)281
, ,
How to Migrate From Yarn/npm to pnpm280
, , ,
How to Fix: “Buttons Do Not Have Accessible Names” (boi)279
,
How to Position Your Design System Team for Success (bik/vig)278
, ,
How to Ask for a Promotion (sam/uxd)277
How to Use Google CrUX to Analyze and Compare the Performance of JS Frameworks (dan/sma)276
, , , ,
How to Learn JavaScript Fast: Six Simple Mind Tricks (yap/sit)275
, ,
How to Use the GitHub Pulls API to Manage Pull Requests (car/fus)274
,
How to Use Videos With Alpha Transparency on the Web (ben)273
, ,
Design Patterns: How to Create Simple Interfaces (web)272
,
How to Create a Color Palette for Your Design System (sit)271
, ,
How to Professionally Say (aka)270
, , , ,
How to Reduce Figma Memory Usage (uxd)269
CTA Modal: How to Build a Web Component (nat/sma)268
, ,
How to Build Node.js REST API With MySQL267
, , , ,
How to Start Testing Your Website With a Screen Reader (kar/spe)266
, ,
How to Choose the Right Static Site Generator (sug/git)265
, , , , , ,
How to Improve Core Web Vitals (8 Ways) (dre)264
,
How to Write Good Code: 10 Beginner-Friendly Techniques for Instant Results (joe/sit)263
,
How to Improve UX Design Through A/B Testing (sea/uxm)262
, , ,
How to Develop Your UX Design Philosophy (mic/uxm)261
,
How to Turn HTML Webpage Into an Image? (jas)260
, ,
How to Fix Your Low-Contrast Text (ben)259
, ,
How to Create Animated Anchor Links Using CSS (zor/css)258
, , ,
How to Respond to Growing Supply Chain Security Risks? (mak)257
, , ,
How to Match HTML Elements With an Indeterminate State (ste)256
, ,
How to Optimize Your LCP (with Visuals) (ste)255
, ,
How to Document Accessibility Issues (con)254
,
How to Use Props in React (rwi)253
,
How to Use CSS Math Functions: “calc”, “min”, “max”, “clamp” (sta)252
, ,
How to Make a Drag-and-Drop File Uploader With Vue.js 3 (joe/sma)251
, ,
How to Prep Your SEO Strategy for a New Website (adr/moz)250
,
How to Empathize With Your Users (usa)249
, ,
How to Automatically Size a Textarea Based on Its [Text] Using Vanilla JavaScript (cfe)248
,
How to Use Spectator to Test Your Angular Components (wic/js)247
, , ,
Arrow Functions in JavaScript: How to Use Fat and Concise Syntax (ant/sit)246
,
How to Design Better APIs (rbl)245
,
How to Prevent SQL Injection Attacks in Node.js (jam/pla)244
, , ,
How to Use Higher-Order Functions in JavaScript (mda/sit)243
,
How to Make a “Raise the Curtains” Effect in CSS (cit/css)242
,
How to Build a File Upload Service With Vanilla JavaScript (the/log)241
,
How to Publish Deno Modules to npm (kit/den)240
, , ,
How to Fix Your Security Vulnerabilities With npm Override (azu)239
, , ,
How to Make MPAs That Are as Fast as SPAs (cfe)238
, ,
Design Systems in Figma: How to Be More Productive (sep/uxd)237
, ,
How to Prioritize Your Components (jul/zer)236
, ,
Design System: How to Successfully Collaborate? (uxd)235
,
How to Consume Microformats2 Data (bar/mic)234
, , ,
How to Create a Search Page for a Static Website With Vanilla JS (cfe)233
, , ,
How To: Correctly Test for Python’s Version (tab)232
, ,
How to Keep Your Repo Package Dependencies Up to Date Automatically (dan)231
, , ,
How to Make CSS Slanted Containers (dav/css)230
How to Favicon in 2022: Six Files That Fit Most Needs (sit/evi)229
,
How to Create a UX Vision Statement (kat/nng)228
How to Use the Accessibility Tree for A11Y Testing227
,
How to Convert Markdown to HTML (red/lir)226
, ,
Design System: How to Efficiently Scale Development? (uxd)225
,
How to Check What Item Is in Focus When Accessibility Testing224
, ,
How to Set Up a Node.js Project With TypeScript (fre/app)223
,
How to Avoid Layout Shifts Caused by Web Fonts (sim)222
, ,
Memory Leaks, How to Avoid Them in a React App (jer)221
,
How to Measure Your Design System? (jul/zer)220
,
How to Add and Remove a CSS Class From Multiple Elements With Vanilla JavaScript (cfe)219
,
How to Define Your Relationship to Sites You Link To (ste)218
, , ,
How to Customize Firefox UI—Step-by-Step Tutorial217
, , , , ,
How to Maintain a Large Next.js Application (nir/sma)216
,
How to Trim Strings in JavaScript (pan)215
How to Make Blob Menu Using HTML, CSS and JavaScript (yos)214
, ,
How to Create Reusable Components With the Vue 3 Composition API (cod/sit)213
,
How to Fetch Data in Svelte (dav/sit)212
,
How to Debounce and Throttle Callbacks in Vue (pan)211
, , , ,
How to Implement Memoization in React to Improve Performance (sit)210
, , ,
The Key to Developer Happiness and How to Prevent Coding From Becoming Just Another Job (hes)209
How to Get Started With Social Media Automation (mon/sit)208
, ,
How to Cancel an HTTP Request in Node.js (sim)207
,
How to Win at CORS (jaf)206
, , ,
Internationalization: How to Boost Traffic With a Multilingual Site (sit)205
,
How to Implement and Style the “Dialog” Element (cko/cod)204
, ,
UX Accessibility: How to Start Designing for All (lui/uxd)203
,
How to Build an Expandable Accessible Gallery (cit/sma)202
, ,
How to Redirect URLs on WordPress (sem)201
, , ,
How to Expand Your Engineering Skill Set Without Quitting Your Day Job (sit)200
,
How to Use “Promise.any()” (pan)199
,
Flexbox or CSS Grid? How to Make Layout Decisions That Make Sense (ant/sit)198
, , , ,
How to Automate Documentation Workflow for Developers (sma)197
, , ,
How to Set Up an AWS S3 Static SSL Website (goo/adb)196
,
How to Calculate REMs From Pixels (nas)195
How to Test for Accessibility With Users at Every Design Stage (kat/sho)194
,
How to Use “Promise.allSettled()” (pan)193
,
How to Build Resilient JavaScript UIs (ca/sma)192
, ,
How to Stay Focused as a Self-Taught Frontend Web Developer (hyg)191
, ,
How to Hand Off Accessible Designs to Developers? (uxd)190
,
How to Eliminate Render-Blocking Resources: A Deep Dive (sia)189
,
How to Migrate From WordPress to a Headless CMS (daw/sma)188
, , ,
How to Get a Pixel-Perfect, Linearly Scaled UI (geo/css)187
, ,
How to Migrate From jQuery to Next.js (fac/sma)186
, ,
How to Convert Arrays to Human-Readable Lists in JavaScript (ami)185
, ,
How to Use “Promise.all()” (pan)184
,
Feature Checklists Are Not Enough: How to Avoid Making Bad Software (kwh/nng)183
, ,
React Architecture: How to Structure and Organize a React Application (tan)182
,
How to Use Dynamic Imports in JavaScript (ale)181
How to Center Anything in CSS Using Flexbox and Grid (joy/fre)180
, , ,
How to Fix Cumulative Layout Shift (CLS) Issues (tun/sma)179
,
How to Build an Image Comparison Slider (let)178
,
How to Implement Authentication in Next.js With Auth0 (fac/sma)177
, , ,
How to Name Your Design System (pur)176
,
How to Satisfy User Intent When Considering Search vs. Browse (alg)175
, , ,
Better Onboarding: How to Prevent Codebase Overwhelm (sou)174
How to Build a Developer Blog With Gatsby and MDX (spe/sit)173
,
How to Build a Great Developer Experience (nic/api)172
How to Use SVG Image Sprites (cra/sit)171
, ,
How to Get a Dysfunctional Team Back on Track (lia/ali)170
, ,
How to Use PostCSS as a Configurable Alternative to Sass (cra/sit)169
, ,
How to Test the Accessibility of Your Components With Storybook (bol)168
, ,
How to Use WordPress as a Headless CMS for Eleventy (cra/sit)167
, , ,
How to Set Up VS Code for React Development (myx/sit)166
, , ,
How to Deal With Common React JS Problems—Actionable Tips (bra)165
,
How to Find and Fix Common Website Accessibility Issues (kil/sit)164
, , , , ,
How to Test Responsive Web Design Cross-Browser Compatibility (cra/sit)163
, , ,
How to Find the Cause of Horizontal Scrollbars (kil/pol)162
, , ,
How to Create High-Performance CSS Animations (kay+/dev)161
, ,
How to Automate API Testing With Postman (dom/sma)160
, , ,
How to Create Customer-Centric Landing Pages (tra/sma)159
, ,
How to Use Styled Components in React (ade/sma)158
, , ,
How to Document the Screen Reader User Experience (bbc)157
, , ,
How to Install Apache Web Server on Windows (cra+/sit)156
, , , ,
How to Set Up a Blog With Eleventy (mtm)155
,
How to Add a Sitemap to Eleventy (mtm)154
,
How to Design a Brand Logo (With Ease) (sma)153
, , ,
How to Reevaluate Your Frontend Architecture (ian/inc)152
How to Convince Others Not to Use Dark Patterns (boa/sma)151
, , , ,
How to Succeed in Wireframe Design (ant/sma)150
, , ,
How to Create a Compelling Landing Page (boa/sma)149
, ,
Quick Tip: How to Hide Whitespace Changes in Git Diffs (spa/clo)148
, , , ,
How to Create a Particle Trail Animation in JavaScript (pro/sma)147
,
How to Create a Native Web Component Without a Framework (jah/thi)146
,
How to Debug a Node.js Application: Tips, Tricks, and Tools (cra/sit)145
, , , ,
How to Publish an Updated Version of an npm Package (spa/clo)144
,
How to Create a Headless WordPress Site on the Jamstack (sar+/sma)143
, ,
Introduction to WebSockets: How to Create Responsive and Low-Latency Applications (hac)142
, , ,