Animations are one of the many tool developers can use to improve the UX on a web application. A well-placed animation can bring the user's attention to something important. They may also indicate that the system is working on...
Le Blog
Les collaborateurs d’Invivoo explorent et partagent leurs connaissances du domaines IT.
Introduction to React Hooks
Hooks were introduced in February 2019 as part of React 16.8. They will help you make your code clearer and better structured. The classic class based syntax and idiomw are still still supported, and will keep being supported for the foreseeable future. So no...
Composant React : comment le tester ?
Composant React : introduction React.js c'est la bibliothèque graphique crée par Facebook pour la création de front ends web interactives. Le composant React met en avance une approche basée sur des composants : une application est un ensemble de composants imbriqués...
Introduction à Preact
Introduction à PReact: Preact est une librairie javascript lightweight dont la taille ne dépasse pas les 3Ko et qui peut présenter une bonne alternative à React. La librairie crée par Jason Miller accompagné d’une communauté de développeurs, a gagné une importante...
Conversions automatiques de types en Javascript
Suite à mon dernier article sur la vérification de types automatique en Javascript, dans cet article, on parlera un peu plus du côté non typé du langage. Plus précisément, on parlera des conversions automatiques de types, un aspect du langage qui peut représenter un...
Dynamic import en JavaScript
Les projets web deviennent de plus en plus complexes, avec de plus en plus de dépendances. Les imports de librairies JavaScript se font par défaut de façon statique en utilisant des balises script intégrées dans le code de la page HTML. Cela peut poser des problèmes...
Améliorer l’organisation du CSS de votre application avec SMACSS
Les feuilles de style CSS permettent aux développeurs d’améliorer le rendu visuel de leurs pages web. Mais, en travaillant sur des projets de grande ampleur qui regroupent plusieurs développeurs, ces feuilles de style deviennent souvent de plus en plus complexe,...
Automatisation des tests Front-end
Dans cet article nous parlerons des tests end to end (E2E) pour des Front-end web. Ce sont des tests où nous testons l'application dans son intégralité à partir de son Front-end. A la fin de cet article, vous aurez compris ce qu'est un test E2E, et en quoi cela est...
Data encapsulation in JavaScript: getters and setters
Data encapsulation in JavaScript: getters and setters When building larger JavaScript applications, there's soon the need to split it into modules linked by clear contracts. When it comes to long term maintenance, a way to keep compatibility upon interface changes...
3 frameworks de Front-End à connaître en 2019
Le monde du développement logiciel est un milieu très riche qui englobe plusieurs technologies. Ces dernières sont en constante évolution pour répondre à des besoins très variés, faciliter les tâches et réduire les coûts. Parmi ces technologies, on trouve celles du...
Introduction to the verification of Javascript Types
In this article, we will talk about automatic checking of types in Javascript, to avoid unexpected behavior at runtime and to simplify refactoring and testing. Javascript has been created as an auxiliary language for use in static HTML documents in web pages. 20 years...
Angular 7′ New Features
Angular is one of the best-known and most used frameworks for front-end developers. With the release of Angular 7, we have seen several improvements that have mainly affected the Framework 's Core, AngularMaterials, as well as the CLI. In this article we will...
Les nouveautés dans Angular 7
Angular est l’un des frameworks les mieux réputés et les plus utilisés par les développeurs de front-end. Avec la sortie d’Angular 7, nous avons constaté plusieurs améliorations qui ont principalement touché le Core du framework, Angular Materials, ainsi que la CLI....
How to use the “THIS” operation in Javascript
In most programming languages, the “this” keyword is used in the non-static code of a class to refer to the current object. For example: class Car { constructor() { this.wheels = 4; } addWheels(n) { this.wheels += n; } } let car = new Car(); car.addWheels(2);...
L’opérateur new et les constructeurs en Javascript
Cet article est la continuation de mon précèdent article sur l'opérateur this en Javascript. Nous avons vu précédemment que le mot clé this et les appels à fonction d'un objet sont en fait du sucre syntaxique qui cache des appels à des fonctions telles que apply() et...
Immutability and Javascript
The immutability is a very highly exploited concept in functional programming languages, where the values of the variables do not change when assigned. This has the merit of simplifying the administration of the application state by reducing the number of shared...
Les nouveautés dans ES8 : async & await en Javascript
ES8 est sorti il y a quelques mois et au-delà des quelques changements cosmétiques et des nouvelles APIs, des mots clés ont été introduits dans le langage. Ces nouveaux mots clés cachent aux développeurs l'utilisation de promesses derrière du code qui semble être du...
Comment utiliser l’opérateur this en Javascript
Dans la plupart des langages de programmation, le mot-clé this est utilisé dans le code non-statique d'une classe pour se référer à l'objet courant. Par exemple: class Car { constructor() { this.wheels = 4; } addWheels(n) { this.wheels += n; } } let car = new...
Introduction à la vérification de types en Javascript
Dans cet article, nous parlerons de la vérification automatique de types en Javascript, pour s'éviter des comportements inattendus à l'exécution et pour simplifier le refactoring et les tests. Javascript a été créé comme un langage auxiliaire à utiliser dans des...
Immutabilité et Javascript
L'immutabilité est un concept très fortement exploité dans les langages de programmation fonctionnelle, où les valeurs des variables ne changent pas une fois attribuées. Cela a le mérite de simplifier la gestion de l'état application en réduisant le nombre de...
Retour Devoxx France 2016 : Architecture découplée grâce aux Reactive Extensions – 7eme partie
Pour revenir à la première partie de cette série d'articles sur les Reactive Extensions, c'est par ici. 7 Leçons apprises en utilisant les Reactive Extensions Cette dernière partie est consacrée à la présentation des bonnes pratiques, des écueils et des...
Retour Devoxx France 2016: Architecture découplée grâce aux Reactive Extensions – 6eme partie
Pour lire la première partie de cette série d'articles, cliquez ici. 6 Back-pressure (pression arrière) Rx est basé sur le tandem Observable/Observer, l’un produisant les données, et l’autre les consommant. Dans le fonctionnement normal, l’Observable...
Retour Devoxx France 2016 : Architecture découplée grâce aux Reactive Extensions – 5eme partie
Pour revenir à la première partie de l'architecture découplée grâce aux Rx, c'est par ici. Hystrix pour une meilleure gestion des statuts des dépendances Sur son site, Hystrix est décrit comme suit : « Hystrix is a latency and fault tolerance library...
Retour Devoxx France 2016: Architecture découplée grâce aux Reactive Extensions – 4eme partie
Composition de services Dans une architecture distribuée, il est typique d’avoir des services faisant appels à plusieurs autres services afin de traiter les requêtes qu’ils reçoivent. Nous allons voir à travers l’exemple suivant comment RxJava permet...
Retour Devoxx France 2016: Architecture découplée grâce aux Reactive Extensions – 3eme partie
3 Modèle de concurrence de RxJava : les Scheduler Contrairement à ce qu’on pourrait croire, les traitements de Rx ne s’exécutent pas par défaut en concurrence, du moins excepté pour des cas particuliers. Les transformations des Observable et les...