228 private links
Ne jamais parler en garde à vue, car on risque de dire de la merde, même si on est innocent.
Voici pourquoi dans cet article.
A new $HOME
folder structure to improve the workflow:
name | structure | created by | status |
---|---|---|---|
tmp | (chaotic) | everyone | temporary |
work | project-name/ |
me | active |
permanent | project-name/ |
me | permanent |
archive | year/type/project-name/ |
me | done or inactive |
library | type/(subtype/) |
others | reference |
edit 2022-05-19: the more I think about it, the more I find it to be a good idea.
On google or DuckDuckGo syntax:
- "Exact match" → for an exact string
- SITE:url → search in a specified site
- AFTER:1999 or BEFORE:2020 → before or after a specified date
- 2020..2020 → search in a range
- (A | B) → search results A or B
-
- → search for all results
- FILETYPE:PDF → search for a specified filetype
- RELATED:url → search related result of this URL
9: CACHE:url → see the website that the search engine has in cache
In the configuration: "workbench.tree.indent": 20
(20 as an example of indent space amount).
Utiliser les issues de ces deux plateformes pour avoir des cheatsheets :)
Replace the .com
in the project with .dev
to open a VS code editor online.
Or the shortcut .
(dot) to go straight to this editor !
In this editor you can obviously consult all the sources of the project, but also modify them and push your changes to the github directly.
Donner l'adresse du site en
hxxps://ludovic-bois.com/index.php
afin d'éviter que les gens cliquent sur ce lien rapidement et qu'il soit référencé dans les moteurs de recherche.
Comment pister l'origine d'une requête dans une BDD
A way to render conditionally the attributes of a tag.
Creating an object and setting the attributes as prop of the object if they should be rendered. Then use the spread operator on it:
<script>
export let value = "";
export let id = "";
export let placeholder = "";
export let type = "text";
let conditionalAttributes = {};
if (id) conditionalAttributes.id = id;
if (placeholder) conditionalAttributes.placeholder = placeholder;
if (type) conditionalAttributes.type = type;
</script>
<input {...conditionalAttributes} bind:value={value} />
loading=lazy
attribute to defer the loading of the image until the user scrolls to them<datalist>
element to create native HTML autocomplete- Email, call and SMS links
- Ordered lists
start
attribute to change the starting point of an ordered list. <input type="reset" />
to get a clear button for the forms<meter>
element to display quantitieswindow.opener
returns the original page of atarget="_blank"
. This can have security and performance implications. Includerel="noopener"
orrel="noreferrer"
to prevent this.<base target="_blank">
in the<head>
to open all links in the document in a new tab.- Favicon cache busting by adding a
?v=2
to the link of the favicon <details><summary>Summary</summary><p>Details</p></details>
download
attribute to a link download the file instead of navigating to it- Use the
webp
image format to boost performance - Use the
poster
attribute to specify an image to be shown while the video is downloading, or until the user hits the play button - Use the
spellcheck
attribute to define whether the element may be checked for spelling errors.
👍
The first rule of thumb:
If you’re stuck for over an hour, seek help.
with
When you seek advice, first write down everything you’ve tried.
that as 3 benefits:
- act as a rubber duck debugging
- evidence that there is some kind of structured thought process that has been carried out, and what it was
- saving time explaining the context to someone else
If this is not useful enough, the author recommends to use his formula.
About the workflow with Git and best practices 👍
I will start using it. It seems useful if you give your email address to third-parties or to know where someone got your email from.
Solution: Using 1 subgrid per element inside a grid.
In the console: $0.offsetParent
→ $0
is the currently set element.
Then we can use the offsetParent object property to find the closest ancestor to that element that has its position set to something other than static.
Solutions:
-
styling it manually through CSS :
input:focus { outline: 2px solid deeppink; }
-
A keyup tab event listener. Think about adding the class through JS, that way the focus will still be accessible if JS fails to load.
-
the property
::focus-visible
The background color of checkboxes will be the one determined by accent-color
. Nice !
And the surrounding stays accessible whatever this color is as the webbrowsers have their own implementation of this.
touch {hero,lightbox,form,another-component}.njk
When to use the drop-shadow filter:
- on a non-rectangular shadow (or clipped elements)
- on a group of box
Limitation: it does not have the spread parameter.