Blockly
Blockly est une bibliothèque logicielle JavaScript permettant de créer des environnements de développement utilisant un langage graphique. C'est un projet open source de Google, publié sous la licence Apache 2.0[2]. Présenté à la Maker Faire 2012, il vise à démocratiser le développement web[3].
| Blockly | |
| Date de première version | 2012 |
|---|---|
| Auteur | |
| Développeur | Neil Fraser |
| Dernière version | 9.3.3 ()[1] |
| Écrit en | JavaScript |
| Système d'exploitation | Windows, MacOS, Linux, Android, iOS |
| Licence | Licence Apache |
| Site web | https://developers.google.com/blockly/ |
Concrètement, il s'agit d'assembler des blocs dans un éditeur visuel directement sur une page web[3]. Le code généré est exempt d'erreurs de syntaxe et peut être exporté en JavaScript, Python, PHP, Dart ou Lua[4].
Interface utilisateur
L'interface utilisateur de Blockly est composée de deux éléments : une boîte à outils et un espace de travail. La boîte à outils contient tous les blocs disponibles pour créer le programme, ces blocs sont présentés seuls ou en catégories. Les blocs de la boîte à outils peuvent être déplacés (par "glisser-déposer") au sein de l'espace de travail afin de créer un programme.
Les blocs sont définis par le créateur de l'interface et peuvent être assemblés selon des règles prédéfinies de placement vis-à-vis des autres blocs.
Les blocs prédéfinis
Il existe de nombreux blocs prédéfinis qui ont l'avantage d'être traduits en JavaScript, Python, PHP, Lua, Dart. Ils sont regroupés en différentes catégories :
- Logique : Contient des blocs de définitions de booléens, de vérification d'égalité et de conditions
- Boucles : Contient des blocs permettant de faire des boucles
- Mathématiques : Contient les blocs de création de nombres ainsi que les opérations mathématiques, certaines fonctions de bases (sin, cos, racine carrée, ...) ainsi que des valeurs (pi)
- Texte : Contient des blocs permettant la création de texte et des opérations standards (concaténation, récupération d'une lettre, ...)
- Listes : Contient des blocs de création de listes ainsi que des opérations standards (longueur, récupération d'un élément, ...)
- Couleur : Contient des blocs définissant une couleur.
- Variables : Contient un bloc pour créer une nouvelle variable, ainsi que les opérateurs de modification et de récupération de la valeur d'une variable déjà créée.
- Fonctions : Contient des blocs pour créer une nouvelle fonction (avec ou sans valeur de retour), ainsi que les blocs pour utiliser les fonctions existantes (appel de fonction).
Personnalisation
En plus des blocs fournis dans la bibliothèque standard de Blockly, des blocs peuvent être créés pour adapter Blockly à un contexte particulier. Blockly fournit un outil appelé Blockly Developer Toolspour créer de nouveaux blocs.
Caractéristiques des blocs
Chaque bloc a une forme prédéfinie qui permet de limiter son usage à certaines situations, cette forme est définie par les connexions avec d'autres blocs, ces connexions pouvant être externes (les blocs précédents et suivants) mais également internes (arguments, blocs internes, ...).
La définition d'un bloc doit être stockée soit sous format JSON soit en code JavaScript pour être ajoutée à la boîte à outils. La définition visuelle d'un bloc doit être accompagnée de sa traduction dans un langage (ou plusieurs), de manière à pouvoir traduire l'intégralité des blocs formant un programme dans un langage de programmation existant, en évitant toute erreur de syntaxe.
Caractéristiques
- Application web en JavaScript du côté client (sans plugin)
- Support pour tous les principaux navigateurs : Chrome, Firefox, Safari, Opera, Internet Explorer, Microsoft Edge
- Support pour les navigateurs sous Android et iOS
- Traduction instantanée des blocs dans un ou plusieurs langages de programmation (sans erreur de syntaxe pour les blocs prédéfinis)
- Exécution bloc par bloc possible si l'ensemble des blocs est traductible en JavaScript, en utilisant un interpréteur JavaScript dans le navigateur.
- Traduction des blocs dans plus de 50 langues
- Support pour les systèmes d'écriture de gauche à droite et de droite à gauche
Applications utilisant Blockly
Blockly est utilisé dans un grand nombre de projets :
- Blockly Games, un ensemble de jeux éducatifs pour enseigner les concepts de programmation tels que les boucles et les conditions.
- App Inventor, pour créer des applications Android.
- Code.org pour enseigner une introduction à la programmation à des millions d'étudiants dans le cadre de l'Hour of Code.
- Scratch
Voir aussi
Articles connexes
Liens externes
De nombreux projets utilisent Blockly pour développer leurs applications [5], par exemple :
- App Inventor, permettant le développement d'applications sous Android,
- Blockly@rduino, permettant la programmation graphique pour Arduino,
- Blockly Games, des jeux pour apprendre la programmation,
- Code.org, qui organise notamment l'Hour of Code,
- Blockly4Thymio.net, un environnement de programmation pour le robot Thymio.
- BlocksCAD permet de modéliser en 3D avec des blocs et ainsi concevoir des pièces à imprimer en 3D.
- DGPad, un logiciel dynamique en ligne, dont le langage de script (y compris la tortue) est basé sur Blockly.
- Sofus, un langage de programmation concis et naturel, utilise aussi Blockly pour simplifier encore la programmation.
- Scratch 3.0 est aussi basé sur Blockly.
Références
- « Release 9.3.3 », (consulté le )
- (en) « Google Blockly Lets You Hack With No Keyboard », sur wired.com (consulté le ).
- Guillaume Belfiore, « Blockly : Google simplifie la programmation web », sur clubic.com, (consulté le ).
- (en) Barbara E. Hernandez, « Google's Blockly Teaches You to Create Apps », sur NBC Bay Area (consulté le )
- (en) « Build A Visual Programming Editor with Blockly », (consulté le ).