Vrais débutants : apprenez à créer des applications de bureau et pour smartphone

Habituellement, mes articles et sessions s’adressent à une audience de développeurs, c’est à dire des personnes déjà formées au développement logiciel, dont pour beaucoup des professionnels de l’informatique ou des passionnés.

Cette fois, je m’adresse à un public un peu différent, mais qui rêve de rejoindre notre grande communauté de développeurs !

Vous êtes porteur de projet, startup et devez vous confronter à la technique ? Vous êtes étudiant ou pensez vous réorienter professionnellement et le code vous tente ? Vous en avez assez de ne pas comprendre le charabia de l’équipe technique de votre boite ? Vous voudriez vous former en ligne mais même les cours sensés être pour débutants vous paraissent trop compliqués ?

Voici un cours en vidéo spécialement conçu pour les vrais débutants, n’ayant jamais tapé une ligne de code.

Voici le teaser sous forme de vidéo de 2 minutes avec la démo des applications [le cours est maintenant dispo contrairement au titre du teaser]

 

Publication by Microsoft Developpeur.

 

Tout est gratuit : les cours comme les outils.

Le but est de vous initier au développement logiciel et de vous guider dans la création de votre première application, de bureau et pour smartphone. Pourquoi ça vaut le coup d’essayer ? Simplement parce qu’apprendre des concepts de base de la programmation tout en créant une vraie application, c’est plus concret et ludique que de petits exercices isolés.

Evidemment, ce cours ne fera pas de vous des développeurs professionnels ! Mais il vous permettra de vous confronter enfin à la technique, de tester si coder vous plait. Monter cette marche vous permettra de mieux comprendre des cours destinés à des développeurs débutants comme ceux proposés en ligne sur OpenClassRoom ou à des programmes d’apprentissage de code accélérés type Le Wagon, etc…

Je ne suis pas seule dans l’aventure puisque c’est le designer et spécialiste UX (User eXperience) Michel Rousseau qui met en œuvre la partie ergonomie et design de l’application.

L’application fil rouge qui sert de support à cette formation est un jeu très simple : “Le Nombre Mystère”

Les règles : Trouvez le nombre mystère (entre 1 et 20) en un minimum d’essais. A chaque tour, vous saurez si c’est plus ou moins. Le nombre d’essais est illimité.

  

Le jeu déjà disponible sur le store Windows Phone est installable dès aujourd’hui sur votre smartphone.

Testez-le et imaginez des améliorations possibles, en terme d’algorithme ou d’ergonomie que vous pourrez mettre en œuvre à l’issue du cours, pour vous perfectionner

Vous utiliserez des outils (gratuits) utilisés par les professionnels du développement : Visual Studio et Blend. Le langage utilisé pour les cours est le C#, sachant que tous les concepts abordés dans le cours (variable, type, classe, méthode, algorithmie, debug, point d’arrêt…) s’appliquent à tous les langages et plateformes.

Le cours est divisé en plusieurs modules : on part de la version la plus simple possible en mode ligne de commande (ça s’appelle une application “console”) que l’on enrichit au fur et à mesure, jusqu’à arriver au résultat ci-dessus.

Programme du cours

Vous brulez d’envie d’en savoir plus ? Voici les principales étapes en images…

Sachez qu’au fil des vidéos, je poserai des questions (signalé par un diabolique bruit de maracas ) qui vous permettront de mettre en pratique mes explications et de vérifier votre niveau de compréhension. Pas de panique si vous calez, la solution vous est donnée dans la foulée.

Module 1 : Présentation du jeu et préparation au développement

On commence par la présentation du cours et une démo des jeux. Puis c’est parti : lancement de l’outil Visual Studio, création d’un projet et introduction des premiers concepts de programmation pour vous permettre de démarrer la conception du jeu dans les meilleures conditions.

Module 2 : Créez la version ultra-basique du jeu

On se concentre sur la partie algorithme et les principes élémentaires de la programmation. Donc on commence avec une interface graphique minimale pour ne pas dire inexistante.

Module 3 : Créez le jeu avec une interface graphique (WPF)

On réutilise le code “métier” du module 1 : c’est à dire les règles du jeu mises sous la forme d’un algorithme et codées en C#. On ajoute une interface graphique (fenêtres, boutons, champs de saisie, …) que l’on raccroche aux différentes parties de notre algorithme, côté code. Exemple : Un clic sur valider déclenche le code de vérification du nombre saisi,

