Tutoriel DART : Les Premiers Pas - IONOS

Home » Apprendre Dart Openclassroom » Tutoriel DART : Les Premiers Pas - IONOS

Maybe your like

Aller au contenu principalDigital GuideChercher Produits IONOS Produits IONOSClose
  • Domaines
    • Noms de Domaine
    • Transfert de domaine
    • Domaine .fr
    • Nom de domaine gratuit
    • Nouvelles extensions
    • Certificats SSL
    • Sécurité de domaine
  • Sites Internet & e-Commerce
    • Créer un site Internet
    • Nous créons votre site Internet
    • Référencement SEO
    • Gestion de la réputation par IA
    • Créer une boutique en ligne
    • Service de conception e-commerce
    • Plugin e-commerce
    • Bouton d'achat pour les réseaux sociaux
  • Hébergement & WordPress
    • Hébergement Web
    • Hébergement pour WordPress
    • Hébergement géré pour WordPress
    • Hébergement pour WooCommerce
    • Jamstack
    • Hébergement Joomla!
    • Deploy Now
    • Hébergement virtuel (VPS)
    • Hébergement ASP.NET
  • Office
    • Adresse email professionnelle
    • Email marketing
    • Archivage d’emails
    • Email Microsoft Exchange
    • Microsoft 365 / Office 365
    • Google Workspace
    • Stockage en ligne HiDrive
    • HiDrive Share
    • Managed Nextcloud
    • MyDefender
  • Serveurs
    • Bare Metal Serveur
    • Serveurs Cloud
    • Cloud Backup
    • Dedicated Server
    • IONOS Cloud
    • Object Storage
    • Object Storage
    • VPS Windows
    • Serveurs virtuels (VPS)
    • Cloud GPU VM
  • Outils
    • Générateur de nom d’entreprise
    • Générateur de noms de domaine par IA
    • Générateur de logo
    • Favicon Generator
    • Vérificateur Whois
    • Analyse de Site Web
    • Audit SEO
    • Test SSL
    • Vérificateur d'adresse IP
Menu principalCloseChercherProduits IONOS
  • Sites internet
    • Création de sites internet
    • Web design
    • Développement web
    • Droit d'internet
  • Hébergement
    • CMS
    • Blogs
    • Aspects techniques
  • Serveur
    • Know-how
    • Configuration
    • Sécurité
    • Outils
  • Domaines
    • Extensions de domaine
    • Gestion de domaine
    • Actualités sur le domaine
    • Conseils sur le domaine
  • Web marketing
    • Vendre sur internet
    • Search Engine Marketing
    • Les média sociaux
    • Analyse web
  • Email
    • Marketing email
    • Sécurité email
    • Aspects techniques
  • Conseils
    • WordPress
Image: ION_FR_TVC_25-Q3_SMB_BAN_MyWebsite_1200x628_DG_V2_PNG.pngImage: ION_FR_TVC_25-Q3_SMB_BAN_MyWebsite_960x1200_DG_V2_PNG.pngEssayez gratuitementClose
  1. IONOS
  2. Digital Guide
  3. Sites internet
  4. Développement web
  5. Tutoriel programmation DART
Tutoriel DART : les premiers pas
  • L'équipe éditoriale IONOS16/10/2020
    • Partager sur Facebook
    • Partager sur Twitter
    • Partager sur LinkedIn
Image: Tutoriel DART : les premiers pasBillion PhotosShutterstock
Sommaire
  • L’origine de DART
  • Débuter avec DART
  • DART en pratique
  • Aperçu des opérateurs DART

Malgré sa relative jeunesse, le langage de programmation DART a déjà su s’imposer, notamment dans la programmation d’applications mobiles. L’entreprise Google a lancé Flutter, son kit de développement de logiciel (SDK) qui utilise DART et favorise l’utilisation et la diffusion de ce langage de programmation. L’un de ses points forts vient du fait qu’il peut être utilisé pour programmer des applications pour tous les systèmes d’exploitation mobiles, c’est-à-dire Apple iOS, Google Android ou Microsoft Windows Phone.

Apprenez à programmer avec DART : notre tutoriel DART présente les premières étapes pour se familiariser avec le langage de programmation de Google. Ce n’est pas très difficile. Pour en savoir plus sur ce langage de programmation, consultez notre article sur le langage DART. Vous trouverez de plus amples informations dans notre article sur le kit de développement de logiciels Flutter.

L’origine de DART

À l’origine, DART a été créé pour résoudre les problèmes de JavaScript qui, du point de vue des développeurs, ne pouvaient plus être résolus dans ce langage de programmation déjà établi.

