Vue est un framework Javascript destiné à la création d’interface utilisateur. Vue est conçu pour être “progressif”. C’est à dire qu’il conviendra à plusieurs conceptions ou besoins différents comme vous pourrez le lire dans la documentation
Commencer avec Vue Le CDN En allant sur la doc de Vue vous trouverez le CDN permettant d’intégrer directement vue à une page html.
Il suffit d’ajouter ce script à la page.
Electron L’architecture d’electron Electron utilise plusieurs processus pour gérer les états de l’application et l’interface utilisateur. Le processus principal main gère les états de l’application pendant que le renderer s’occupe de l’interface utilisateur.
Au démarrage d’une application Electron un processus main est créé. On ne peut en avoir qu’un seul. Ce main a accès aux api de Node.js mais pas celles de chromium. De ce fait, on peut utiliser les API node comme fs.
Bienvenue dans le monde merveilleux de Flutter Qu’est-ce que Flutter C’est un Framework développé par Google pour développer des applications pour Android, iOS, Windows, Mac, Linux, et le web.
En clair, codez une fois et compilez pour tout! (pour exporter vers des ios il est nécessaire d’avoir un Mac)
Environnement de développement La doc de Flutter, en anglais, installer Flutter vous explique la démarche d’installation pour les 3 os (Windows, MacOS et Linux).
Les éléments de JavaFX Vous pouvez trouver un exemple d’utilisation d’une selection d’éléments de JavaFX sur mon dépot ici
Les Button et Label Les boutons et les labels sont les premiers élément que l’on utilise simplement dans JFX. Vous pouvez les déposer simplement dans votre pane (que l’on verra après). Il faut les nommer pour les retrouver ensuite dans le contrôleur.
Dans l’exemple, nous avons 3 boutons. Le bouton 1 a un nom btn1 et est associé à une méthode writeOnLabel comme on le voit dans sa transcription en fxml.
La librairie Retrofit2 Retrofit est une librairie qui simplifie la consommation d’api
On peut la trouver sur github
Nous allons l’ajouter a un projet gradle en ajoutant simplement compile 'com.squareup.retrofit2:retrofit:2.8.1' à nos dépendances ainsi qu’un convertisseur compile 'com.squareup.retrofit2:converter-gson:2.8.1' qui transformera nos objets json en objets Java.
Pour notre exemple, je vais utiliser une api toute faite jsonplaceholder
Ce site permet d’intérroger directement une api avec l’url. Par exemple si vous allez à l’adresse https://jsonplaceholder.
Construction du squelette de l’appli Commencez par créer un projet JavaFX avec Gradle.
Ajoutez les plugins au build.gradle
plugins { id 'java' id 'application' id 'org.openjfx.javafxplugin' version '0.0.8' } on définie les modules de javaFX la classe main
javafx { version = "14" modules = ["javafx.controls","javafx.base","javafx.graphics","javafx.fxml"] } mainClassName = 'org.germain.App' Créez les packages ainsi que App.java, velvet.fxml et VelvetController.java comme dans la vidéo.
Enfin, apportez les modification à build.
Un Widget pour connaître les chiffres du covid J’ai découvert grâce à Muhammed Afsal Villan une api et une méthode pour faire un widget qui nous donnera les stats du COVID-19 en direct.
D’abord l’API A l’adresse suivant https://coronavirus-19-api.herokuapp.com vous avez une api faite par Javier Aviles qui nous donne les chiffres du covid-19. Son utilisation est simple vous allez voire
Entrez https://coronavirus-19-api.herokuapp.com/countries/france dans insomnia et vous allez recevoir le json suivant:
✋ en cours de rédaction ✋
Ça sert à quoi une API? Tout d’abord API c’est “Application Programming Interface”. En d’autre termes c’est une interface qui permet le transfert de données d’une application à une (des) autre(s).
C’est une technique importante puisque nous avons besoin de faire interagir nos sites web avec nos applications desktop et nos application mobiles.
Par exemple, on peut intégrer les données d’une entreprise dans notre base de donnée grace à l’API de l’INSEE “sirene”.
Ajoutons des images à tout ça Téléchargez ces images ou utilisez les vôtres. Nous allons les intégrer à une application avec des images cliquables.
Créez un projet qui s’appel “Droid Cafe” en choisissant Basic Activity cette fois ci.
Nous ne toucherons pas à activity_main.xml mais à content_main.xml.
Dans content_main.xml commencez par supprimer le fragment (nous aborderons ces notions bien plus tard).
Remplacez le par un TextView :
Notre tout premier projet en JavaFX Dans cette vidéo je vous montre comment créer un premier projet JavaFX FXML. Je vais utiliser l’architecture maven pour ce projet car depuis le jdk 9 JavaFX n’est plus intégré nativement à la jvm et au jdk ce qui nous oblige à l’ajouter à nos projets.
Une option aurait été d’ajouter manuellement les librairies nécessaires mais maven peut faire le travail pour nous. De plus maven va gérer les dépendances du projet pour nous et rendre le projet migrable d’un poste de développement à l’autre.