Javascript

Autre

Les easter eggs sur le web

Cet article explore le concept des easter eggs dissimulés dans le code source des sites web, souvent à destination des développeurs. Il présente plusieurs exemples d'organisations qui cachent des messages ou des art ASCII, et explique comment certains fichiers comme robots.txt ou humans.txt peuvent contenir de tels messages. L'article fournit également des astuces pour intégrer des easter eggs dans vos propres projets, tout en évoquant le Code Konami et d'autres méthodes ludiques pour interagir avec les utilisateurs via la console du navigateur.

www.alsacreations.com

javascript
Dev front

Animer un bouton burger simple avec SVG et CSS

Cet article explique comment animer un bouton burger en utilisant SVG et CSS. Il détaille les étapes de création de l'icône en SVG et l'ajout de styles CSS pour réaliser des animations fluides. Le processus inclut également des considérations pour l'accessibilité et la gestion des événements via JavaScript, permettant au bouton de fonctionner comme un élément interactif. Les transitions sont expliquées en profondeur avec des instructions claires pour obtenir un résultat visuel harmonieux et efficace.

www.alsacreations.com

javascript
Dev front

Mettre en surbrillance ligne et colonne au survol d'une table

Cet article explique comment mettre en surbrillance une ligne et une colonne d'une table au survol de la souris en utilisant des techniques CSS. Il présente des solutions simples et fonctionnelles, tout en comparant l'utilisation de JavaScript et de CSS pour obtenir cet effet. L'accent est mis sur la combinaison de certaines propriétés et pseudo-éléments CSS pour créer une illusion de surbrillance sur les deux axes. Des recommandations sont également fournies pour mieux gérer l'affichage dans certaines situations.

www.alsacreations.com

javascript
Dev front

Dialog, Modal, Popover : la synthèse

L'article présente les différentes notions liées aux éléments dialog, modal et overlay en HTML, en expliquant leurs caractéristiques, leur fonctionnement, et l'importance de l'accessibilité et de la gestion des interactions utilisateur sur une page web. Il décrit notamment les différences entre éléments modaux et non-modaux, ainsi que les techniques pour gérer l'inertie du contenu lors de l'affichage d'éléments de type overlay.

www.alsacreations.com

javascript
Dev front

Les modes d'apparence Light mode et Dark mode

L'article explique le concept du mode sombre (dark mode) et ses bénéfices pour réduire la fatigue visuelle et la consommation d'énergie. Il aborde les façons d'activer cette fonctionnalité sur différents systèmes (Windows, MacOS) et dans les navigateurs (Firefox, Chrome), ainsi que l'utilisation des Devtools pour les développeurs. Il détaille aussi les couleurs système qui s'adaptent automatiquement au thème. Enfin, l'article parle de media queries pour détecter les préférences d'apparence de l'utilisateur et l'importance d'offrir aux utilisateurs la possibilité de choisir leur thème.

www.alsacreations.com

javascript
IA

IA : Interroger un LLM en JavaScript avec Ollama

Cet article explore comment interroger un modèle de langage localement grâce à Ollama, en utilisant JavaScript. Il décrit les étapes d'installation et d'utilisation de cette bibliothèque sur différentes plateformes, ainsi que les commandes essentielles pour gérer des modèles de langage. De plus, l'article offre un aperçu sur la création d'une application web simple qui interroge le modèle via Ollama, en ajoutant des éléments client-serveur, montrant que le développement d'interfaces utilisant des LLM est désormais accessible grâce aux technologies modernes.

www.alsacreations.com

javascript
Autre

Mermaid : diagrammes, schémas et graphiques dans markdown

Mermaid est un langage permettant de créer des diagrammes dynamiques en texte au sein de fichiers Markdown. Il prend en charge divers types de diagrammes (diagrammes de flux, organigrammes, graphiques Gantt) et s'intègre aisément dans des plateformes comme GitHub et GitLab. Grâce à sa syntaxe simple, les utilisateurs peuvent générer des diagrammes en SVG adaptatifs directement dans leurs fichiers README ou wikis, permettant une documentation claire et versionnable. Sa nature open-source permet également des personnalisations et l'utilisation de différents thèmes de couleur. Avec des éditeurs en ligne disponibles, les utilisateurs peuvent s'initier facilement à sa syntaxe tout en visualisant leurs créations.

www.alsacreations.com

javascript
Dev front

Les import maps en JavaScript

Les import maps permettent de gérer les imports de modules JavaScript de manière simplifiée en proposant des correspondances entre noms courts et chemins longs, idéal pour le prototypage et les petits projets. Elles améliorent la lisibilité du code et facilitent la gestion des dépendances sans nécessiter de spécification des versions dans chaque import. Cependant, elles ont des limitations, spécialement quand utilisées avec des frameworks avancés comme Vite, et ne supportent pas certaines fonctionnalités d'optiomisation comme le hot reloading.

www.alsacreations.com

javascript
Dev front

Vue 2 is Approaching End Of Life | The Vue Point

L'article informe la communauté Vue que Vue 2 atteindra sa fin de vie le 31 décembre 2023. Bien que Vue 2 ait été largement utilisé et ait vu le développement de nombreuses applications, la maintenance de deux versions majeures en parallèle n'est plus viable. Des mises à jour de sécurité et des corrections de bogues seront fournies jusqu'à la date limite, après quoi Vue 2 ne recevra plus de nouvelles fonctionnalités. Les utilisateurs sont encouragés à migrer vers Vue 3, qui offre de meilleures performances et de nouvelles fonctionnalités. Des options telles que le soutien prolongé pour Vue 2 sont également disponibles.

blog.vuejs.org

javascript