Azure est une plateforme cloud développée par Microsoft, elle met à disposition toute sorte de service facturé à l’utilisation.
Event hub et Service bus queue
Ce sont deux services ont pour rôle d’écouter des événements, mais le service bus queue permet d’ajouter une couche de persistance avec un système de file d’attente.
IOT Hub
IOT hub permet de centraliser la gestion objets connectés, il prend notamment en charge le protocole MQTT, que l’on peut utiliser soit directement (sécurisé avec un username et un password), soit avec une connection string en utilisant le kit de développement (SDK) d’Azure. Il gère aussi les certificats.
IOT hub possède un système de routing qui permet d’acheminer les données provenant des objets connectés (appelés devices) vers d’autres services du cloud comme l’Event hub ou le Service bus queue. Ce tri est paramétrable via des requêtes SQL sur les données reçues.
Azure functions
Les Azure fonctions sont des scripts, généralement assez court, qui peuvent être écrit en différent langages (TypeScript, C#, etc..). Elles sont indépendantes et peuvent donc être utilisées dans le cadre d’une architecture type microservices. Une Azure function est liée à un trigger (requête HTTP, Event hub ou Service bus, etc…) qui déclenche son exécution. Enfin c’est un service relativement économique car les Azure functions ne sont facturées qu’à leur exécution.
Proteus est un logiciel de création de circuit imprimé, il se compose de deux volets :
ISIS pour la réalisation du schéma électrique : on choisit les composants selon leur référence dans une bibliothèque puis on dessine le circuit voulu, ici une carte Arduino Uno et des composants passifs :
Schéma réalisé avec ISIS.
ARES pour la réalisation du typon : quand le circuit est dessiné sur ISIS, on bascule sur ARES. Le schéma est déjà relié (routé) mais il faut choisir parmi les boîtiers proposés, traversants ou CMS. Par ailleurs, on peut :
Dimensionner les pistes de cuivre en fonction du courant que l’on veut faire passer, plus le courant sera important, plus la piste devra être large.
Utiliser des straps, c’est à dire des résistances zéro ohm pour « enjamber » une piste de cuivre.
Changer la taille des pastilles de cuivre pour rendre l’étape de soudage plus aisée.
Schéma réalisé avec ARES (différent du schéma précédent).
Enfin, on imprime le typon. Pour un meilleur rendu, utiliser une imprimante à jet d’encre sur du papier plastique transparent (du même type que celui utilisé avec un rétroprojecteur). Dans le cas d’un circuit traversant, ne pas oublier d’inverser le schéma du typon en miroir.
Le typon imprimé, la partie noire autour est utilisée pour la masse.
Un circuit imprimé (CI) est une plaque en époxy (une sorte de résine) où sont gravées des pistes en cuivre qui permettent la circulation du courant entre les composants montés dessus.
La réalisation d’un circuit imprimé est une étape qui peut être longue et complexe, elle demande une phase de conception (réalisation du typon) et de fabrication (à l’aide d’un matériel approprié). On retrouve deux type de composants sur un CI :
Les composants traversants : ces composants sont insérés dans des trous de différent diamètre (selon l’épaisseur des pattes) percés dans le CI, on les soude sur la face opposés. L’avantage est la facilité de soudure car les pastilles de cuivre de ces composants sont plus espacées, l’inconvénient est qu’il faut percer des trous. C’est toutefois c’est l’idéal pour débuter.
Les composants CMS (Composant Montés en Surface) : ces composants sont directement posés et soudés sur le CI, la soudure se fait sur la même face que le composant. L’avantage est qu’ils sont plus petit, on peut donc en mettre plus sur le même CI qu’avec des composants traversants, ce qui peut être aussi un inconvénient car les pattes peuvent très proche (jusqu’à 0.5 mm), et donc difficiles à souder.
Beaucoup de composant générique (résistances, condensateurs, transistors, etc…) ont une version traversante et une version CMS. On peut même faire un mélange des deux sur un même CI : des composants traversants avec des composants montés en surface.
Résistance traversante.
Résistance CMS.
Enfin il existe aussi des CI avec des pistes de cuivre des deux côtés, mais cela reste compliqué à produire artisanalement car il faut quelle soient positionnées exactement au même endroit pour qu’elles puissent communiquer.
Maintenant que le typon est imprimé, trois étapes vont suivre :
Insolation de la plaque en époxy photosensible
Révélation de la plaque
Gravure et perçage de la plaque
Soudure
Insolation
On utilise une plaque en époxy photosensible dimensionnée pour le typon que l’on souhaite utiliser, puis on vient la placer dans l’insoleuse, sur ce typon. Les rayons UV brûlent la partie non protégée (partie transparente) et laisse intacte la partie protégée (partie opaque), le temps d’exposition varie en fonction de l’insoleuse et du type d’époxy photosensible, il faut faire plusieurs essais pour déterminer la durée idéale.
Plaque en époxy photosensible, elle est protégée de la lumière par un film opaque (en bleu).
Une insoleuse. Des néons produisent des rayons UV, le typon puis la plaque en époxy sont posés sur la plaque de verre au-dessus.
Révélation
Pour enlever les parties « brûlées » par l’isoleuse, un utilise un révélateur : c’est une poudre blanche que l’on vient diluer dans de l’eau (le processus est plus rapide si le mélange est tiède). On plonge pendant quelques dizaines de secondes le CI insolé, puis on voit apparaître plus distinctement les pistes : la partie exposée aux UV a été dissoute par le révélateur.
Gravure
On utilise une graveuse : c’est un bac transparent (pour mieux suivre l’évolution de la gravure) où est versé le liquide de gravure, qui peut être soit du perchlorure de fer (couleur jaune-orangée) ou du persulfate de sodium (transparent). Le CI à graver est plongé dans le liquide, accroché à un fil.
Pour accélérer le processus, la graveuse est souvent livrée avec une résistance qui permet de chauffer le liquide de gravure, ainsi qu’une machine à bulle pour mieux le faire circuler.
Une graveuse. On peut remarquer la résistance chauffante en haut et la machine à bulle à droite.
Après quelque minutes, les surfaces de cuivre insolées (non-protégées) sont dissoutes par le liquide de gravure. Si on utilise du perchlorure de sodium, la solution prend un couleur bleutée. On peut laisser sécher et nettoyer le CI avec un chiffon imbibé d’acétone.
Dans le cas de composants traversants, percer les trous en privilégiant une perceuse à colonne à rotation rapide pour éviter les bavures.
Un circuit gravé et percé.
Soudure
On place sur le CI le composant que l’on souhaiter souder. Dans le cas d’un composant traversant, on chauffe bien la pastille de cuivre et la patte du composant puis on met en contact un brin d’étain, la patte doit être bien prise dans un fin cône d’étain.
Pour un composant CMS, si deux pattes sont trop rapprochées, on peut par mégarde les souder entre elles. Pour résoudre ce problème on peut utiliser quelques gouttes de flux de soudure, un liquide qui contraint l’étain à se poser sur le cuivre pour bien séparer les soudures.
Enfin que pompe à déssouder permet s’aspirer un surplus d’étain sur le CI.
Bootstrap est un framework CSS développé par Twitter, il a été le premier du genre et a rapidement connu une grande notoriété. Il a permis aux développeurs de pouvoir créer rapidement et facilement des interfaces utilisateur convaincantes sans forcément avoir de solides connaissances en CSS.
Pour plus de finesse dans la personnalisation de l’interface, on peut surcharger les classes CSS, ou en rajouter de nouvelles pour modifier le comportement du framework. Pour bénéficier de changements plus globaux et sans avoir à bidouiller dans le code, il y a un multitude thèmes disponibles qui modifient la charte graphique du framework.
SemanticUI
Semantic UI est le plus complet des trois en terme de composants graphiques, son crédo est d’être semantique, c’est à dire que les classes sont écrites de manière explicites et en toutes lettres, ce qui facilite la relecture du code HTML.
Materialize CSS
Materialize CSS est basé sur le Material Design, un ensemble de règles de design proposées par Google. C’est un framework très accessible et rapide à prendre en main, surtout si l’on a déjà une première expérience sur d’autres frameworks CSS. Les formulaires sont particulièrement esthétiques avec le label qui se décale en haut lorsque que l’input est sélectionné. Enfin on peut de créer facilement un effet de parallaxe (deux images qui défilent à une vitesse différente lorsque que l’utilisateur scrolle).
Le langage C (procédural) et C++ (orienté objet) sont des langages compilés, bas niveau, c’est à dire qu’ils sont au plus proche du comportement de l’ordinateur. Cela implique beaucoup plus de possibilités de contrôle (allocation manuelle et adressage de mémoire), un code plus optimisé en terme de performances, mais aussi un code plus verbeux et plus difficile à s’approprier.
Les bibliothèques graphiques (SDL et Qt)
La bibliothèque SDL est une bibliothèque logicielle libre qui permet de créer des fenêtres graphiques à partir d’un programme en console : on peut aisément contrôler le positionnement des images ou de textes. Elle est très utilisée dans la création de jeux vidéos en 2D car elle permet également de manipuler facilement des sprites.
La bibliothèque Qt est une API écrite en C++ qui permet de créer des programmes complexes rapidement avec en agençant des éléments graphiques appelés widgets.
Carte d’interface E/S (VM167)
Le C/C++ se prête particulièrement à des systèmes embarqués où les ressources comme la mémoire ou la vitesse d’exécution sont limités.
La carte VM167, on peut voir le port mini-USB et les différentes broches E/S.
La carte VM167 permet de contrôler des E/S (Entrées / Sorties) digitales ou analogiques dans un programme écrit en C/C++, leur tensions varient de 0 à 5 Volts. Une fois les drivers installés et les fichiers .h et .c inclus dans le programme, on peut commencer à utiliser les fonctions de la bibliothèque pour communiquer avec le monde extérieur via les E/S. De ce point de vue elle ressemble beaucoup aux microcontrôleurs PIC (programmés avec MPLAB X IDE) et aux cartes Arduino (programmées avec Arduino IDE), à ceci près qu’ ici tout ce passe en temps réel suivant le déroulement du programme.
Le langage PHP est un langage serveur permettant de rendre des portions de pages web dynamiques en insérant du code PHP directement dans le HTML. Cette façon de procéder rend son apprentissage assez intuitif.
Il nécessite l’installation d’un serveur local comme WAMP qui permet d’interpréter localement des scripts PHP, Apache (serveur HTTP) est également intégré. La communication avec une base de données, par exemple MySQL, se fait à l’aide de l’objet PDO, qui permet de faire des requêtes préparées.
L’outil PHPMyAdmin, installé avec WAMP, permet de gérer manuellement la base de données MySQL (création des tables, création des champs, insertions des données, etc…).
Le PHP avec le framework Symfony2
Le framework Symfony2 est basé sur le modèle MVC (Modèle-Vue-Contrôleur), il permet d’avoir un code structuré. Il possède également son propre gestionnaire de paquets appelé Composer et permet d’avoir un système d’authentification facile à mettre en place avec FOSUserBundle.
Côté vue, on peut faire de l’héritage de template, pratique pour rendre un menu dynamique au lieu d’un simple include(). Il utilise le moteur de template TWIG pour injecter le contenu provenant du contrôleur dans le HTML. Côté modèle, il est aisé de faire des opérations CRUD (Create, Read, Update, Delete) avec Doctrine.
Solidworks est un logiciel de modélisation 3D spécialisé dans la création de pièces mécaniques : il permet de créer des volumes à partir des mesures d’une pièce.
Voici un exemple de workflow : on dessine une esquisse, c’est à dire une surface fermée avec différentes outils géométriques (point, ligne, cercle, rectangle, etc…) en deux dimensions (suivant des axes X et Y). Ensuite on cote l’esquisse, c’est à dire qu’on fixe les mesures des segments et des angles, puis on en fait une mise en volume (outils base/bossage extrudé) en jouant sur la profondeur de l’axe Z. À contrario on peut retirer de la matière (outils enlèvement de matière extrudé).
Une fois la mise en volume faite on peut faire sur les finitions : ajouter des chanfreins (raboter un angle) ou faire un congé (arrondir un angle), etc…
Le système de fichier de SW repose sur les pièces et les assemblages : un assemblage est constitué de plusieurs pièces assemblées suivant différentes contraintes : coaxial, coïncident, etc..
Solidworks est particulièrement utile pour visualiser un objet avant toute réalisation, en particulier dans la phase d’assemblage pour être sûr que les pièces s’agencent bien les unes avec les autres, pour gagner du temps et ne pas faire d’erreur avant la création effective de la pièce.
Il permet de générer des fichiers utilisables par une imprimante 3D (fichier STL) ou une découpeuse laser (fichier DXF).
Git est un logiciel de gestion de version. Il permet, comme son nom l’indique, de versionner son code, c’est à dire de conserver les modifications apportées à chaque étape du développement, appelées commit. L’utilisation de Git se fait généralement à l’aide du terminal, mais il est aussi intégré graphiquement dans les IDE comme WebStorm ou VSCode.
Suite à un bogue, il peut être utile de revenir à un moment (un commit donc) où le code fonctionnait, pour mieux résoudre le problème, étape par étape.
On travaille souvent sur un serveur distant que l’on appelle remote, comme par exemple Bitbucket, GitHub ou GitLab, ainsi on a une copie locale sur laquelle travailler et une copie distante, en sécurité, ce qui limite grandement des pertes de données (suite à la perte de l’ordinateur ou du disque dur).
Avec un remote, il est facile de voir les modifications apportées au code, c’est une version graphique de Git : on peut y voir le code qui a été ajouté (en vert) et celui qui a été supprimé (en rouge).
Git facilite aussi de travail en équipe, notamment pour les développeurs qui travaillent à distance et qui peuvent envoyer (ou pusher) leur code sur le remote du projet. On utilise le concept de branche pour que chacun puisse avancer sur un même projet sans empiéter sur le travail des autres.
Le HTML (HyperText Markup Language) est un langage descriptif, c’est à dire composé de balises spécifiques à chaque type d’éléments sur la page (texte, titre, lien, tableau, liste, images, etc…), c’est le squelette de la page web. Des sélecteurs sur les balises permet d’y ajouter des règles CSS. Cette structure et son contenu jouent un rôle important dans le référencement naturel de la page web.
Le CSS (Cascading Style Sheets, feuilles de style en cascade en français) agrémente l’interface utilisateur (IU) en mettant en forme le HTML avec un style (couleurs, formes, placement des éléments, etc…). Ce style peut être interprété de façon légèrement différente selon les navigateurs, ce qui peut causer des problèmes de compatibilité.
La dernière version (CSS3) permet de gérer les animations et les transitions, permettant de s’affranchir du JavaScript pour la gestion de ces effets. Le CSS permet le responsive design grâce aux media queries : le contenu s’adapte alors automatiquement à la largeur du terminal (ordinateur, tablette ou mobile). Pour le développeurs le pattern le plus utilisé est le mobile-first, c’est à dire d’abord concevoir l’application sur mobile, puis d’étendre les règles CSS sur les formats plus grands. Ce langage a bénéficié de nombreux frameworks qui lui fournissent des classes prêtes à l’emploi.
Ces frameworks CSS, comme Bootstrap, Materialize CSS ou Semantic UI ont tous un style qui leur est propre, et qui les rendent parfois reconnaissables, si il ne sont pas trop personnalisés. Ils disposent d’un système de grid (grille en français) où viennent se placer les éléments HTML. Enfin, ils permettent enfin de gagner du temps en habillant le code avec un joli style déjà prêt sans que le développeur soit contraint de coder lui-même l’ensemble des classes CSS.
