Frontend
Animated SVG Avatar v2
#UI #UX #Frontend
Prototype de fenêtre de login où on voit un avatar qui suit le curseur dans le champ d'e-mail, qui se cache les yeux quand on tape le mot de passe, sauf quand on affiche le contenu du champ, là il regarde discrètement à travers ses doigts.
Vraiment ça prend 1min de tester, c'est fun !
Ce niveau d'animation ne me semble pas utile mais clairement ça montre qu'on peut faire des trucs pour rendre les interfaces funs !
Table ronde sortie Angular 19 -- Angular Devs France
#Angular #Angular-Devs-France #Frontend
J'ai pas mal enchaîné et j'ai oublié de partager la sortie d'Angular 19. Ici le live qu'on a fait avec Angular Devs France (avec un invité surprise 😇) où on discute de toutes les nouveautés en suivant l'article de Ninja Squad : https://blog.ninja-squad.com/2024/11/19/what-is-new-angular-19.0/
Astro 5.0
#Astro #UI #Web #Frontend
Comme d'habitude avec Astro : une nouvelle version majeure, avec pas mal de nouveauté sans casser ce qui fonctionne déjà !
L'amélioration du chargement des données avec la "Content Layer". L'idée c'est d'offrir des moyens type-safe de charger des données pour les utiliser comme des collections. C'est comme toujours simple et propre.
L'introduction du concept de Server Island, pour pouvoir, comme avec les Island (qui sont client-side), introduire des briques dynamiques dans du contenu statique pour avoir toujours un rendu très rapide et du dynamisme que là où on en a besoin.
De nouvelles options pour le pré-rendu, clairement pour accompagner l'arrivée des Server Island.
Une nouvelle manière de gérer les variables d'environnements pour bien s'assurer que certaines variables ne soient jamais transmises au client ou compilé en clair dans le bundle. Avec à nouveau tout un système type-safe, simple et bien pensé.
Cette version introduit aussi Vite 6 et des fonctionnalités expérimentales autours des images responsives.
Smooth Multi-Page Experiences with Just a Few Lines of CSS - HTMHell
#CSS #Frontend #UI #Web
L'article montre des exemples très simple de l'utilisation des View Transitions. Quelques lignes de CSS qu'on peut mettre sur n'importe quel site pour rendre plus fluide l'expérience utilisateur.
2 points quand même :
- ça ne fonctionne que sur Chrome / Safari (et les dérivés), et pas sur Firefox (forte tristesse de mon côté mais bon...)
- il faut aussi penser à mettre les 3-4 lignes qui coupent les View Transitions pour les utilisateurs qui le demandent (l'option
prefers-reduced-motion: reduce) pour respecter les personnes qui pourraient être gênées par les transitions
Native HTML light and dark color scheme switching - HTMHell
#CSS #Frontend #UI #Web
Quelques astuces sur la création de thèmes light/dark via la propriété color-scheme et la fonction light-dark() avec tout ce qui va avec. C'est essentiellement dû CSS, c'est super puissant quasi tout géré par le navigateur sans effort. C'est supporté par tous les navigateurs depuis mai 2024.
Color Generator
#UI #Frontend #CSS #Web
Choisir des couleurs est toujours complexe. Ici un générateur qui permet de générer un set de 4 couleurs avec variantes light et dark, utilisable en un coup de copié-collé sans effort.
Avec un rappel qu'on a pas besoin de plus de 4 couleurs et quand les utiliser.
Franchement un très bel outil !
Note : ce générateur utilise ma fonction hsl() pour définir les couleurs, qu'on utilise pas forcément encore tous alors que c'est dispo sur tous les navigateurs depuis 5 ans (2020 c'est loin déjà 😉), donc c'est aussi l'occasion de découvrir ça !
IA
Sorry Human, You're Wrong - by Marcel Salathé
#IA #LLM #OpenAI
Une personne qui fait du piano depuis 15 ans décide de tester la capacité à reconnaître un morceau à partir d'une photo de partition. Tous les modèles d'IA se sont trompés en admettant facilement l'erreur sauf une : OpenAI o1 pro qui a refusé l'erreur plusieurs fois, remettant en question l'utilisateur et son livre qui seraient tous deux dans le faux… Pour finalement accepter l'erreur seulement à moitié…
Donc les LLMs (qui passent leur temps à dire n'importe quoi vu que ce sont des modèles qui ne comprennent rien à ce qu'elles recrachent) commencent à se permettre de refuser la réalité…
Divers
JSON Patch vs JSON Merge Patch - In-Depth Comparison | Zuplo Blog
#JSON #Web
Il existe plein de stratégies pour gérer le verbe PATCH. Il existe aussi des conventions pour structurer un peu tout ça : JSON Patch et JSON Merge Patch.
I propose we replace semantic versioning with pride versioning
#Pride-Versioning #Versioning #Logiciel
I propose we replace semantic versioning with pride versioning
@nikitonsky@mastodon.online
https://mastodon.online/@nikitonsky/113691789641950263
Le fisc s'invite sur les réseaux sociaux : il peut désormais collecter et analyser les données publiées sur Instagram, TikTok ou Facebook pour détecter la fraude
#Fisc
Le FISC continue de claquer des millions pour épingler 3-4 clampins qui trichent sur leurs revenus. Alors qu'en claquant une fraction de ça (à vue de nez), on pourrait aller taper dans les poches des multinationales qui fraudes. Juste un truc à dire : 🤦♂️
Modern Work Fucking Sucks.
L'article explique à quel point en entreprise on est saturé d'outils facturés par utilisateur par mois. Outils qui s'interconnectent mais en perdant des informations ou avec un trop gros coût de maintenance des connecteurs. Outils qui volent du temps aux gens qui produisent pour offrir une pseudo-vision de ce qui se passe dans les équipes de production "magiquement" mais surtout en faisant perdre beaucoup de temps de production à tout le monde…
Pour avoir vécu et fait le même constat, j'ai envie de dire : tristement vrai…
Crédit photo : Générée via Microsoft Designer avec le prompt suivant :
newspaper, reading, press, news