Déployer un site Web Azure via Git Hub

Voici le dernier billet d’une petite série sur les sites Web Azure et la publication de nouvelle version directement à partir d’un gestionnaire de source.

Nous avons découvert le gestionnaire de source Team Foundation Service, ainsi que la publication d’un site web à partir de TFS.image

Nous allons nous intéresser aujourd’hui à un autre gestionnaire de source online qui est de plus en plus utilisé. En effet, GitHub est gratuit pour la communauté open source, permettant alors la création d’un nombre illimité de repository public ainsi que des collaborateurs.

image

D’ailleurs de plus en en plus de projet open source Microsoft se retrouve hébergé sur GitHub, je pense par exemple aux différents SDK Azure ou encore l’ouverture du code ASP.Net.

Création d’un compte GitHub

Pour commence, rien de plus simple, rendez-vous sur la page de GitHub : https://github.com/

Renseigner les éléments habituels (pseudo, email, mot de passe), puis enregistrez-vous :

image

A ce moment, un assistant est disponible afin de vous aider à commencer dans l’univers de GitHub. Les étapes sont les suivantes :

  • Configurer Git sur votre poste local
  • Créer un espace d’archivage
  • Archiver un projet
  • Be social : et oui c’est de l’open-source donc on partage nos projets.

Un nouveau client Git pour Windows est disponible depuis 2012! Cela permet de ne pas apprendre les lignes de commandes pour l’utilisation de ce gestionnaire de source.

Pour télécharger le client Windows, c’est par ici

L’installateur est un bootstrapper, il va donc télécharger la dernière version disponible avant l’installation réelle du client :

image

L’installation est ensuite silencieuse et vous accéder à la page de configuration de GitHub avec la liaison vers votre compte :

image

Une fois votre adresse et votre mot de passe renseigner, vous accédez aux détails de votre compte :

image

Enfin, l’onglet repositories indique les espaces de travail qui sont disponibles :

image

Cliquer sur dashboard pour accéder à l’interface de gestion de vos repositories :

image

Cliquer sur Create one

image

Renseigner les éléments suivants :

  • nom du projet
  • description
  • chemin d’accès local à votre solution Visual Studio (J’ai comme les billets précédents, créé une solution Visual Studio 2012 – Web Site Asp.Net MVC 4 que j’ai nommé GitWebSite)

ATTENTION: pour gérer vos références, vous avez deux possibilités :

  • Archiver les références externes que vous avez installé via nuget en incluant le répertoire packages.
  • Activer l’option “Enable NuGet Package Restore” au niveau de votre solution, ceci afin de permettre au processus de Build de télécharger les dernières versions de vos références et ignorer le répertoire packages avec le fichier .gitignore. (Cette option est selon moi la plus pertinente et permet de ne pas polluer sa gestion de source)

image

Vous avez la possibilité de publier votre code source dès la création du repository (référentiel) , sélectionner push, cela aura pour action de créer le repository sur GitHub mais sans y archiver les éléments déjà présents dans notre répertoire local.

image

Configuration du site web Azure

Une fois le site Web crée, nous nous rendons au niveau du tableau de bord, pour configurer la liaison avec notre compte Git :

image

La configuration requiert votre nom d’utilisateur ainsi que votre mot de passe de votre compte GitHub :

image

Le référentiel se crée

image

Une fois terminé, le tableau de bord nous indique bien que Windows Azure déploiera notre site Web lors de la prochaine publication de code source.

Nous pouvons à partir de la travailler à partir de plusieurs sources de données :

  • CodePlex
  • GitHub
  • Bitbucket

Nous avons crée dans notre compte git un repository, GitWebSite, nous allons lier ce référentiel à notre site Web Azure :

  • Cliquer sur Déployer à partir de mon référentiel GitHub
  • Cliquer sur Autoriser la notification à Windows Azure

image

Cela va ouvrir une pop up et éventuellement vous demander de vous connecter à votre compte pour vous demander d’autoriser l’accès à votre compte depuis l’application Windows Azure :

image

Cliquer sur Authorize app

Une nouvelle fenêtre s’ouvre alors vous demandant de choisir le référentiel à publier :

image

L’application est alors prête a être déployée, comme notre référentiel est vide, nous devons faire une première action d’archivage pour que le déploiement se mette en route.

Synchronisation de notre code source sur Git

De retour sur notre interface GitHub Windows : il faut cliquer sur la flèche de notre référentiel pour accéder aux éléments modifiés qui doivent donc être archivés

image

Dans la fenêtre des changements, renseigner une description (cette description apparaitra ensuite dans le tableau de bord Windows Azure) et cliquer sur Commit

image

Un nouvel écran s’affiche, vous indiquant que vous n’êtes pas synchronisé :

image

Pour cela il est donc nécessaire de publier nos changements via le bouton publish en haut de la fenêtre de l’application Git :

image

Une fois l’ensemble des changements téléchargé sur le serveur, le bouton change en vous indiquant que vous êtes bien synchronisés (in sync)

image

Vous voyez alors apparaitre sur votre interface de gestion de votre site Web Azure, le déploiement en cours :

image

et après quelques instant, nous pouvons voir que ce déploiement est activé :

image

Si nous explorons notre site web, nous avons bien un site ASP.Net MVC 4 opérationnel :

image

Modification et publication du code source

Nous allons modifier notre code source et effectuer une nouvelle publication, pour cela, nous nous rendons dans le contrôleur Home sur la méthode Index (HomeController.cs), afin de la remplacer par la méthode suivante :

public ActionResult Index()
{
ViewBag.Message = "Site Web déployé via GitHub";

return View();
}

Après avoir sauvegardé, nous pouvons voir dans notre outil Git, qu’un fichier a été modifié, nous pouvons donc archiver un nouveau changement.

image

Après avoir renseigner la description, nous devons donc reproduire les étapes de confirmation :

  • Commit
  • Publish

La mise à jour se déploie automatiquement sur notre site web Windows Azure :

image

image

image

Enfin, un petit rafraichissement sur notre page d’index nous montre que le déploiement est bien fonctionnel :

image

Enfin, sur notre tableau de bord Windows Azure, je vous rappel un des points parmi les plus intéressants de ces types de déploiement : “Le redéploiement”.

En effet, si vous sélectionnez un ancien déploiement, vous pouvez remarquer qu’un bouton supplémentaire apparait dans la barre du pied de page :

image

Le bouton Redéployer vous permettra en effet de faire un retour arrière (roll-back) de votre déploiement si vous vous rendez compte qu’un bug est survenu.

Et voila, nous avons vu comment :

  • créer un compte sur GitHub
  • créer et sauvegarder du code source à l’aide de l’outil GitHub for Windows
  • déployer de manière automatique (à chaque nouveau changement) la dernière version de notre code source

Pour information, pour l’instant, la liaison WAWS avec GitHub n’est pour l’instant fonctionnelle qu’avec les référentiels public, la comptabilité avec les référentiels privée est cependant dans la roadmap.

This entry was posted in Français, Microsoft, Windows Azure Platform and tagged , , . Bookmark the permalink.

2 Responses to Déployer un site Web Azure via Git Hub

  1. Pingback: Déployer un site Web Azure via Git Hub - Windows Azure France - Site Home - MSDN Blogs

  2. Pingback: [Tutoriel Windows Azure] Déployer un site Web Azure via Team Foundation Service - Windows Azure France - Site Home - MSDN Blogs

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s