Animations du site d’un client

L'animation des éléments sur le site web d'un client est généralement proposé  par l'agence et non le client lui même.

Tout le monde n'ayant pas l'âme d'un animateur, mis à part peut être ceux qui ont une formation de graphiste dans leur bagage, un site fortement intéressant Animista vous propose toute une liste d'effets dont vous pouvez vous inspirer afin de rendre le site d'un client encore plus attractif.

Les effets sont divisés en plusieurs catégories :

  • Basic
  • Entrances
  • Exits
  • Text
  • Attention
  • Background

Basic pour des éléments s'animant au survol.

Entrances pour des éléments s'animant au chargement de la page, ou au scroll.

Exits pour des éléments s'animant au départ d'un bloc de page ou d'un scroll.

Text pour des animations sur du texte.

Attention pour des animations alertant le visiteur

Background pour des animations sur des visuels en fond, des dégradés ou différentes nuances de couleurs.

Le noiZetier, un page builder

Vous avez pu voir récemment un article vous présentant “Elementor”, un page builder pour WordPress. Il existe sous SPIP, un autre CMS, un constructeur de page : le noiZetier.

Une fois installé, le noiZetier offre une interface d’administration dans l’espace privé permettant de choisir pour chaque page du site des widgets (des noisettes) à différents blocs de la page.

Pour pouvoir l’utiliser rapidement, il est conseillé de le mettre en place avec 2 autres plugins : Zpip-vide, Aveline et Compositions.

Lancer un nouveau projet Webpack rapidement

La petite astuce du jour :

Si comme moi, vous avez entendu parler de Webpack, souhaitez le tester mais sans trop vous prendre la tête sur la configuration, il existe un générateur écrit en nodejs vous permettant d'initialiser un projet rapidement.

L'outil Unstuck - Webpack vous permet de créer un nouveau projet en choisissant l'environnement sur lequel vous souhaitez travailler via un système de templates :

  • Nodejs + Babel
  • Angular 1 + Less
  • Angular 2 + scss / sass
  • React + scss / sass
  • Ember + scss / sass
  • Vuejs + stylus

Pour ceux qui ne sont pas connaisseurs, Webpack est un générateur de tâches à l'instar de Gulp / Grunt, qui permet de :

  • Gérer les CSS / images / fontes / librairies sous forme de modules
  • Gérer différentes builds pour les projets clients

Il est également davantage optimisé lors de son initialisation que d'autres générateurs tel que Gulp.

Elementor

La petite astuce du jour :

Elementor est un page builder pour WordPress, en plus d'être gratuit il permet la génération d'un site web facilement et rapidement via son interface intuitive.

Simple à mettre en place, il permet d'ajouter dynamiquement des textes / colonnes / liens / visuels... via une interface en drag and drop et de nombreux widgets.

Il est possible d'utiliser des templates prédéfinis ou d'importer le sien.

Après familiarisation avec cet outil, l'intégrateur web bénéficie d'un gain de temps non négligeable dans son travail, ainsi que le client qui peut modifier son site web plus librement.

Cette extension gère également les sites en version responsive, et permet de customiser sa boutique en ligne (faite avec woocommerce) via sa version pro.

Vous trouverez plus d'informations sur cette extension WordPress en cliquant ici : https://elementor.com

 

Communiquer powershell et webservice Soap. Démo avancée pratique

soap via powershell

 

L'objet est de consommer les webservices (soap ou autre) depuis powershell.

Cette première démo fait le focus sur un webservice soap simple afin de présenter facilement les notions liées.

Considérons ce webservice dont le wsdl est localisé à cette adresse: http://www.dneonline.com/calculator.asmx?wsdl

Il offre un simple calculateur. La seule méthode qui nous intéresse est la méthode Add.

Pour interroger ce webservice, nous utilisons Invoke-WebRequest de powershell.

 

cmdlet Invoke-WebRequest (iwr)

La commande get-help iwr affiche ceci:

NOM

Invoke-WebRequest

RÉSUMÉ

   Gets content from a web page on the Internet.

SYNTAXE

   Invoke-WebRequest [-Uri] <Uri> [-Body <Object>] [-Certificate <X509Certificate>] [-CertificateThumbprint <String>] [-ContentType <String>] [-Credential <PSCredential>]

   [-DisableKeepAlive] [-Headers <IDictionary>] [-InFile <String>] [-MaximumRedirection <Int32>] [-Method <WebRequestMethod> {Default | Get | Head | Post | Put | Delete |

   Trace | Options | Merge | Patch}] [-OutFile <String>] [-PassThru] [-Proxy <Uri>] [-ProxyCredential <PSCredential>] [-ProxyUseDefaultCredentials] [-SessionVariable

   <String>] [-TimeoutSec <Int32>] [-TransferEncoding <String> {chunked | compress | deflate | gzip | identity}] [-UseBasicParsing] [-UseDefaultCredentials] [-UserAgent

   <String>] [-WebSession <WebRequestSession>] [<CommonParameters>]

........

Whaoooo!!!!

 

Pour notre démo pratique, nous utilisons cette forme:

 

Utilisation des classes Proxy Magento 2

 

Magento 2 utilise le principe d'injection de dépendances comme alternative à la classe finale Mage de Magento 1. Cela veut dire que si une classe A dépend du service B, B doit être injecté directement dans le constructeur de A, ce n'est plus à A de récupérer la dépendance B au moment où il en a besoin.

Cela implique inévitablement que B doit être instancié avant d'être injecté dans A. Cela n'a rien de problématique en soi, par contre imaginons que l'instanciation de B soit relativement lourde en terme de ressource et que B possède également des dépendances, qui elles-mêmes possèdent des dépendances, qui elles-mêmes... Vous l'aurez compris, cela peut commencer à devenir non négligeable, surtout (et c'est là que la problématique devient intéressante) si A a besoin de B uniquement dans certaines conditions (selon l'état d'une variable, l'état d'un service, le calcul d'un résultat, ou autre), l'instanciation de B devient donc inutile si A n'en a jamais besoin. Les classes de type Proxy sont présentes pour répondre à cette problématique.