Tous les articles par Mathieu HELARY

Passionné de nouvelles technologies, je m'interesse actuellement au marketing sur Internet

No-Code – Low-Code – Fausse bonne idée ?

A l’heure de l’avènement du “low code” / “no-code”, pourquoi il est toujours indispensable d’avoir des Analystes/programmeurs !

No-code - une page de code Json avec par dessus un symbole interdit.

Définition de “no-code”

Le concept de no code renvoie à un mode de développement logiciel qui masque la complexité du code source de l’application. Les outils de développement sans code combinent différentes techniques.

En clair, le no-code permet à des professionnels d’implémenter des processus d’automatisation, des publications, des fonctionnalités sans avoir a connaitre un langage, une technologie.

No-Code / Low-Code

La différence entre le “No Code” et le “Low Code” tient tout simplement dans le fait que le “Low Code” permet d’ajouter des composants en les programmant. Cela ajoute ainsi un ensemble de perspectives d’améliorations des éléments utilisés.

Implications techniques

Dans le concept de “No code” on va venir caché toute la couche technologique des utilisateurs. Alors certes, il va y avoir un gain de temps sur la conception des fonctionnalités “customs”. On va utiliser un ensemble de composants prédéveloppés qui vont s’enchainer les uns après les autres dans un but précis.

De par le fait que chaque composant est prédéveloppés, ils doivent de facto également être extrêmement configurable afin de pouvoir couvrir les multiples besoins fonctionnels. A défaut d’être configurable, ils doivent être d’une forte granularité : un peu comme des briques de constructions.

Dans le premier cas, il y a plusieurs phénomènes qui vont se produire :

  • Le composant va devoir embarquer un nombre non négligeable de connecteurs
  • Comme il embarque de nombreux éléments de connectivité, il va forcément avoir une empreinte de code plus importante.
  • Le composant consommera donc forcément plus de ressources.
  • Le composant consommant plus de ressources, son utilisation aura un impact plus important sur l’infrastructure qui l’accueille.
  • Cet impact va avoir un cout économique supplémentaire, environnementalement plus important.
  • Enfin l’utilisation d’un tel composant va potentiellement générer des problèmes de performance.

En bref, si un composant n’est pas conçu, étudié, optimisé pour remplir un tache très précise, il va être plus lourd, plus gourmand, plus couteux.

Engrenages et horloge

No-code, sur le long terme ?

Sur le long terme, utiliser du no-code est contre-productif. Autant les utilisateurs savent décrire quel est leur besoin, autant ils n’ont aucune notion de gouvernance, de maintenabilité, d’évolutivité et de sécurité. Tout simplement ca n’est pas leur métier !

A l’inverse, un analyste programmeur, un architecte, un développeur ou quelque soit le nom utilisé, si tant est que l’individu soit talentueux, connait, maitrise tous ses sujets. Cela transparait dans son code, dans sa façon de répondre au besoin des utilisateurs.

Un développeur va factoriser son code, va mettre en place des tests unitaires, des stratégies de gestion des erreurs, des sécurités sur ses inputs, ….

Vous allez me dire : “Oui mais les composants sont déjà testés, optimisés, …” et vous avez raison ! MAIS, parce qu’il y en a toujours un, le danger réside plutot dans l’utilisation et les interactions de chacun de ses composants et dans sa capacité à évoluer

Prenons un exemple !

Je souhaite faire un process qui va me calculer la montant de la T.V.A. sur un article. Nous allons faire l’exercice en php. Un générateur no code produira ce type de code:

public function process( $value)
{
return $value*1.2;
}

Un développeur ira plus loin, il testera si le prix du produit est correctement défini :

/**
* Function to calculate T.V.A on a product price
*/
public function calculateTVA($producPrice)
{
if($productPrice!= null && $productPrice>0 )
return $productPrice*1.2;
else
return false;
}

Un développeur qui aura réfléchi au besoin, se dira, oui mais la TVA peut avoir plusieurs valeurs ? que se passe t-il si mon prix n’est pas un nombre ? etc . Son code tiendra compte de ses interrogations :

/**
* function to calculate TVA
* input : float $productPrice, float $VATrate
* output : float  or string (Error message)
*/

public function checkInput($data, $type)
{
if(gettype($data)==$type)
return true;
else 
return false;
}

public function calculateTVA(float $productPrice, float $vatRate)
{
// Check the inputs
if(checkInput($productPrice, "double") && checkInput($vatRate,"double") && $productPrice>0 && $vatRate>0)
return $productPrice*$vatRate;
else
return "One or more parameters have an incorrect value";
}

