Articles

Affichage des articles du janvier, 2018

Site d'aide autour des technos du Web

Image
Quelques petits sites sympa que j'ai trouvé en papillonnant et qui nous permet d'apprendre. Tout d'abord, un petit codepen appelé " JavaScript Array Explorer ". Ce dernier, est très sympa, car il nous permet, en nous posant des questions toute simple de montrer des exemples de code ES6 pour produire l'effet escompter (en cela avec une petite animation bien sympathique). Maintenant, c'est plus un guide, mais ce lien permet de nous donner une liste des frameworks frontend de "structuration" actuelle , en nous donnant notamment sa catégorisation dans les différents paradigmes, ainsi qu'un paragraphe illustrant les détails et les liens importants associés au framework. Maintenant, je vais vous présenter trois sites, fais par la même personne. Le premier, HTML reference , est un site qui liste toutes les balises HTML, en les regroupant par catégories (formulaires, sémantiques, etc...), mais aussi en nous donn...

Crétin de navigateur: le cas du "/"

Ici, nous allons voir un soucis que j'ai eu il y a quelques mois, et que je ne pensais pas avoir. Dans une URL, nous ne pouvons pas avoir de caractères spéciaux, comme les espaces. Du coup, nous les encodons. Par exemple, un espace est représenté par  %20 . Après, il est vrai que nous navigateurs sont plus "dociles" et nous autorisent de plus en plus à ne pas encoder nos valeurs. Néanmoins, il est toujours conseillé de le faire pour éviter des confusions . Notamment autour du "/" . En effet, imaginer les cas suivants 1) Je souhaite injecter une valeur en query parameter qui contient "/". Pour des raisons de parsing de l'url, il est vivement conseillé de l'encoder. Nous aurons alors l'url: http://www.example.com/level1/level2?value=a%2Fa 2) J'ai une api REST et je souhaite injecter une valeur qui potentiellement peut avoir un "/" (ce qui vous vous en doutez, est très gênant). Naïvement, nous penserion...

Awesome Lists: cette fois, ils ne sont pas content

Après " Awesome Lists ", et " Awesome Lists: le retour ", voici une nouvelle liste d'awesome lists intéressante ! Developper stream Une liste de développeur à suivre pour se tenir informé, comme Suz Hinton (que j'ai pu voir lors de la dotJS 2017) qui parle beaucoup du développement vers l'accessiblité https://github.com/bnb/awesome-developer-streams Server less Ici, la liste est de proposer un grand nombre de solution dans le cloud afin d'éviter que nous ayons à l'implémenter sur nos serveurs Comme par exemple l'envoi de mails, une api d'eCommerce, etc ... https://github.com/anaibol/awesome-serverless Domain driven development Là, tout pour faire du DDD ! Ainsi que les articles intéressants autour du CQRS, de l'event sourcing, etc ... https://github.com/heynickc/awesome-ddd Spinners Ici, une liste de spinners CSS très sympa https://github.com/yangshun/awesome-spinners Courses Liste de cours en ligne ht...

Faire un appel Ajax sur un "unload"

Image
Parfois, vous allez avoir le besoin suivant: envoyer une requête au serveur au moment du déchargement de la page (que ce soit sur un simple "refresh" ou lors d'un changement dans la navigation utilisateur). Nous allons tout naturellement écouter l'événement JavaScript "unload" et faire notre appel Ajax ou Fetch. Le hic est que: Soit l'appel n'aura pas le temps de partir Soit l'appel sera annulé (le navigateur aura commencé à l'initialiser, peut-être même commencer à le soumettre, mais va tout arrêté). Bref, il y a à peu prêt 95% de chances que la requête n'atteigne jamais le serveur. Une solution basique est de faire un appel Ajax synchrone. Mais cela est fortement déconseillé car cela frisse l'IHM. Une nouvelle solution est d'utiliser le " Beacon ". Ce dernier a pour objectif de soumettre une requête Ajax, et quelle soit émise dans tous les cas. Cela veut dire que même si l'utilisateur...

Git recipes

Rien de bien folichon, mais un petit article pour se souvenir de quelques commandes Git, bien utile. Avoir l'aide Git > git --help Avoir la version de Git > git --version Initialiser Git > git config --global user.name " julien roche " > git config --global user.email " roche.jul@gmail.com " Configurer Git par rapport au proxy > git config --global http.sslVerify false > git config --global https.sslVerify false > git config --global http.proxy http: //proxy.company.com:8080 > git config --global https.proxy http: //proxy.company.com:8080 > git config --global url. " https:// " .insteadOf git: // Vérifier si un répertoire est versionné sous Git Si ce n'est pas le cas, une erreur sera remontée > git status --porcelain Initialiser un projet Git > git init Cloner un projet Git > git clone git@gitlab.com:roche.jul/test.git Lister les remote origin > gi...

Plusieurs vraies instances de Chrome sur son poste

Image
J'ai souvent une problématique: je souhaite avoir plusieurs versions de Chrome sur mon poste (ici, nous n'allons parler que du cas Windows). Très souvent, je trouve comme solution, soit d'aller télécharger Chrome Canary (soit 3 ou 4 versions de plus que la dernière version de Chrome, avec plus d'outils de devs) soit de télécharger Chrome Beta (soit 1 ou 2 versions de plus que la dernière version de Chrome). Le hic vient du fait que nous ne pouvons pas choisir la version à installer (et il faut bien par la suite désactivée toute mise à jour). De plus, de base, rien n'est fourni par l'équipe de Chrome d'avoir plusieurs instances. Il existe pourtant un moyen simple, et voici la procédure. Copiez depuis une versions installée sur un autre poste Ici, on suppose que sur un poste non loin de vous, vous avez une version de Chrome qui y est installée et qui vous intéresse. On va dire ici que c'est un Chrome 59. Copiez le contenu de ...