Nous évaluons la véracité d'une information avec l'impression immédiate qu'elle nous fait, et lorsque nous la retransmettons, nous optimisons ses chances d'être crue.
Petite liste de fonctionnalités implémentées depuis ECMAScript 5 que vous ne connaissez peut-être pas ! Une traduction de l'article Using ECMA5 in Node.js
Comprendre pourquoi il y a des modules du cœur de l'écosystème et des modules satellites. Une traduction de l'article What is node core versus userland
Qu'est-ce que le REPL ou l'exécution de Node.js dans un invité de commande et comment l'utiliser ? Une traduction de l'article How do I use node's REPL?
Comment temporiser les actions avec des fonctions “timer” côté serveur pour jouer avec la boucle d'évènement ? Une traduction de l'article What are the built-in timer functions?
Pourquoi existe t'il un module console en Node.js puisqu'il existe des équivalences dans le module process ? Une traduction de l'article The built-in console module
Un exemple de comment analyser les paramètres passés à une commande dans un invité de commande. Une traduction de l'article How to parse command line arguments
Comment décrire simplement pour un développeur et un programme ce qu'est et fait votre développement ? Une traduction de l'article What is the file package.json?
Je suis fan de Munchkin depuis des années maintenant ! Mais j'ai un assez gros problème depuis quelques temps avec le Munchkin : plus les extensions augmentes et plus j'ai des difficultés à pouvoir jouer avec des jeux équilibrés. Vous avez peut-être le même sentiment et si vous vous êtes déjà confronté aux problèmes listés ci-après, cette page peut vous être utile !
Fait, opinion, information, fond, forme... si le « fact-checking » existe, c'est peut-être que les faits ne sont pas si robuste qu'on se plaît à le croire.
La liste des « sophismes » permet de repérer facilement les faiblesses d'un argument. Mais cet outil si cher à la communauté sceptique est-il réellement efficace ?
Si je vous parle de dés, immédiatement vous imaginez un petit cube à 6 faces numérotées de 1 à 6 : c'est ce que l'on appel un d6 dans le jargon des jeux de rôle. Mais le d6 n'est pas le seul, et surtout, le d6 plus performant en terme d'équilibre de hasard.
C'est pourquoi je souhaite vous présenter le seul dé capable de simuler à lui seul des dés comme les d4, d6, d8, d10, d12 ou d20 et j'en passe tout en étant le plus équilibré qu'il soit possible de l'être : j'ai nommé le d120 !
Je vous propose de découvrir dans cet article :
pourquoi le d120 est appelé (ici) le dé ultime,
comment le d120 peut être à lui seul utilisé pour faire office de d1 jusqu'au d119 (en passant bien entendu par le très utile d100),
les tables de correspondance associées des dés multiples de 120,
les outils pour aligner votre d120 sur vos statistiques ou aligner vos statistiques sur votre d120.
les idées originales pour profiter des 120 valeurs à votre disposition.
On finira bien entendu par le moyen de vous procurrer le d120 !
Si vous êtes développeur JavaScript et que vous cherchez des exemples d'utilisation de Vue.js à la volée (comme on utiliserait simplement jQuery), ou que vou souhaitez vérifier les fonctions utilisées dans cet article, vous pouvez jeter un œil au code source de cet article derrière le CodePen suivant : https://codepen.io/MachinisteWeb/pen/qGQLvp
Cet article fait office de conventions d'architecture d'un site web orienté composant pour la partie cliente, peu importe la technologie d'implémentation finale, de manière à ce que le code soit valide, performant et maintenable par des développeurs front-end, des développeurs back-end ainsi que des pousseurs de contenu. Ces techniques étant en constantes évolution, et les problématiques évoluant au fur et à mesure de mes itérations créatives, cet article est voué à se compléter et changer.
Je viens de (re)terminer la lecture du Guide CSS Fr et j'ai eu envie d'apporter quelques modifications et ajouts à ces très bons conseils. Cet article va donc en quelque sorte constituer mes conventions en matière de création et maintenance HTML et CSS. Elles sont donc identiques à ce qui est écrit sur Guide CSS Fr à cet article prêt !
N'ayant rien à ajouter aux parties autres que « 4. Convention de nommage », je passe directement à mes propres conventions de nommage en vous sensibilisant à l'anatomie d'une page HTML.
Je finirai néanmoins par pointer du doigt une erreur, sinon la seule, en ce qui concerne la totale inutilité du préfixe .js- destiné à séparer le visuel du fonctionnel.
Note : Tous les exemples d'inclusion de fragment HTML sont tirés du framework Node.js NodeAtlas mais c'est juste à titre illustratif, c'est la même chose avec vos frameworks préférés.
Si vous avez déjà tenté d'installer des modules npm pour Node.js sous Windows via la commande npm install <package> [options], vous avez probablement déjà eu des soucis d'installation et abandonné l'idée. Peut-être même que vous ne vous êtes pas lancé dans l'aventure Node.js pour ces raisons ? Effectivement, certains modules ont besoin de Python pour s'installer et d'autres du MSBUILD de Visual Studio. Il y en à même, plus rare, qui on besoin de Git.
Par exemple, node-mariasql est un module qui nécessite que Python et Visual Studio soient sur la machine Windows pour être installé sans quoi vous obtiendrez des erreurs.
Voici la procédure d'installation des pré-requis nécessaires pour faire fonctionner Node.js et tous ses modules npm sous Windows ainsi qu'une aide à la résolution de problèmes divers après installation.
Nous allons voir dans cet article comment créer rapidement un système permettant de surveiller si une touche du clavier est enfoncée lors de l'exécution d'une action dans votre navigateur ou mieux, si une série de touche est enfoncée pour autoriser / lancer l'exécution d'une action lors de la pression, par exemple, sur « Ctrl + Alt + E ».
Si Svn (Subversion) est la version « client-server » d'un système de gestion de version, alors Git en est sans conteste la version « peer-to-peer ».
Si vous découvrez le système de gestion de version Git et que vous l'utilisez seul et occasionnellement, il existe peut-être encore beaucoup de zones d'ombre pour vous sur son utilisation ainsi que sur la totalité des possibilités offertes. D'ailleurs, êtes-vous réellement sûr de comprendre la portée de ce système de gestion de version distant et distribué ?
C'était également mon cas. Tout le long de mon amélioration continue de l'utilisation de Git, je vais maintenir cet aide-mémoire. Il abordera :
la raison d'être de Git par l'exemple,
la description des actions de Git pour un travail sur une branche,
la description d'une méthode de travail multi-branche avec Git et
le description de Git avec de multiples sources via GitHub.
Si vous ne connaissez vraiment pas grand chose à Git n'hésitez pas à lire : Démarrage rapide de GIT et particulièrement :
Si vous faites du JavaScript régulièrement —et il est de plus en plus difficile d'y couper si vous êtes développeur web—, vous vous êtes peut-être déjà posé cette question : « Quelle est la différence entre la valeur null et la valeur undefined ? ». Question qu'on ne se pose pas quand on vient d'un autre langage.
Si nous résumons ensemble nous pouvons tomber d'accord sur le fait que :
Null et Undefined sont tous les deux des types ne possédant qu'une seule valeur ; les constantes respectives null et undefined.
Ils s'utilisent tous les deux pour indiquer « l'absence ».
Ils sont tous les deux évalués à false dans un contexte booléen (ex. : dans une structure de contrôle conditionnelle if, avec l'opérateur binaire d'égalité a == b, avec l'opérateur ternaire conditionnel a ? b : c, etc.).
En gros, ils servent donc à la même chose non ? Cette réponse ne me convient pas car, même s'il est vrai qu'à chaque première vu les comportements JavaScript semblent « loufoque », l'expérience m'a toujours montré que « c'était moi » qui n'avait pas compris correctement le JavaScript. Si les deux types existes, il y a probablement une distinction. Voici ce qui en est concrètement dit :
La valeur undefined appartient au type primitif Undefined et est utilisée quand aucune valeur typée n'a été assignée à une variable.
La valeur null appartient au type primitif Null et représente l'absence de valeur, la non-existence d'une référence dans une variable.
La distinction est plus clair ainsi non ? Pas vraiment... On va retrousser nos manches et regarder un peu ce qu'on peut éclaircir. Si vous n'avez pas le temps de suivre l'explication exhaustive (et intéressante je l'espère) qui va suivre, je vous laisse filer à la conclusion qui répond à cette question. Si par contre vous êtes curieux et/ou avez le temps de comprendre les différences, c'est juste en dessous !
Vue.js est un framework JavaScript client progressif permettant de créer, maintenir et évoluer des interfaces utilisateurs en liant les données utilisées entre la Vue et le Model. C'est une alternative sérieuse à React, Angular et les autres frameworks MVVM (Modèle Vue VueModèle).
J'ai eut l'occasion d'essayer Vue.js dans sa version 1 et son extrême simplicité et flexibilité m'a séduite. À l’instar de NodeAtlas, sa puissance vient de ses fonctionnalités intégrables de manière évolutives et versatiles ; on peut tout aussi bien utiliser Vue simplement sur le formulaire d'une page ou à plus grande échelle avec des composants et du routage à travers l'architecture d'un site complet.
Cependant, là où en version 1, Vue paraissait une alternative séduisante à AngularJS (aka Angular 1) ou Knockout, dans sa version 2 il devient de plus une alternative sérieuse à Angular (aka Angular 2), React et les autres frameworks MVVM tant sur le plan des fonctionnalités que des performances.
Pour faire simple —si vous débarquez dans le monde des framework JavaScript client MVVM et que vous ne savez pas quoi choisir— vous devriez choisir Vue ! Quoi qu'il arrive, il sera un choix pertinent pour les cas d'utilisation que vous en ferrez.
Nous allons dans cet article :
rapidement exposer pourquoi vous devriez utiliser Vue en lieu et place de Angular ou React dès maintenant et
lire la traduction des explications approfondies à propos des différences entre Vue et les autres frameworks.
NodeAtlas est une application multi-os écrite en Node.js qui va vous permettre de créer, modifier et maintenir tout un ensemble de maquette HTML. Ces maquettes HTML pourront ensuite être validées par le client, et ré-utilisées totalement ou en partie par les développeurs Back-end quelque soit leurs technologies. Ces maquettes HTML pourront également servir de site stand-alone fonctionnant sans serveur ou avec un simple serveur HTTP pour créer des documentations JSDoc ou autre comme pour GitHub par exemple. C'est ce que nous allons voir dans cet article.
Mais NodeAtlas permet également de faire tourner des sites web complet, performant et rapide tel que le site sur lequel vous être entrain de lire cet article.
Connaissez-vous ce petit code de triche qu'est le Konami Code ? Ce code à entrer dans les jeux vidéos permet de débloquer des options secrètes. Je vous propose de l'implémenter sur vos sites web en JavaScript avec une petite API maison gérant le clavier et le tactile. Suivez le guide !
L'API présenté dans cet article lève un événement JavaScript quand vous entrez la célèbre séquence du Konami Code « Haut Haut Bas Bas Gauche Droite Gauche Droite B A » avec votre clavier. Cela marche également avec votre doigt en glissant « Haut Haut Bas Bas Gauche Droite Gauche Droite » puis en faisant « Tap Tap ».
Ce qui m'a interpellé la première fois que j'ai pu m'essayer à AngularJS, c'est la possibilité offerte de sélectionner les services que l'on souhaite en les récupérant par leur nom d'argument, et non par leur position d'argument. Ce concept n'existe pas en JavaScript et pourtant le fait est bien là : function ($scope, $http) ou function ($http, $scope) renvoi les bons contenus de variable en fonction de leurs noms et function (scope, $http) vous dit que scope n'existe pas !
Comment cela est-il possible en JavaScript ? Il est possible de « simuler » un passage par nom d'argument avec un type Object en utilisant ses noms de propriété, mais là, il s'agit bel et bien de différents arguments.
Voici le petit exercice que je vous propose dans cet article, faire du « Reverse Engineering » sur le mécanisme « caché » permettant aux fonctions de rappel (callback) JavaScript de délivrer leurs arguments par « nom d'argument » en lieu et place du mécanisme natif qui est par « position d'argument ».
Note : on parle souvent de passage par « nom de paramètre » dans les autres langages. Ici, en réalité, il s'agit plutôt de passage par nom d'argument car cette fonctionnalité est associée aux arguments fournis par la fonction de rappel et non aux paramètres que l'on fourniraient à une fonction. Pour rappel on fournit des arguments en déclarant une fonction, et on passe des paramètres en exécutant une fonction.
Une étape bien trop souvent oubliée lors de la réalisation de scripts JavaScript est la gestion des erreurs. On se contente de colmater les problèmes à l'aide de try/catch quand ceux-ci sont remontés par l'interpréteur et... et c'est tout.
Pour les personnes en charge de l'édition de contenu, remplir des liens est souvent source de problème car, là où la page des termes et conditions avaient toujours été une page interne au site, la voilà devenu un fichier PDF ou une page plus globale hébergée sur un autre site web ; ce qui demande l'ouverture d'un nouvel onglet pour s'afficher. Et le pire dans tout cela, c'est que c'est juste pour la version du site en Vulcain ! Il va donc falloir laisser ces mêmes personnes gérer eux-mêmes la propriété target ou...
...utiliser un script intelligent qui va ajouter les target="_blank" là ou ils sont nécessaires !
Cela est également très pratique quand on rédige ses pages en Markdown.
NodeAtlas est un framework JavaScript MVC(2) côté serveur vous permettant de créer des sites évolutifs, performants et conformes au W3C. C'est-à-dire qu'il permet de faire tourner des sites multilingues indexables ou de créer des maquettes HTML passant la validation W3C uniquement avec des vues mais également de créer de gros sites et apps web orientés composants et / ou orientés services en respectant les nouveaux standards avec son système de point d'ancrage.
Une chose qui me gène avec la $(document).ready() de la librairie jQuery, c'est que c'est une magnifique porte ouverte aux mauvaises pratiques JavaScript. Elle empèche les développeurs web en herbe de se pauser les bonnes questions et pire encore, comme j'ai pu le constater récemment, aux développeurs à priori chevronnés d'en faire de même...
Oui, le $(document).ready()peut être utilisé plus d'une fois dans un ensemble de fichier et oui, il peut être placé n'importe où dans une page HTML mais non, ce n'est absolument pas vous rendre service que de faire cela ! Ce n'est pas parce que l'on peut, que l'on doit.
Mettre ces déclarations un peu partout rend plus difficile la relecture et le debug du code en empêchant de savoir qui s'exécute avant qui sans regarder l'ordre d'appel des fichiers. Effectivement, si cela semble simple et pratique quand 3 fichiers se battent en duel, cela peut rapidement devenir complexe. De plus, si une exception est levé dans l'un des $(document).ready(), aucun des autres n’exécutera plus rien du tout. Pour finir, le code est ralenti lors de l'appel de plusieurs $(document).ready() contre un seul, ou contre aucun d'ailleurs.
S'il y a bien une action redondante et qui nécessite de passer par la case JavaScript, c'est bien la validation des formulaires ! Mais sachez qu'il est possible de les valider sans utiliser une seule ligne de code ! J'avoue, je triche un peu quand je dis ça. En réalité il n'y a rien de magique et il faudra tout de même inclure trois scripts pour réaliser cela, mais il ne sera pas nécessaire que vous écriviez du JavaScript.
Voyons ici quel sont ces scripts et parcourons les différents cas de figure pour valider des champs vides, vérifier qu'un email est bien formé ou encore qu'une confirmation de mot de passe correspond bien au mot de passe initialement tapé. Par exemple, pour vérifier qu'un champ « Pseudo » est bien remplis et indiquer la place de son message d'erreur, il suffirait de le déclarer dans un formulaire comme ceci :
J'ai évoqué pourquoi je n'utilisais pas Bootstrap. Cependant, l'un des pré-requis pour un nouveau projet est de l'utilisé aussi j'ai retroussé mes manches pour approfondir la philosophie et j'ai déjà commencé à me casser les dents !
On parle souvent de la grande vélocité de Node.js et de son brillant avenir. Mais il n'est pas toujours judicieux de l'utiliser. Pour certains cas d'utilisations, c'est le meilleur choix à faire (application web temps réel). Pour d'autres cas, ça le deviendra mais c'est encore un peu tôt (CMS web). Et pour d'autre il ne sera jamais réellement adapté (intelligence artificielle). Voici l'adaptation française d'un article de Felix Geisendörfer, contributeur Node.js. Il nous explique de manière pragmatique comment raisonnablement et rationnellement il est possible d'utiliser Node.js pour son business.
« Maintenant que vous êtes au point sur l'utilisation de Node.js, il est temps de convaincre votre boss. Enfin peut-être. J'ai eu l'occasion de conseiller différente entreprise sur la question : Node.js est la bonne technologie ? Et parfois, la réponse est tout simplement non.
Ce guide est ma collection opiniâtre des conseils pour ceux d'entre vous qui veulent savoir si Node.js fait sens pour leur entreprise, et si oui, comment convaincre la direction.
Le « Responsive Web Design » comme son nom l’indique est le concept de « Responsive Design » adapté au Web. Il est parfois raccourci par le terme « RWD » ou simplement par « Responsive ».
Dans la majorité des cas d’utilisations, il est utilisé comme raccourci pour désigner la version Mobile d’un site web originalement conçu pour un écran d’ordinateur.
La vérité est que le Responsive Web Design n’est qu’un des nombreux concepts appliqués à un site web pour le rendre « utilisable agréablement » sur mobile tout en sachant qu’il ne se limite pas qu’aux mobiles et qu’il vaut tout aussi bien pour :
une tablette,
une phablette (terminal intermédiaire se situant entre le smartphone et la tablette),
un ordinateur et tous ses types d’écrans (HD, 3D, tactile),
une télévision numérique,
un tableau de bord de voiture,
une console de jeu portable,
…et tout appareil capable d’afficher un site web par l’intermédiaire d’un navigateur web.
En plus du fait que Responsive Web Design ne signifie donc pas obligatoirement « version mobile », il est le porte étendard d’une liste de concept comme l’« Adaptative Web Design ». Difficile de comprendre ce dont on parle réellement quand il est question de Responsive Web Design.