Alors certes la quantité de code est plus importante, mais les gains en termes de compréhension, d’évolutivité et de maintenabilité sont énormes : Ce code est réutilisable, la vérification des entrées est utilisable pour d’autres modules, données, etc …

Au final ?

Le no-code est une technologie qui est va devenir très utile et va s’étendre de plus en plus dans les années à venir. Pourquoi ? parce qu’il y a un réel besoin que les utilisateurs métiers soient capables d’effectuer des taches qui jusqu’à présent étaient échues aux développeurs. Elle dispose d’avantages non négligeables.

Par contre, s’il s’agit de mettre en place un ensemble de fonctionnalités destinées à perdurer dans le temps et dans les usages, l’intervention d’un analyste-programmeur / développeur reste une nécessité absolue.

Alors, nous autres “techos”, soyons rassurés, il y a, et il y aura toujours du travail pour nous !

Tir de charge, quelle est son utilité ?

Charge des tuniques bleues – illustration tirée des bandes dessinées Les tuniques bleues.

Un tir de charge, qu’est ce que c’est ?

Le tir de charge est un moyen de simuler une fréquentation sur un site Internet au moyen d’injecteurs. Ces injecteurs vont effectuer des requêtes HTTP suivant des scénarios définis par avance. Ils vont ensuite maintenir un nombre d’utilisateurs constant pendant une durée déterminée à l’avance.

Un tir de charge peut avoir plusieurs objectifs :

  • Vérifier le bon fonctionnement d’un site à un nombre d’utilisateurs constant.
  • Identifier des goulots d’étranglement dans des parcours utilisateurs.
  • Apporter des informations sur l’adéquation de chacune des briques infrastructurelles et logicielles d’une application Internet.
  • Identifier la capacité maximale qu’un site peut “encaisser”
  • Mesurer la performance d’un site web à faible trafic, ou a for trafic.
  • Identifier des anomalies logicielles (Bug) qui ne se révèlent que lors d’une sollicitation importante.

En clair, le tir de charge permet de challenger une application web, sur sa performance et sa capacité à accueillir des internautes.

Il nécessite une préparation rigoureuse, une exécution récurrente et correctement dimensionnée, une analyse très poussée des différentes briques impliquées.

  • Pour les professionnels de l’hébergement , on s’intéressera plus particulièrement aux informations sur les serveurs telles que : le nombre de processus, les taux d’utilisation des CPUs, de la mémoire vive, des lecture/écriture sur les disques durs, sur la bande passante …
  • Les développeurs vont s’intéresser, aux différents temps de chargement des pages, aux erreurs rencontrées, pourquoi elles sont apparues, ….
  • Enfin les professionnels du commerce, on va surtout analyser les temps globaux des scénarios, pour isoler des cheminements déceptifs, des points de blocage, …

Tout le monde peut apprendre des résultats d’un tir de charge !!

Brackets -Un éditeur open source à la page du web-design.

Brackets, un éditeur qui comprend les besoins des web-designers

Voila cela fait plusieurs mois que je recherchait un éditeur html, CSS, javascript plutôt léger et qui fonctionne bien. J’ai découvert cette perle rare : brackets

C’est un editeur agréable et ergonomique et facile a configurer, il dispose de plus d’un système de “plugins” qui permettent la personnalisation  de l’ensemble, soit au niveau des thèmes (Perso j’en prend un bien sombre, car moins fatiguant pour les yeux), soit au niveau des fonctionnalités (J’aime beaucoup “beautify”, “lint”).

Parmi les petits trucs que j’aime dans brackets, il y a le “live preview” qui montre en temps réel les modifications effectuées soit dans le html, soit dans le Css par le webdesigner. Il y a également la possibilité de voir “in code” les prévisualisation des images, styles css, etc …Brackets

C’est réellement pratique !

Pour les intégrateurs html en “full stack”, le raccourci “Ctrl+E” permet une fois qu’on as lié sa feuille de style, de définir ses styles directement dans l’édition du code HTML. Il faut toutefois faire attention à s’organiser un tant soit peu pour éviter l’anarchie.

