diff --git a/.vscode/settings.json b/.vscode/settings.json index 69d3bd22dea..52b0d126b25 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -25,7 +25,7 @@ "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[markdown]": { - "editor.wordWrapColumn": 100, + "editor.wordWrapColumn": 80, "editor.wordWrap": "wordWrapColumn" }, "workbench.editor.labelFormat": "short", diff --git a/content/snippets/articles/s/bash-alias-dollar-sign.md b/content/snippets/articles/s/bash-alias-dollar-sign.md index c3a0ee2efc2..c4802400591 100644 --- a/content/snippets/articles/s/bash-alias-dollar-sign.md +++ b/content/snippets/articles/s/bash-alias-dollar-sign.md @@ -1,5 +1,5 @@ --- -title: "Tip: A bash alias for copying commands from the web" +title: A bash alias for copying commands from the web shortTitle: Bash alias for copying from the web type: tip language: git diff --git a/content/snippets/css/s/clamp.md b/content/snippets/css/s/clamp.md index 1f152edbf7b..1b7be8d81ae 100644 --- a/content/snippets/css/s/clamp.md +++ b/content/snippets/css/s/clamp.md @@ -1,5 +1,5 @@ --- -title: "Tip: Use clamp() in CSS for responsive typography" +title: Use clamp() in CSS for responsive typography shortTitle: CSS clamp() type: tip language: css diff --git a/content/snippets/css/s/easing-variables.md b/content/snippets/css/s/easing-variables.md index ad80db7a56a..264f608309c 100644 --- a/content/snippets/css/s/easing-variables.md +++ b/content/snippets/css/s/easing-variables.md @@ -1,6 +1,5 @@ --- -title: "Tip: CSS easing variables" -shortTitle: CSS easing variables +title: CSS easing variables type: tip language: css tags: [animation] diff --git a/content/snippets/css/s/nested-border-radius.md b/content/snippets/css/s/nested-border-radius.md index 7bed091861b..2b40d7c5625 100644 --- a/content/snippets/css/s/nested-border-radius.md +++ b/content/snippets/css/s/nested-border-radius.md @@ -1,6 +1,5 @@ --- -title: "Tip: Perfect nested border radius in CSS" -shortTitle: Perfect nested border radius in CSS +title: Perfect nested border radius in CSS type: tip language: css tags: [visual] diff --git a/content/snippets/css/s/perfect-transition-duration.md b/content/snippets/css/s/perfect-transition-duration.md index 259915a754d..72b0f232a09 100644 --- a/content/snippets/css/s/perfect-transition-duration.md +++ b/content/snippets/css/s/perfect-transition-duration.md @@ -1,5 +1,5 @@ --- -title: "Tip: The perfect duration for CSS transitions" +title: The perfect duration for CSS transitions shortTitle: CSS transition duration type: tip language: css diff --git a/content/snippets/css/s/select-any-link.md b/content/snippets/css/s/select-any-link.md index e669cd6529f..66ebf84f7a2 100644 --- a/content/snippets/css/s/select-any-link.md +++ b/content/snippets/css/s/select-any-link.md @@ -1,5 +1,5 @@ --- -title: "Tip: Select any link with CSS" +title: Select any link with CSS shortTitle: "CSS :any-link pseudo-class" type: tip language: css diff --git a/content/snippets/css/s/style-default-links.md b/content/snippets/css/s/style-default-links.md index a3fcf3ca92b..d7b223a54c8 100644 --- a/content/snippets/css/s/style-default-links.md +++ b/content/snippets/css/s/style-default-links.md @@ -1,5 +1,5 @@ --- -title: "Tip: Style links without a class" +title: Style links without a class shortTitle: Style default links type: tip language: css diff --git a/content/snippets/git/s/automatic-push-upstream.md b/content/snippets/git/s/automatic-push-upstream.md index f8567df6ab5..35354d8594b 100644 --- a/content/snippets/git/s/automatic-push-upstream.md +++ b/content/snippets/git/s/automatic-push-upstream.md @@ -1,5 +1,5 @@ --- -title: "Tip: Automate Git upstream branch creation" +title: Automate Git upstream branch creation shortTitle: Automate upstream branch creation type: tip language: git diff --git a/content/snippets/git/s/branches-containing-commit.md b/content/snippets/git/s/branches-containing-commit.md index 0ee1f269163..6e89d25576e 100644 --- a/content/snippets/git/s/branches-containing-commit.md +++ b/content/snippets/git/s/branches-containing-commit.md @@ -1,5 +1,5 @@ --- -title: "Tip: Find branches containing a specific Git commit" +title: Find branches containing a specific Git commit shortTitle: Find branches containing commit type: tip language: git diff --git a/content/snippets/git/s/commit-different-date.md b/content/snippets/git/s/commit-different-date.md index 0bb8a4bfc12..bc327a91743 100644 --- a/content/snippets/git/s/commit-different-date.md +++ b/content/snippets/git/s/commit-different-date.md @@ -1,6 +1,5 @@ --- -title: "Tip: Create a commit with a different date" -shortTitle: Create a commit with a different date +title: Create a commit with a different date type: tip language: git tags: [commit] diff --git a/content/snippets/git/s/fast-forward-merge.md b/content/snippets/git/s/fast-forward-merge.md index ced66559112..35ee4295074 100644 --- a/content/snippets/git/s/fast-forward-merge.md +++ b/content/snippets/git/s/fast-forward-merge.md @@ -6,7 +6,7 @@ language: git tags: [branch] author: chalarangelo cover: boats -excerpt: Learn about Git's fast-forward mode works and its benefits when mergin branches, so you can decide if it's a good fit for you and your team. +excerpt: Learn about Git's fast-forward mode and its benefits when merging branches, so you can decide if it's a good fit for you and your team. dateModified: 2021-07-15 --- diff --git a/content/snippets/git/s/github-co-authors.md b/content/snippets/git/s/github-co-authors.md index cb58cc84a4f..b3d48b0544f 100644 --- a/content/snippets/git/s/github-co-authors.md +++ b/content/snippets/git/s/github-co-authors.md @@ -1,5 +1,5 @@ --- -title: "Tip: How to add multiple authors to a commit" +title: How to add multiple authors to a commit shortTitle: Add multiple authors to a commit type: tip language: git diff --git a/content/snippets/html/s/custom-file-download-names.md b/content/snippets/html/s/custom-file-download-names.md index ece36f5eb83..9e8750d0fa8 100644 --- a/content/snippets/html/s/custom-file-download-names.md +++ b/content/snippets/html/s/custom-file-download-names.md @@ -1,6 +1,5 @@ --- -title: "Tip: Customize the names of downloadable files" -shortTitle: Customize the names of downloadable files +title: Customize the names of downloadable files type: tip language: html tags: [link] diff --git a/content/snippets/html/s/lazy-loading-images.md b/content/snippets/html/s/lazy-loading-images.md index 38d9494e016..fa8ec058375 100644 --- a/content/snippets/html/s/lazy-loading-images.md +++ b/content/snippets/html/s/lazy-loading-images.md @@ -1,5 +1,5 @@ --- -title: "Tip: Lazy load images in HTML" +title: Lazy load images in HTML shortTitle: Image lazy loading type: tip language: html diff --git a/content/snippets/html/s/password-autocomplete-suggestion.md b/content/snippets/html/s/password-autocomplete-suggestion.md index 2e6c32ba0f9..7166be47c09 100644 --- a/content/snippets/html/s/password-autocomplete-suggestion.md +++ b/content/snippets/html/s/password-autocomplete-suggestion.md @@ -1,5 +1,5 @@ --- -title: "Tip: Adding autocomplete to a password field" +title: Add autocomplete to an HTML password field shortTitle: Password field autocomplete type: tip language: html diff --git a/content/snippets/html/s/prefetching-resources.md b/content/snippets/html/s/prefetching-resources.md index a0884ea3c1b..df62083e9db 100644 --- a/content/snippets/html/s/prefetching-resources.md +++ b/content/snippets/html/s/prefetching-resources.md @@ -1,5 +1,5 @@ --- -title: "Tip: Prefetching resources in the browser" +title: Prefetching resources in the browser shortTitle: Resource prefetching type: tip language: html diff --git a/content/snippets/html/s/reversed-list.md b/content/snippets/html/s/reversed-list.md index d3b233ded1c..19a9bc02218 100644 --- a/content/snippets/html/s/reversed-list.md +++ b/content/snippets/html/s/reversed-list.md @@ -1,5 +1,5 @@ --- -title: "Tip: Create a descending list of numbered items" +title: Create a descending list of numbered items in HTML shortTitle: Descending list type: tip language: html diff --git a/content/snippets/js/s/abort-fetch.md b/content/snippets/js/s/abort-fetch.md index c9ec33c3bd4..70577cec6d5 100644 --- a/content/snippets/js/s/abort-fetch.md +++ b/content/snippets/js/s/abort-fetch.md @@ -1,5 +1,5 @@ --- -title: "Tip: Abort a fetch request in JavaScript" +title: Abort a fetch request in JavaScript shortTitle: Abort a fetch request type: story language: javascript diff --git a/content/snippets/js/s/array-min-max.md b/content/snippets/js/s/array-min-max.md index 207358bf3b4..57280b196a0 100644 --- a/content/snippets/js/s/array-min-max.md +++ b/content/snippets/js/s/array-min-max.md @@ -1,5 +1,5 @@ --- -title: "Tip: Min and max value in a JavaScript array" +title: Min and max value in a JavaScript array shortTitle: Min and max value of an array type: tip language: javascript diff --git a/content/snippets/js/s/array-sorting-shorthand.md b/content/snippets/js/s/array-sorting-shorthand.md index e80709f7ef5..f03e2d66254 100644 --- a/content/snippets/js/s/array-sorting-shorthand.md +++ b/content/snippets/js/s/array-sorting-shorthand.md @@ -1,9 +1,10 @@ --- -title: "Tip: JavaScript array sorting shorthand" +title: JavaScript array sorting shorthand shortTitle: Array sorting shorthand type: tip language: javascript tags: [array] +author: chalarangelo cover: apples excerpt: Learn how to quickly write code to sort JavaScript arrays with this handy one-liner. dateModified: 2021-06-12 diff --git a/content/snippets/js/s/cannot-extend-proxy-object.md b/content/snippets/js/s/cannot-extend-proxy-object.md index 493649594f0..6a36287e104 100644 --- a/content/snippets/js/s/cannot-extend-proxy-object.md +++ b/content/snippets/js/s/cannot-extend-proxy-object.md @@ -1,5 +1,5 @@ --- -title: "Tip: You can't extend the Proxy object" +title: You can't extend JavaScript's Proxy object shortTitle: Extending the Proxy object type: tip language: javascript diff --git a/content/snippets/js/s/compare-string-case-accent-insensitive.md b/content/snippets/js/s/compare-string-case-accent-insensitive.md index 5408129dad0..148aae7afd5 100644 --- a/content/snippets/js/s/compare-string-case-accent-insensitive.md +++ b/content/snippets/js/s/compare-string-case-accent-insensitive.md @@ -1,5 +1,5 @@ --- -title: "Tip: Compare strings regardless of case and accent" +title: Compare strings regardless of case and accent shortTitle: Case and accent-insensitive string comparison type: tip language: javascript diff --git a/content/snippets/js/s/debounce-function.md b/content/snippets/js/s/debounce-function.md index b3d0c33288d..23c293f328c 100644 --- a/content/snippets/js/s/debounce-function.md +++ b/content/snippets/js/s/debounce-function.md @@ -1,18 +1,18 @@ --- -title: Debounce function -type: snippet +title: Debounce a JavaScript function +shortTitle: Debounce function +type: tip language: javascript tags: [function] +author: chalarangelo cover: solitude-beach -excerpt: Creates a debounced function that waits `ms` milliseconds before invoking the provided function again. -dateModified: 2021-10-13 +excerpt: Create a debounced function that waits a certain amount of time before invoking the provided function again. +dateModified: 2023-10-12 --- -Creates a debounced function that delays invoking the provided function until at least `ms` milliseconds have elapsed since its last invocation. +**Debouncing** is a technique used to **limit the number of times** a function is called. The function will only be called once, after a **specific amount of time** has elapsed since its last invocation. -- Each time the debounced function is invoked, clear the current pending timeout with `clearTimeout()`. Use `setTimeout()` to create a new timeout that delays invoking the function until at least `ms` milliseconds have elapsed. -- Use `Function.prototype.apply()` to apply the `this` context to the function and provide the necessary arguments. -- Omit the second argument, `ms`, to set the timeout at a default of `0` ms. +To accomplish this, we can use **timeouts** to artificially create the necessary delay. Each time the debounced function is invoked, we need to **clear the current pending timeout** with `clearTimeout()`. Then, we must use `setTimeout()` to **create a new timeout** that delays invoking the function until at least `ms` milliseconds have elapsed. Finally, using `Function.prototype.apply()` we can apply the `this` context to the function and provide the necessary arguments. ```js const debounce = (fn, ms = 0) => { diff --git a/content/snippets/js/s/debounce-promise.md b/content/snippets/js/s/debounce-promise.md index ad282ed5abb..c65f7186a1e 100644 --- a/content/snippets/js/s/debounce-promise.md +++ b/content/snippets/js/s/debounce-promise.md @@ -1,22 +1,24 @@ --- -title: Debounce promise -type: snippet +title: Debounce a JavaScript function and return a promise +shortTitle: Debounce promise +type: tip language: javascript tags: [function,promise] -excerpt: Creates a debounced function that returns a promise. +author: chalarangelo +excerpt: Easily create a debounced function that returns a promise. cover: chess-pawns -dateModified: 2020-10-19 +dateModified: 2023-10-13 --- -Creates a debounced function that returns a promise, but delays invoking the provided function until at least `ms` milliseconds have elapsed since the last time it was invoked. -All promises returned during this time will return the same data. +**Debouncing** is a technique used to **limit the number of times** a function is called. We've previously seen how to [debounce a function](/js/s/debounce-function), but what if we want to **return a promise** instead? -- Each time the debounced function is invoked, clear the current pending timeout with `clearTimeout()` and use `setTimeout()` to create a new timeout that delays invoking the function until at least `ms` milliseconds has elapsed. -- Use `Function.prototype.apply()` to apply the `this` context to the function and provide the necessary arguments. -- Create a new `Promise` and add its `resolve` and `reject` callbacks to the `pending` promises stack. -- When `setTimeout()` is called, copy the current stack (as it can change between the provided function call and its resolution), clear it and call the provided function. -- When the provided function resolves/rejects, resolve/reject all promises in the stack (copied when the function was called) with the returned data. -- Omit the second argument, `ms`, to set the timeout at a default of `0` ms. +Same as before, we can use **timeouts** to create a delay as needed. We need to **clear the current pending timeout**, using `clearTimeout()`, and **create a new timeout** with `setTimeout()` each time the debounced function is invoked. Similarly, we can use `Function.prototype.apply()` to apply the `this` context to the function and provide the necessary arguments. + +However, we also need to **keep track of all pending promises** and resolve/reject them when the function is invoked. To do that, we can create a `pending` array and add the `resolve` and `reject` callbacks of each promise to it. + +When **the function is invoked**, the current `pending` array will have to be copied, as it can change between the function call and its resolution. Then, we can clear the `pending` array and call the provided function. + +Finally, when **the function resolves/rejects**, we can resolve/reject all promises in the copied array with the returned data. This means that **all promises created in the meantime will resolve/reject with the same data**. ```js const debouncePromise = (fn, ms = 0) => { diff --git a/content/snippets/js/s/decimal-to-hex.md b/content/snippets/js/s/decimal-to-hex.md index 01a3be97d57..fa5b1ff6f93 100644 --- a/content/snippets/js/s/decimal-to-hex.md +++ b/content/snippets/js/s/decimal-to-hex.md @@ -1,5 +1,5 @@ --- -title: "Tip: Convert decimal number to hexadecimal" +title: Convert decimal number to hexadecimal shortTitle: Decimal to hexadecimal type: tip language: javascript diff --git a/content/snippets/js/s/dynamic-properties-are-slow.md b/content/snippets/js/s/dynamic-properties-are-slow.md index bc49355269e..7b39aa2ff88 100644 --- a/content/snippets/js/s/dynamic-properties-are-slow.md +++ b/content/snippets/js/s/dynamic-properties-are-slow.md @@ -1,5 +1,5 @@ --- -title: "Tip: Optimize dynamically added object properties" +title: Optimize dynamically added object properties shortTitle: Dynamically added property optimization type: tip language: javascript diff --git a/content/snippets/js/s/edit-url-params.md b/content/snippets/js/s/edit-url-params.md index f82f62a9a47..8684105838e 100644 --- a/content/snippets/js/s/edit-url-params.md +++ b/content/snippets/js/s/edit-url-params.md @@ -1,5 +1,5 @@ --- -title: "Tip: Edit URL Parameters in JavaScript" +title: Edit URL Parameters in JavaScript shortTitle: Edit URL Parameters type: tip language: javascript diff --git a/content/snippets/js/s/element-from-point.md b/content/snippets/js/s/element-from-point.md index f89f674417d..8bfe01e6454 100644 --- a/content/snippets/js/s/element-from-point.md +++ b/content/snippets/js/s/element-from-point.md @@ -1,5 +1,5 @@ --- -title: "Tip: Element at a specific point on the page" +title: Element at a specific point on the page shortTitle: Element at specific coordinates type: tip language: javascript diff --git a/content/snippets/js/s/eslint-refactor-for-in.md b/content/snippets/js/s/eslint-refactor-for-in.md index fcc6bf6ee85..f3fa4448552 100644 --- a/content/snippets/js/s/eslint-refactor-for-in.md +++ b/content/snippets/js/s/eslint-refactor-for-in.md @@ -1,5 +1,5 @@ --- -title: "Tip: Refactoring your for...in loops to avoid ESLint warnings" +title: Refactoring your for...in loops to avoid ESLint warnings shortTitle: Refactoring for...in loops to avoid ESLint warnings type: tip language: javascript diff --git a/content/snippets/js/s/first-last-n-elements.md b/content/snippets/js/s/first-last-n-elements.md index 5ca6b272713..590fbafd843 100644 --- a/content/snippets/js/s/first-last-n-elements.md +++ b/content/snippets/js/s/first-last-n-elements.md @@ -1,5 +1,5 @@ --- -title: "Tip: Get the first or last n elements in a JavaScript array" +title: Get the first or last n elements in a JavaScript array shortTitle: First or last n elements of an array type: tip language: javascript diff --git a/content/snippets/js/s/for-each-right.md b/content/snippets/js/s/for-each-right.md index ec3599c1e44..7518f1c3c8f 100644 --- a/content/snippets/js/s/for-each-right.md +++ b/content/snippets/js/s/for-each-right.md @@ -1,5 +1,5 @@ --- -title: "Tip: Iterate over a JavaScript array from right to left" +title: Iterate over a JavaScript array from right to left shortTitle: Iterate over array in reverse type: tip language: javascript diff --git a/content/snippets/js/s/for-loop-early-break.md b/content/snippets/js/s/for-loop-early-break.md index 8747fc1c7dd..e35a1637a40 100644 --- a/content/snippets/js/s/for-loop-early-break.md +++ b/content/snippets/js/s/for-loop-early-break.md @@ -1,5 +1,5 @@ --- -title: "Tip: Use JavaScript for loops if you need to break out early" +title: Use JavaScript for loops if you need to break out early shortTitle: For loops for early breaking type: tip language: javascript diff --git a/content/snippets/js/s/index-for-of-loop.md b/content/snippets/js/s/index-for-of-loop.md index 44a7a5fb426..71a34246ac3 100644 --- a/content/snippets/js/s/index-for-of-loop.md +++ b/content/snippets/js/s/index-for-of-loop.md @@ -1,5 +1,5 @@ --- -title: "Tip: Get the index of an array item in a JavaScript for...of loop" +title: Get the index of an array item in a JavaScript for...of loop shortTitle: Array index in for...of loops type: tip language: javascript diff --git a/content/snippets/js/s/json-stringify-pick-keys.md b/content/snippets/js/s/json-stringify-pick-keys.md index 712971147ac..88a0bea6c29 100644 --- a/content/snippets/js/s/json-stringify-pick-keys.md +++ b/content/snippets/js/s/json-stringify-pick-keys.md @@ -1,5 +1,5 @@ --- -title: "Tip: Serialize specific properties from a JSON object" +title: Serialize specific properties from a JSON object shortTitle: Selective property serialization type: tip language: javascript diff --git a/content/snippets/js/s/last-element-of-array.md b/content/snippets/js/s/last-element-of-array.md index 6f0666d3d55..b2b862030a7 100644 --- a/content/snippets/js/s/last-element-of-array.md +++ b/content/snippets/js/s/last-element-of-array.md @@ -1,5 +1,5 @@ --- -title: "Tip: Get the last element of a JavaScript array" +title: Get the last element of a JavaScript array shortTitle: Last element of array type: tip language: javascript diff --git a/content/snippets/js/s/make-iterable.md b/content/snippets/js/s/make-iterable.md index b775ff01aae..129868a06bf 100644 --- a/content/snippets/js/s/make-iterable.md +++ b/content/snippets/js/s/make-iterable.md @@ -1,5 +1,5 @@ --- -title: "Tip: Make any JavaScript value iterable" +title: Make any JavaScript value iterable shortTitle: Make any value iterable type: tip language: javascript diff --git a/content/snippets/js/s/n-min-max-elements-in-array.md b/content/snippets/js/s/n-min-max-elements-in-array.md index 543609652cd..0b490d7510e 100644 --- a/content/snippets/js/s/n-min-max-elements-in-array.md +++ b/content/snippets/js/s/n-min-max-elements-in-array.md @@ -1,5 +1,5 @@ --- -title: "Tip: Find the n min or max elements in a JavaScript array" +title: Find the n min or max elements in a JavaScript array shortTitle: N min or max elements of an array type: tip language: javascript diff --git a/content/snippets/js/s/nodejs-chrome-debugging.md b/content/snippets/js/s/nodejs-chrome-debugging.md index 7b842c3cab5..e417bb56380 100644 --- a/content/snippets/js/s/nodejs-chrome-debugging.md +++ b/content/snippets/js/s/nodejs-chrome-debugging.md @@ -1,5 +1,5 @@ --- -title: "Tip: Debugging Node.js using Chrome Developer Tools" +title: Debugging Node.js using Chrome Developer Tools shortTitle: Debug Node.js with Chrome Developer Tools type: tip language: javascript diff --git a/content/snippets/js/s/passive-scroll-listener-performance.md b/content/snippets/js/s/passive-scroll-listener-performance.md index 06e107cd8c5..d3fe698df8c 100644 --- a/content/snippets/js/s/passive-scroll-listener-performance.md +++ b/content/snippets/js/s/passive-scroll-listener-performance.md @@ -1,5 +1,5 @@ --- -title: "Tip: Improve scroll listener performance" +title: Improve JavaScript scroll listener performance shortTitle: Improve scroll listener performance type: tip language: javascript diff --git a/content/snippets/js/s/pretty-print-json.md b/content/snippets/js/s/pretty-print-json.md index 90667639039..9e2f3381bcb 100644 --- a/content/snippets/js/s/pretty-print-json.md +++ b/content/snippets/js/s/pretty-print-json.md @@ -1,5 +1,5 @@ --- -title: "Tip: Pretty-print a JSON object with JavaScript" +title: Pretty-print a JSON object with JavaScript shortTitle: Pretty-print JSON type: tip language: javascript diff --git a/content/snippets/js/s/prevent-string-being-escaped.md b/content/snippets/js/s/prevent-string-being-escaped.md index e3614da5adf..8971a99bd6d 100644 --- a/content/snippets/js/s/prevent-string-being-escaped.md +++ b/content/snippets/js/s/prevent-string-being-escaped.md @@ -1,5 +1,5 @@ --- -title: "Tip: Prevent a string from being escaped in JavaScript" +title: Prevent a string from being escaped in JavaScript shortTitle: Prevent string escaping type: tip language: javascript diff --git a/content/snippets/js/s/promise-then-catch.md b/content/snippets/js/s/promise-then-catch.md index d66167c0766..3b0d67a968b 100644 --- a/content/snippets/js/s/promise-then-catch.md +++ b/content/snippets/js/s/promise-then-catch.md @@ -1,6 +1,5 @@ --- -title: "Tip: The order of then and catch matters" -shortTitle: The order of then and catch matters +title: The order of then and catch matters type: tip language: javascript tags: [function,promise] diff --git a/content/snippets/js/s/query-selector-shorthand.md b/content/snippets/js/s/query-selector-shorthand.md index 87cef0b83fa..4138ca6811c 100644 --- a/content/snippets/js/s/query-selector-shorthand.md +++ b/content/snippets/js/s/query-selector-shorthand.md @@ -1,5 +1,5 @@ --- -title: "Tip: Create your own query selector shorthand" +title: Create your own query selector shorthand in vanilla JavaScript shortTitle: Query selector shorthand type: tip language: javascript diff --git a/content/snippets/js/s/remove-array-duplicates.md b/content/snippets/js/s/remove-array-duplicates.md index d8921ccedb9..ed1c0c305ee 100644 --- a/content/snippets/js/s/remove-array-duplicates.md +++ b/content/snippets/js/s/remove-array-duplicates.md @@ -1,5 +1,5 @@ --- -title: "Tip: Remove duplicates from a JavaScript array" +title: Remove duplicates from a JavaScript array shortTitle: Remove duplicates from an array type: tip language: javascript diff --git a/content/snippets/js/s/select-focused-dom-element.md b/content/snippets/js/s/select-focused-dom-element.md index e897d1b029f..c9ae0c3e863 100644 --- a/content/snippets/js/s/select-focused-dom-element.md +++ b/content/snippets/js/s/select-focused-dom-element.md @@ -1,5 +1,5 @@ --- -title: "Tip: Select the focused DOM element" +title: Select the focused DOM element with JavaScript shortTitle: Focused DOM element type: tip language: javascript diff --git a/content/snippets/js/s/store-dom-items.md b/content/snippets/js/s/store-dom-items.md index f8cb1ba1a5b..619c01fceb9 100644 --- a/content/snippets/js/s/store-dom-items.md +++ b/content/snippets/js/s/store-dom-items.md @@ -1,5 +1,5 @@ --- -title: "Tip: Minimize DOM access" +title: Minimize DOM access in JavaScript shortTitle: Minimize DOM access type: tip language: javascript diff --git a/content/snippets/js/s/string-to-boolean.md b/content/snippets/js/s/string-to-boolean.md index 5cf1b63de7c..dc6ffdb3774 100644 --- a/content/snippets/js/s/string-to-boolean.md +++ b/content/snippets/js/s/string-to-boolean.md @@ -1,5 +1,5 @@ --- -title: "Tip: Convert a string to a boolean" +title: Convert a string to a boolean shortTitle: String to boolean type: tip language: javascript diff --git a/content/snippets/js/s/swap-two-variables.md b/content/snippets/js/s/swap-two-variables.md index b9457412a7d..129f6dba750 100644 --- a/content/snippets/js/s/swap-two-variables.md +++ b/content/snippets/js/s/swap-two-variables.md @@ -1,5 +1,5 @@ --- -title: "Tip: How to swap two variables in JavaScript" +title: How to swap two variables in JavaScript shortTitle: Swap two variables type: tip language: javascript diff --git a/content/snippets/js/s/typecheck-array.md b/content/snippets/js/s/typecheck-array.md index 06d2ceb5309..b7903ec8c2c 100644 --- a/content/snippets/js/s/typecheck-array.md +++ b/content/snippets/js/s/typecheck-array.md @@ -1,5 +1,5 @@ --- -title: "Tip: Typechecking arrays with Array.isArray()" +title: Typechecking arrays with Array.isArray() shortTitle: Array typechecking type: tip language: javascript diff --git a/content/snippets/js/s/value-as-number.md b/content/snippets/js/s/value-as-number.md index 6fd1e4e3c20..6fb7145d01d 100644 --- a/content/snippets/js/s/value-as-number.md +++ b/content/snippets/js/s/value-as-number.md @@ -1,5 +1,5 @@ --- -title: "Tip: You can get the value of an input element as a number" +title: You can get the value of an input element as a number shortTitle: Input element value as number type: tip language: javascript diff --git a/content/snippets/js/s/void-links.md b/content/snippets/js/s/void-links.md index 5c5e0cbc53d..64b36ebb762 100644 --- a/content/snippets/js/s/void-links.md +++ b/content/snippets/js/s/void-links.md @@ -1,6 +1,5 @@ --- -title: "Tip: Avoid \"javascript:void(0)\" for empty links" -shortTitle: Avoid "javascript:void(0)" for empty links +title: Avoid "javascript:void(0)" for empty links type: tip language: javascript tags: [browser,accessibility] diff --git a/content/snippets/python/s/bare-except.md b/content/snippets/python/s/bare-except.md index e083616a84d..55dacc6c4bb 100644 --- a/content/snippets/python/s/bare-except.md +++ b/content/snippets/python/s/bare-except.md @@ -1,9 +1,10 @@ --- -title: "Tip: Avoid using bare except in Python" +title: Avoid using bare except in Python shortTitle: Bare except best practices type: tip language: python tags: [error] +author: chalarangelo cover: dark-cloud excerpt: It's generally not a good idea to use bare `except` clause in Python, but do you know why? dateModified: 2022-02-20 diff --git a/content/snippets/python/s/dict-getkey-vs-dictkey.md b/content/snippets/python/s/dict-getkey-vs-dictkey.md index af9735e4e32..c5c9388bbc8 100644 --- a/content/snippets/python/s/dict-getkey-vs-dictkey.md +++ b/content/snippets/python/s/dict-getkey-vs-dictkey.md @@ -1,9 +1,10 @@ --- -title: "Tip: You should use dict.get(key) instead of dict[key]" +title: You should use dict.get(key) instead of dict[key] shortTitle: dict.get(key) vs dict[key] type: tip language: python tags: [dictionary] +author: chalarangelo cover: compass-2 excerpt: Learn the difference between two common ways to access values in Python dictionaries and level up your code today. dateModified: 2021-06-12 diff --git a/content/snippets/python/s/fstrings-str-format.md b/content/snippets/python/s/fstrings-str-format.md index 56c3d86250d..c0ab9b4e8ff 100644 --- a/content/snippets/python/s/fstrings-str-format.md +++ b/content/snippets/python/s/fstrings-str-format.md @@ -1,9 +1,10 @@ --- -title: "Tip: 2 ways to format a string in Python" +title: 2 ways to format a string in Python shortTitle: String formatting type: tip language: python tags: [string] +author: chalarangelo cover: feathers excerpt: Learn two ways to format a string in Python with this quick tip. dateModified: 2021-06-12 diff --git a/content/snippets/python/s/mutable-default-arguments.md b/content/snippets/python/s/mutable-default-arguments.md index 9367be1cf31..1117715391d 100644 --- a/content/snippets/python/s/mutable-default-arguments.md +++ b/content/snippets/python/s/mutable-default-arguments.md @@ -1,9 +1,10 @@ --- -title: "Tip: Watch out for mutable default arguments in Python" +title: Watch out for mutable default arguments in Python shortTitle: Mutable default arguments type: tip language: python tags: [function] +author: chalarangelo cover: goat-wooden-cottage excerpt: Mutable default arguments can trip up Python beginners and veterans alike. Here's a quick workaround to deal with them. dateModified: 2022-02-27 diff --git a/content/snippets/python/s/setup-python3-pip3-as-default.md b/content/snippets/python/s/setup-python3-pip3-as-default.md index 38386331260..bd9335f25f6 100644 --- a/content/snippets/python/s/setup-python3-pip3-as-default.md +++ b/content/snippets/python/s/setup-python3-pip3-as-default.md @@ -1,5 +1,5 @@ --- -title: "Tip: Set up Python 3 and pip 3 as default" +title: Set up Python 3 and pip 3 as default shortTitle: Python 3 and pip 3 setup type: tip language: python diff --git a/content/snippets/python/s/sort-dictionary-tuple-key.md b/content/snippets/python/s/sort-dictionary-tuple-key.md index 1315a2df0bf..2e38480ac78 100644 --- a/content/snippets/python/s/sort-dictionary-tuple-key.md +++ b/content/snippets/python/s/sort-dictionary-tuple-key.md @@ -1,5 +1,5 @@ --- -title: "Tip: Sort Python dictionary list using a tuple key" +title: Sort Python dictionary list using a tuple key shortTitle: Sort dictionary list using a tuple key type: tip language: python diff --git a/content/snippets/react/s/conditional-classname.md b/content/snippets/react/s/conditional-classname.md index e557bdf879f..ecc5a13631b 100644 --- a/content/snippets/react/s/conditional-classname.md +++ b/content/snippets/react/s/conditional-classname.md @@ -1,9 +1,10 @@ --- -title: "Tip: React conditional className, empty strings and null" +title: React conditional className, empty strings and null shortTitle: Conditional className type: tip language: react tags: [components] +author: chalarangelo cover: succulent-red-light excerpt: In React components, you might need to conditionally apply a `className`. Learn how to handle empty values correctly using this handy tip. dateModified: 2021-11-07 diff --git a/content/snippets/react/s/use-effect-primitive-dependencies.md b/content/snippets/react/s/use-effect-primitive-dependencies.md index 326c31d2676..548139c7bb5 100644 --- a/content/snippets/react/s/use-effect-primitive-dependencies.md +++ b/content/snippets/react/s/use-effect-primitive-dependencies.md @@ -1,5 +1,5 @@ --- -title: "Tip: Prefer primitives in useEffect dependencies" +title: Prefer primitives in useEffect dependencies shortTitle: Primitive useEffect dependencies type: tip language: react diff --git a/content/snippets/react/s/use-state-with-label.md b/content/snippets/react/s/use-state-with-label.md index 823483b2652..f52bee85d4f 100644 --- a/content/snippets/react/s/use-state-with-label.md +++ b/content/snippets/react/s/use-state-with-label.md @@ -1,5 +1,5 @@ --- -title: "Tip: Label your useState values in React developer tools" +title: Label your useState values in React developer tools shortTitle: Labelling useState values type: tip language: react