On obtient l’application à gauche ci-dessous, qui est neutre en terme de design puisqu’elle utilise les contrôles par défaut.

C’est là qu’intervient Michel Rousseau, notre designer. Il va utiliser un outil dédié au design applicatif et à l’intégration : Blend. Sans ajouter ou modifier une seule ligne de code C#, et tout en restant dans un outil piloté à la souris, il part du projet existant et transforme notre application pour obtenir le résultat visible sur l’image de droite.

C’est ce que l’on appelle “the separation of concerns” : le code métier (codé en c#) est découplé de la couche d’interface graphique (codée en XAML). Si cela vous parle, sachez que c’est le même principe que pour html/css/javascript, en développement web.

 

Module 4: Portez le jeu sur smartphone en quelques clics (Windows Phone)

Pour développer la même application version smartphone, on reprend EXACTEMENT le même code métier : en effet l’algorithme reste le même et vous pouvez donc réutiliser intégralement votre code C# : seule l’interface graphique change puisque sur un écran plus petit, sans fenêtre et piloté uniquement au doigt.

On commence avec l’ergonomie par défaut à gauche, puis Michel Rousseau vous expliquera comment arriver au résultat de droite, toujours avec l’outil Blend et sans toucher au code existant, sur le même principe que dans le module 3.

Je vous expliquerai ensuite comment profiter des vignettes dynamiques de Windows Phone avant de publier l’application sur le store.

 

Module 5 : Créez l’application de peinture au doigt : FingerPaint – Coming soon -

DIY en 10 étapes simples

Module 6 : Installation des outils

Suivez ce module si vous souhaitez être accompagné étape par étape dans l’installation de Visual Studio. Sachez que Blend est installé automatiquement avec ce dernier.

A quoi ça sert ?

Le jeu est un joli prétexte pour vous apprendre entre autres les notions de :

• variables
• types
• tests conditionnels if…then…else
• boucles while
• classes
• méthodes
• design applicatif
• vignettes dynamiques (spécifique à Windows Phone et Windows 8)
• …

 

Vous expérimenterez:

• l’utilisation d’outils professionnels de développement
• la création d’un projet
• la programmation évènementielle
• votre premier bug
• l’exécution pas à pas
• les points d’arrêt
• le refactoring
• la publication sur un store
• la séparation du code métier et UI
• l’utilisation d’un simulateur de device
• …

 

Ces concepts se retrouvent dans tous les langages et sur toutes les plateformes, donc même si vous envisagez ensuite d’apprendre d’autres langages, ou de développer pour d’autres plateformes, vous n’avez pas perdu votre temps, au contraire !

En effet, le langage le plus difficile à apprendre, c’est le premier !

Comment je fais pareil pour iOS et Android ?

Vous pouvez développer la même application pour iOS et Android, toujours en C# et avec Visual Studio, grâce à Xamarin. C’est un Framework qui vous permet de développer des applications multi-plateformes (c’est à dire qui fonctionnent sur des OS de smartphone différents).

Eh oui, cela veut dire que vous pourrez réutiliser le code C# de cette application ! C’est bien l’idée de Xamarin : mutualiser au maximum et ne pas recoder autant d’applications qu’il y a des plateformes.

Je ne m’étends pas sur le sujet : cela fera peut-être l’objet d’un prochain cours.

Stay Tuned !

https://www.microsoftvirtualacademy.com/training-courses/apprendre-coder-pour-les-vrais-debutants

Comments

• Anonymous
  August 23, 2015
  Bonjour steph, juste te dire qu'il est trop cool le cours pour vrai débutant en Vs C#. Je suis le cours sur #MVA et aussi les exemples.  Précisément sur le jeu le nombre mystère il y, un truc qui vous a échappé,  lorsqu'on saisie un texte en lieu et place d'un nombre ça affiche bien que c'est pas un nombre et lorsque tu saisie un nombre il te dit que sa n'est pas un. Help me i'm lost .....

• Anonymous
  November 03, 2015
  bonjour et un grand merci pour cette idée d'article Cela fait déjà un moment que je souhaite développer des app pour smartphone, je n'y connais rien en programmation, donc une vrai vrai débutante. Et là, je m'y retrouve vraiment. Pouvez vous m'indiquer une suite à ce programme pour avancer ? Encore un grand merci Kori