Voici une liste d’extensions directement accessible dans “Brackets” que j’adore :

  • Beautify : Permet de ré-organiser son code, refaire l’indentation notamment.
  • Emmet : L’auto-complétion par excellence.
  • HTMLHint : Un validateur parfois plus pertinent que le validateur W3C.
  • CSSlint : Permet de trouver les erreurs CSS
  • ColorHints : pour retrouver rapidement les couleurs utilisées dans les feuilles de styles (Les dernieres saisies en commancant par #)
  • PHP Code Quality Tools : pour “auditer son code PHP”, nécéssite un binaire PHP et codeSniffer.
  • Brackets Git : Extension pour utiliser Git  :-p
  • Brackets file tabs : Pour afficher les fichiers ouverts en “onglets” plutot qu’en liste sur la gauche, un peu comme Eclipse, Komodo.

En résumé,  Brackets est sympa, pratique et ergonomique avec quelques modifications. Il est résolument orienté “frontend” et ne trouvera sa plein utilité qu’en complément avec un IDE. En effet, Brackets permet de créer, modifier, améliorer en live l’affichage d’un site, mais n’est pas encore au niveau des IDE tels que Komodo, Eclipse pour la gestion des bibliothèques et des projets complexes.

Je le recommande pour tous les webdesigners et intégrateurs qui ne s’occupent que de  la mise en page d’un site.

En plus c’est de l’open-source, ce qui n’est pas pour gacher mon plaisir ! 😀

Cet article est très largement inspiré de Alsa creations et mon expérience personnelle : http://www.alsacreations.com/outils/lire/1654-brackets-editeur-front-end.html

Faire une redirection 301 en symfony 1

Comment faire une redirection 301 ?

Etape 1 : Créer l’action de redirection

L’idée est de passer par une petite action qui se chargera de renvoyer un entête HTTP avec le code 301 et d’effectuer ensuite la redirection vers la page voulue.

Pour ce faire,  dans le fichier “MonProjet -> apps -> MonApplication -> modules -> seo -> actions -> actions.class.php” (cf arborescence ci-dessous), nous allons créer l’action “redirection”.

L'arborescence d'un projet symfony avec les 2 fichiers que nous allons utiliser.
L’arborescence d’un projet symfony avec les 2 fichiers que nous allons utiliser.

Voici le code à insérer pour  effectuer la redirection.

<?php

/**
 * SEO actions.
 *
 * @package    Nom de l'application
 * @subpackage Nom du module
 * @author     Votre nom ICI
 */
class seoActions extends sfActions
{
  /**
   * Executes index action
   *
   * @param sfRequest $request A request object
   *
   */
  public function executeRedirection(sfWebRequest $request)
  {
    $newRouteName = $this->getRequestParameter('newRoute');
    $myPatternRouting = $this->getContext()->getRouting();

    $parameters = $request->getRequestParameters();
    $status = $parameters['status'];
    unset($parameters['_sf_route']);
    unset($parameters['newRoute']);
    unset($parameters['status']);
    
    $this->redirect($myPatternRouting->generate($newRouteName, $parameters), $status);
  }
}

?>

Le principe est d’appeler cette action avec une certains nombre de paramètres dont :

  • La route vers laquelle on redirige “newRoute”.
  • Le status HTTP à renvoyer (dans notre cas “301”.

La fonction se charger ensuite de rediriger le navigateur via la dernière ligne “$this->redirect(…)”.

La méthode est simple et peut être adaptée pour d’autres usages.

Etape 2 : modifier le fichier de routing.

Maintenant que nous avons l’outil, il faut l’utiliser. Nous allons donc modifier le fichier de routing en conséquence.

route1:
  url: /MaNouvelleUrl.html
  param: { module: monmodule, action: monaction}

route1_redirect:
  url: /monAncienneUrl.html
  param: {module: default, action: redirectOldUrl, newRoute: 'route1', status: 301}

Alors la attention il y a une astuce ! en effet quand on developpe une application, on est souvent amener à utiliser les routes à plusieurs endroits dans son code. Si on change simplement la route, on risque d’avoir des conflits. L’astuce est donc de créer une nouvelle route “_redirect” par exemple, qui va répondre sur l’ancienne url. Cette nouvelle route va renvoyer vers notre action “seo/redirection” avec comme paramètre le nom de l’ancienne route.

Ensuite, on modifie notre ancienne route pour qu’elle réponde a la nouvelle url.

On sauvegarde, on déploie, on vide les caches et le tour est joué

Bon c’est pas grand-chose mais ca permet de gérer proprement les redirections 301, 302, etc ….

Ah ! Les jeux électroniques ! Je retombe en enfance !

Qui d’entre vous n’as pas joué avec ces mini jeux électronique tels que Donkey kong, ou encore Zelda sur un vieil écran LCD ?

Perso, en découvrant ce site, je suite retomber en enfance en moins de 2 secondes !!

http://www.pica-pic.com/

Le principe, c’est de simuler tout ces vieux jeux vidéos directement dans votre navigateur, c’est totalement inutile et contre-productif mais ca fait du bien !!