Monthly Shaarli
November, 2021
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.
A random git commit joke on each refresh :D
And only the text version of it: http://whatthecommit.com/index.txt
The new right tool to install an OS on a Raspberry Pi
Improve the quality of a picture using GAN. There are models for specialized pictures such as anime.
This project has a great roadmap with models for human faces and texts. More options: scaling et controllable restoration strength are on it too.
About data structures, immutable and mutable data, programming model, public interface, distributed system, always having a limit for everything and trust your gut.
- De quoi parle-t-on ?
l’architecture micro frontend c’est faire d’une application web front-end un ensemble d’applications indépendantes (cycle de vie, complexité, technologie) cohabitant et communiquant sur le même site.
-
Concrètement, pourquoi faire ?
-
front + front = front ?
Technologies pour les construire:- Web Components
- Node.js / Express / EJS
- Framework Single SPA
-
Comment les applications communiquent entre elles ?
- Attributes et properties
- DOM / Custom Events
- Solution de state management
- sessionStorage / localStorage / cookies
-
Quelle stratégie de tests utiliser ?
-
Ai-je vraiment besoin des micro frontends ?
Okay so these guys built a WebAssembly based virtual machine to run x86 binaries. SO you can run ANY type of programs in the browser !
Acheter des livres d'occasion est possible sur cette plateforme.
Solution: Using 1 subgrid per element inside a grid.
Beaucoup de vérités dans cet article que je garde sous le coude.
On présume que les nouvelles générations, nées à l’ère du tout numérique ont une connaissance accrue dans ce domaine, mais ce phénomène d’illectronisme touche bien toutes les catégories de la population. D’autant plus qu’il est possible de maîtriser certains types d’utilisation mais pas d’autres. Par exemple on peut être à l’aise dans le domaine du divertissement (visionner une vidéo, utiliser les réseaux sociaux), mais pas dans celui de la communication (envoyer un e-mail, visionner une pièce jointe, scanner un document) ou dans le domaine des démarches professionnelles, scolaires ou administratives.
Des exemples de sites collaboratifs où les contributrices et contributeurs qui agissent pour faire une bonne action.
I share this point of view
A great introduction to the lotus blossom.
I use it to get some ideas for the User-centered design methods class
A code snippet is provided for it. Well done.
Un logiciel 3D simple d'utilisation qui permet d'exporter des scènes 3D (zoom et mouvement de la caméra par l'utilisateur inclus).
Possibilité d'export en .jpg, .png, .gif ou format JS, HTML, CSS pour l'intégration.
Wow a map of so much favicons !
And the investigation of it: https://iconmap.io/blog
A codesandbox or codepen like-service. The older one.
FYI it was created by Joel Spolsky.
If you’re an enterprising pedophile with a basement full of CSAM-tainted iPhones, Apple welcomes you to entirely exempt yourself from these scans by simply flipping the “Disable iCloud Photos” switch, a bypass which reveals that this system was never designed to protect children.
Ok so this whole system is built, but can so easily be bypassed? Did I miss something ?
Ces gestes sont bien pratiques, et finalement plus claire dans une réunion que chacun qui s'exprime dès le départ oralement.
À voir comment ils pourraient être adopté.
A cloud platform for personal data with lifetime offers. Privacy friendly. Okay 👍
Another file transfer service.
I stays with wormhole for now. But it is always useful to now alternatives.
A project to check email, because it is hard to do it by hand !
The classic but the one I forget everytime ! A bank of images that are free to use
Generate browser images from raw images 👍
Useful to get a presentation of a website with screenshots of it. In gives more context about webviews :)
Why would I use this?
If you just want to launch already.
An MVP is a temporary site, it doesn't have to be and shouldn't be perfect.
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.
The collaborative library of tips among design professionals. Share and learn from your peers.
I will wander around this site in my spare time and learn a few things here and there :)
In favor of php. It provides a summary of its current ecosystem.
Un autre exemple de WTF où l'on se dit que les vélos c'est bien mais c'est tout. OSEF quoi
Pour la culture
Nua.ge serais donc une alternative à AWS pour les PME, startup, etc... ok :)
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.
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
A curated list of CSS named colors.
mBarker84 made a list with these names only on Github
Develop an API that is fast :)
Everything is built in: Swagger or OpenAPI, including the tests.
Here a quickstart
Je pose cela ici.
Why this post ?
The software industry is filled with a chaotic mess of a developer experience. Everything and anything can break.
🤣😭
If you figure out something fun, and integration that otherwise wasted an hour or two. Find ways to document it. On StackOverflow or on your blog or what have you. Just do that. Many developers including your future self will thank you for that.
So does this implies writing question and posting your own answer ?
About the workflow with Git and best practices 👍
Mix 2 emojis together !
A minimal CSS reset with every line explained.
Je veux être fier de mon travail. Je veux fournir des choses qui fonctionnent, qui sont stables. Pour faire ça, il faut que l’on comprenne ce que nous faisons, à l’entrée et à la sortie, et ça ne peut pas se faire dans un système fourre-tout avec autant de surcouches.
👍 pour tout ce qui est énoncé dans ce billet de blog
Checklist to set up a new python project on Github
Another bank of images that are free to use
Generate and share logos fast
I find it also useful to run eslint src/* ---fix
I hop cargo fmt
in the future.
Mhmhmh ok ! I note the hyperfine
command to benchmark the speed of cli commands :)
Free for personal and commercial use (CC-BY ?)
Hey, on m'a assigné des bugs à corriger sur ton dernier projet, mais j'ai l'impression qu'il n'y a pas de documentation ?
Hein ?
Bien sûr qu'il y a de la doc. Il y a des infos dans des readme, et des éléments sur le Jira. Ou alors c'est dans le Trello. En plus, on a mis des infos sur des Google Docs dans un dossier partagé, regarde si t'as les droits. Même si c'est pas à jour c'est utile. Et, au pire, il y a plein de commentaires contextuels dans le code...
Bref, c'est bien ce que je disais... y a pas de doc
- Burn-out
- Bore-out
- Brown-out
in-house expertise is needed at some point.
It allows:
- to share ideas with own blogs
- stay informed in real time
- discover new blogs (via reference in an article or webring)
So the idea is to parse them with an engine ! Here comes RSS Discovery Engine
LeHollandaisVolant collecte les petits sites indépendants qu'il trouve et les mets ici :)
Impressive :)
The example about youtube-gif is a great example of what can be done fast !
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
uBlockOrigin has more power than pihole that only blocks network requests. A comment explains some points about it.
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.
border-radius: max(0px, min(8px, calc((100vw - 4px - 100%) * 9999)));
→ maybe too clever as the line is hard to understand.
and
grid-template-columns: repeat(auto-fit, minmax(min(350px, 100%), 1fr));
This is a great snippet, but there is absolutely zero chance I’m going to remember how to write it every time.
Another trick is to use a toggle value stored in a css variable.