Cette constatation a été le point de départ d’une longue recherche pour trouver des moyens visant à simplifier ou résumer certaines logiques internes sans compromettre toutes les possibilités offertes par ce langage. À titre d’exemple, un code en JavaScript :

getElementsById() getElementsByTagName() getElementsByName() getElementsByClassName() querySelector() querySelectorAll() document.links document.images document.forms document.scripts formElement.elements selectElement.options

Le même code avec DART :

elem.query(‘#foo’); elem.queryAll(‘.foo’);

Débuter avec DART

Un langage de programmation est un univers qui se compose notamment d’un « vocabulaire » permettant de structurer et de concevoir des processus (algorithmes). Pour cela, le langage utilise un nombre fixe de termes, les variables, qui ont une fonction précise. Dans DART, on peut nommer les variables « var », « int », « if », « else » ou encore « while ». Pour en savoir plus sur l’architecture des langages de programmation, consultez notre article dédié. La combinaison de variables, d’opérateurs, de conditions, de fonctions et de bien d’autres éléments conduit au déroulement du programme qui produit un résultat.

DART en pratique

Pour apprendre la programmation avec DART, notre tutoriel vous propose tout d’abord des exemples simples et compréhensibles que vous pourrez ensuite développer et avec lesquels vous pourrez expérimenter. Chaque routine commence par l’appel de la fonction principale. Voici un exemple classique dans le monde de la programmation :

void main () { print("Hello World!"); }

La fonction « main » est précédée par le type de retour « void », qui indique que la fonction ne renvoie rien. La parenthèse « () » indique qu’il s’agit d’une fonction et le code DART est indiqué dans les crochets « {....} ». Ici, il s’agit d’une commande qui a pour objectif d’afficher quelque chose à l’écran. Tout ce qui se trouve après les barres obliques « // » est considéré comme un commentaire et est invisible. Les commentaires peuvent également être indiqués sous la forme « /* ceci est un commentaire multiligne ...*/ » comme en PHP. Cela vous permet de commenter votre propre code de manière structurée pour votre usage ou à destination d’autres programmeurs, ce qui facilite grandement le travail d’équipe.

Note

Comme pour Java, C et PHP, toutes les commandes DART doivent se conclure par un point virgule.

Testez par vous-même l’exemple ci-dessous. Pour cela, utilisez la plateforme open source gratuite DartPad. Ce pad a notamment l’avantage de numéroter les lignes du programme et d’afficher des messages si une erreur se produit. En outre, il met à disposition certains exemples de programmation dans les menus déroulants.

Dans les exemples qui suivent, « void main() {…} » n’est plus indiqué dans le code.

Définir et utiliser les variables

Les variables sont utilisées pour définir des tailles fixes pour le programme. Commençons avec les chiffres.

var mySize = 174;

Cela permet de définir une nouvelle variable pour « MySize ». Ici, on lui attribue la valeur « 174 ». La valeur de cette variable reste fixe tout au long du déroulement du programme jusqu’à ce qu’elle soit activement modifiée par des opérateurs ou des fonctions. La commande « print » intervient pour afficher la valeur des variables.

var mySize = 174; print(mySize); int yourSize = 174; print(yourSize); double thisSize = 1.74; print(thisSize); dynamic oneSize = 'Onehundredseventyfor' + ': ' + '174'; print(oneSize);

Grâce à la commande « print » dans DartPad, les lignes 3, 6 ,9 et 12 affichent les résultats suivants :

Image: Apprendre à programmer avec DART : la commande print
Il est possible de choisir (presque) n’importe quel nom pour les variables. Cela simplifie la lecture et la correction du code du programme.
Image: Apprendre à programmer avec DART : la commande print
Il est possible de choisir (presque) n’importe quel nom pour les variables. Cela simplifie la lecture et la correction du code du programme.
Close

Les variables DART ont des types précis. Il peut s’agir de nombres entiers (« int ») ou de nombres à virgule flottante (« double »). Le type de variable « dynamic » peut prendre différentes valeurs et expressions pendant le déroulement du programme. En revanche, les lignes, onglets ou paragraphes vides ne sont pas pris en compte lors du traitement de la routine. C’est pour cette raison que les valeurs sont affichées les unes au-dessous des autres, à droite de la console.

L’attribution d’une valeur incorrecte à un type de variable particulier génère un message d’erreur décrivant l’erreur dans DartPad :

int mySize = 1.74; // integer is expected, but double comes print(mySize);
Image: Apprendre à programmer avec DART : message d’erreur
DartPad affiche « 1 issue(s) » lors de l’attribution d’une valeur erronée. Dans l’exemple, un nombre à virgule flottante ne peut pas être attribué à une variable entière. L’erreur se produit dans la ligne 2 du déroulement du programme, le numéro incorrect est souligné en orange.
Image: Apprendre à programmer avec DART : message d’erreur
DartPad affiche « 1 issue(s) » lors de l’attribution d’une valeur erronée. Dans l’exemple, un nombre à virgule flottante ne peut pas être attribué à une variable entière. L’erreur se produit dans la ligne 2 du déroulement du programme, le numéro incorrect est souligné en orange.
Close Note

Les identificateurs (Identifier) des variables utilisées ne doivent pas contenir de mots-clés. Les chiffres au début ainsi que les espaces et les caractères spéciaux ne sont pas autorisés, les seules exceptions sont le tiret bas « _ » et le signe de dollar « $ ». Les identificateurs sont sensibles à la casse et doivent être uniques.

Chaînes de caractères

Les chaînes de caractères correspondent au type de données « String » (Attention : ne pas oublier le S majuscule au début), qui permet de traiter n’importe quel caractère en DART. Cela permet également d’aborder la programmation du formatage de textes multilignes avec DART.

String text1 = 'this is a single line string'; String text2 = '''this is a multiline line string with a break'''; print(text1); print(text2);
Image: Apprendre à programmer avec DART : texte simple ou multiligne
Texte simple ou multiligne en DART : le formatage est défini par le nombre de guillemets utilisés.
Image: Apprendre à programmer avec DART : texte simple ou multiligne
Texte simple ou multiligne en DART : le formatage est défini par le nombre de guillemets utilisés.
Close

Pour afficher le texte sous forme de chaîne, encadrez le contenu de guillemets simples ou normaux : ' ou ". Si le texte est encadré par une série de trois guillemets simples ou doubles (''' ou """) il sera affiché en Dart avec les sauts de ligne d’origine. Vous disposez ainsi d’une technique pour formater l’affichage.

Conseil

Sous Windows, les guillemets typographiques (anglais) peuvent facilement être insérés dans le texte grâce aux raccourcis clavier [Alt] + 0147 (ouvrant) et [Alt] + 0148 (fermant). Ils sont également affichés sous cette forme dans une chaîne de caractères DART. Sous macOS, les raccourcis clavier pour ces guillemets sont : [Alt] +[Maj] + [W] et [Alt] + [2].

Jouer avec les nombres en DART

De la définition des variables aux calculs avec des variables, il n’y a qu’un pas. Il est possible d’additionner des nombres ou même des expressions. Pour effectuer les calculs, DART utilise des opérateurs arithmétiques. À titre d’exemple, prenons le cas d’un article dans une boutique en ligne dont le client voudrait acheter trois exemplaires. Dans la fonction panier, le prix individuel doit donc être multiplié par « 3 » et le prix total doit s’afficher. Dans le code ci-dessous, on peut voir l’utilisation de différentes méthodes de regroupement des données, et les commentaires dans les lignes correspondantes :

String product = 'calendar'; String curr = 'EUR'; String isFor = 'for'; // 3 strings for later print use double singlePrice = 7.96; // floating comma for single price int amount = 3; // number of ordered calendars var totalPrice = (amount*singlePrice); // calculation oft he total price with multiplier * var invTotal = '$totalPrice $curr'; /* Merging of two variables in a new one by adding a $ sign before the old variables.*/ var result = '$amount $product\s'; //also plus adding a letter “s” for plural print (invTotal); //creating the screen output print (isFor); print (result);
Image: Apprendre à programmer avec DART : calcul simple
Exemple de calcul simple combiné avec des blocs de texte.
Image: Apprendre à programmer avec DART : calcul simple
Exemple de calcul simple combiné avec des blocs de texte.
Close

Avec les chaînes de caractères, les nombres à virgule flottante, les nombres entiers et les fusions d’éléments, de nouvelles variables sont introduites dans la programmation. Lors de la fusion de deux variables existantes en une nouvelle variable à afficher à l’écran, il convient de noter que les variables prédéfinies sont dans ce cas précédées par un signe dollar « $ » (ligne 8 et 9 dans la capture d’écran DartPad ci-dessus).

Définir des conditions

Les conditions jouent un rôle essentiel lors de la programmation. Découvrez comment programmer une condition avec DART. Une condition mène toujours à une décision : si (if) le cas A se produit, le signe X s’affiche à l’écran ; si le cas B se produit (elseif), le signe Y s’affiche ; quand aucun des deux ne se produit (else), le signe Z s’affiche. Le code suivant est généré grâce aux commandes DART entre parenthèses :

var tOol = 'Glove'; if (tOol == 'Pliers' || tOol == 'Ruler') { print('That is a tool.'); } else if (tOol == 'brush') { print('That is a tool.'); } else { print('That is not a tool.'); } }

Dans DartPad :

Image: Apprendre à programmer avec DART : utilisation de conditions
Les conditions définissent le résultat qui s’affiche.
Image: Apprendre à programmer avec DART : utilisation de conditions
Les conditions définissent le résultat qui s’affiche.
Close

Enrichissez vos connaissances acquises au cours du tutoriel DART et remplacez le mot « gant » dans le DartPad par « pince », « règle » ou « pinceau » et observez les changements dans l’affichage programmé sur la console. Cet exemple peut être modifié à volonté et appliqué à différents cas. L’opérateur « || » apparaît pour la première fois dans cet exemple. Cette double barre verticale remplace le connecteur logique « ou » qui n’est pas utilisé sous la forme « OR » dans DART.

Augmentations et diminutions

Pour programmer la section suivante, nous devons nous familiariser avec ce que l’on appelle les incréments et décréments dans DART. Il s’agit de l’augmentation ou de la diminution progressive d’une valeur de sortie. Dans cet exemple, le chiffre 50 est modifié grâce aux opérateurs « ++ » et « -- ».

var upAndDown = 50; print (upAndDown); print('----'); ++upAndDown; print (upAndDown); print('----'); upAndDown++; print (upAndDown); print('----'); --upAndDown; print (upAndDown); print('----'); upAndDown--; print (upAndDown);
Image: Apprendre à programmer avec DART : augmentation et diminution d’une valeur
Le nombre 50 est augmenté et diminué à nouveau de manière définie.
Image: Apprendre à programmer avec DART : augmentation et diminution d’une valeur
Le nombre 50 est augmenté et diminué à nouveau de manière définie.
Close

Vous pouvez également voir qu’il est possible d’afficher une chaîne de caractères simple sans indiquer de définition préalable ; pour cela, il suffit de l’introduire dans le code entre parenthèses et entre guillemets précédé de la fonction « Print ». Dans le cas présent, la chaîne de caractères sert à structurer l’affichage du résultat. Avec ces connaissances, vous êtes prêt à programmer des boucles.

Programmer des boucles dans DART

Les boucles sont également des routines de programme importantes qui sont réutilisées continuellement, par exemple, pour effectuer des comparaisons avec les tailles existantes. C’est à cela que sert la « formulation » suivante : nous avons la valeur A, modifions cette valeur jusqu’à ce que la taille (l’état) B soit atteinte. Code en DART :

String myLabel = ' pieces'; var piece = 3; while (piece < 12) { var allThisStuff = '$piece $myLabel'; print(allThisStuff); piece++; }

Que fait le DartPad avec ce code ?

Image: Apprendre à programmer avec DART : boucles
Les boucles se répètent jusqu’à ce qu’une condition définie soit remplie.
Image: Apprendre à programmer avec DART : boucles
Les boucles se répètent jusqu’à ce qu’une condition définie soit remplie.
Close

Dans cet exemple, il est également possible d’utiliser à nouveau les conditions si, par exemple, les mots diffèrent au singulier et au pluriel :

int amount = 1; var itemSing = 'blouse'; var itemPlural = 'blouses'; if (amount == 1) { print(itemSing); } else { print(itemPlural); }

Pour apprendre à programmer avec DART, copiez les codes des exemples dans DartPad et modifiez la variable entière « quantité » afin que l’article « chemisier » soit affiché au singulier ou au pluriel.

Aperçu des opérateurs DART

Vous venez de vous familiariser avec quelques opérateurs pour la programmation avec DART. Dans le tableau ci-dessous, retrouvez les opérateurs importants à votre disposition pour la programmation avec DART.

Dans le tableau, la valeur « exemple » est définie sur 35.

var exemple = 35;
Type d’opération Description Symbole Exemple Résultat
Calculer Addition + var exemple + 2; 37
Soustraction - var exemple - 2; 33
Multiplication * var exemple * 3; 105
Division / var exemple / 7; 5
Division de nombres entiers ~/ var exemple ~/ 7; 11
Augmentation de += var exemple += 6; 41
Réduction de -= var exemple -= 7; 28
Multiplication par *= var exemple *= 2; 70
Division par /= var exemple /= 7; 5
Comparer Identique == var exemple == 35; Vrai
Différent != var exemple != 44; Vrai
Plus petit que < var exemple < 44; Vrai
Plus petit ou égal à <= var exemple <= 33; Faux
Plus grand que > 44 > var exemple; Vrai
Plus grand ou égal à >= var exemple>=23; Faux
Modifier Augmentation ++ ++var exemple; 36
Augmentation ++ var exemple++; 36
Diminution -- --var exemple; 34
Diminution -- var exemple--; 34
Valeur résiduelle % %var exemple%3; 2
Logique ET && exemple1 && exemple2 … et
OU exemple1 exemple2 … ou
Négation ! exemple1 ! exemple2 ... n’est pas
Conditions Si-alors ? … : var y = exemple < 34 ? 15 : 10; 10
Si-alors ? … : var y = exemple < 36 ? 15 : 10; 15
Vérification si nul ?? var y = exemple ?? 9; 35
Vérification si nul ?? var z = 0 ?? exemple; 35

Grâce à ces connaissances de base, vous allez pouvoir rapidement progresser avec DART et vous n’êtes plus très loin de pouvoir programmer votre propre application.

Aller au menu principal

Produits associés

Créer un site Internet Voir les packs Image: ION_FR_TVC_25-Q3_SMB_BAN_MyWebsite_1200x1200_DG_V2_PNG.pngImage: ION_FR_TVC_25-Q3_SMB_BAN_MyWebsite_1200x1200_DG_V2_PNG.png

Tout savoir sur l’IA

Inscrivez-vous à notre newsletter pour découvrir les dernières tendances de l’IA et recevoir des conseils pratiques.

Je m’inscris

Tout savoir sur l’IA

Close

Inscrivez-vous à notre newsletter pour découvrir les dernières tendances de l’IA et recevoir des conseils pratiques.

Articles Populaires

Revente de nom de domaine : comment gagner de l’argent avec les noms de domaines ?

Acheter et vendre des noms de domaines peut être lucratif, à condition toutefois de savoir…

Lire la suite
5 alternatives à Nextcloud en comparaison directe

À la recherche d’une alternative à Nextcloud performante ? Découvrez les meilleures…

Lire la suite
Comparaison des 7 meilleurs services de sauvegarde en ligne

Sauvegardez vos données de manière fiable dans le Cloud ! Vos données sont en sécurité…

Lire la suite
Debian 13 Upgrade : comment mettre à niveau vers Debian 13 étape par étape ?

Ce guide vous aide à mettre à niveau Debian 13 en toute sécurité, à préparer votre système…

Lire la suite
4 alternatives gratuites à Adobe InDesign

La publication assistée par ordinateur (PAO) avec Adobe est trop chère ? Il existe des…

Lire la suite

Articles similaires

Image: Tutoriel Flutter : développer des applications avec le SDK de GoogleGround PictureShutterstock

Tutoriel Flutter : développer des applications avec le SDK de Google

Au cours des dernières années, Google a publié sur le marché de nombreux services utiles comme Gmail, Maps ou Google Workspace, mais aussi différents outils pour la programmation de logiciels. L’un de ces outils est le SDK Flutter, particulièrement intéressant pour les…

  • Tutoriels
Lire la suite Image: Créer son application, partie 5.1 : Google Play StoreBillion PhotosShutterstock

Créer son application, partie 5.1 : Google Play Store

Si vous en êtes à considérer comment installer votre application sur Google Play Store, la fin semble proche. L’application Android est en version Release et doit pouvoir atterrir sur le plus possibles d’appareils mobiles. Toutefois, déployer son application sur le store de…

  • Numérisation
  • Tutoriels
Lire la suite Image: Créer son application mobile native, partie 3 : le designBillion PhotosShutterstock

Créer son application mobile native, partie 3 : le design

Le design d’une application est loin de s’arrêter à sa forme et ses couleurs : nombreux sont les autres éléments à prendre en compte pour une meilleure présentation et usabilité. Le travail investit va être déterminant pour amener vos mobinautes à réellement utiliser votre…

  • Numérisation
  • Tutoriels
Lire la suite Image: Créer son application native, partie 2 : programmation ou éditeur d’app ?Billion PhotosShutterstock

Créer son application native, partie 2 : programmation ou éditeur d’app ?

Teaser:

  • Tutoriels
Lire la suite Image: Turtoriel LuaREDPIXEL.PLShutterstock

Turtoriel Lua

Vous avez peut-être déjà entendu parler du langage de script Lua : originaire du Brésil, il est utilisé aussi bien pour les moteurs de jeu que les serveurs Web. En tant que langage embarqué, Lua permet une programmation dans un format uniforme, entièrement indépendante de…

  • Tutoriels
Lire la suite hash_8d371a87cd437f11233a9cf1d33a8c0da6492a0a

Tag » Apprendre Dart Openclassroom