Je réalise un projet web en mode agile. TFS 2013 et Visual Studio Online peuvent-ils m'aider ? Comment ? » Venez voir comment l'ensemble des possibilités de TFS 2013 combiné à Visual Studio 2013 supporte la réalisation d'un projet Web en Scrum grâce (entre autre) aux déploiements automatiques dans des VMs Azure et aux nouvelles capacités de Visual Studio Online. Le programme consistera en un jeu de rôle combinant les capacités de Visual Studio 2013, le pilotage projet grâce à TFS (organisation des scénarios et des tâches), comment faire le standup meeting avec l'interface web (planification et décomposition des scénarios / exigences), le code review, la création de tests unitaires, la création d’une infrastructure Azure pour gérer les déploiements automatiques, et enfin l'exécution des tests utilisateurs suite à la demande de revue par le client. Speakers : Franck Farré (SQLI), Fabrice Hautot (SQLI)

2. Cycle de vie d'un projet web
agile avec TFS 2013, Azure
VM et Monaco
Franck Farré
Architecte
ffarre@sqli.com
Fabrice Hautot
Chef de projet technique
fhautot@sqli.com
SQLI
www.sqli.com
Code/Developpement

3. Donnez votre avis !
Depuis votre smartphone sur :
http://notes.mstechdays.fr
De nombreux lots à gagner toute les heures !!!
Claviers, souris et jeux Microsoft…
Merci de nous aider à améliorer les Techdays !
#mstechdays
Code/developpement

4. SOMMAIRE
#mstechdays
Code/developpement

5. Sommaire
• Le contexte
• L’industrialisation
• La méthodologie agile
• Visual Studio Online et Azure
• La mise en place
• Backlog et Planification
• Le lot #0
• L’infrastructure
• Réalisation
• Daily Scrum
• Monaco
• Tests et Build Automatique
• Packaging
• Azure VM et Virtual Network
• Build Controller sur Azure
#mstechdays
Code/developpement

6. INDUSTRIALISATION
#mstechdays
Code/developpement

7. INDUSTRIALISATION
Intégration
Continue
La démarche
Source
Control
Portail
d’équipe
Suivi de projet
et indicateurs
projet
TU, TUC, TUA
et UAT
- Pragmatique
- Progressive
- Amélioration
Continue
#mstechdays
Indicateurs
qualités
Code/developpement

8. MÉTHODOLOGIE AGILE
Basée sur Scrum
#mstechdays
Code/developpement

9. Cycle Agile
Source Wikipedia
#mstechdays
Code/developpement

10. VISUAL STUDIO ONLINE
#mstechdays
Code/developpement

11. VISUAL STUDIO ONLINE
• Étend les capacités de l’IDE
• Alternative à un TFS 2013 On Premise
#mstechdays
Code/developpement

12. WINDOWS AZURE
Le Cloud à notre service
#mstechdays
Code/developpement

13. WINDOWS AZURE
Source Microsoft
#mstechdays
Code/developpement

14. WINDOWS AZURE
• Toujours accessible (SLA 99,95%)
• Ouvert (API REST, commandlets
PowerShell…)
• Des solutions selon
les usages
#mstechdays
Code/developpement

15. WINDOWS AZURE
Source Microsoft
#mstechdays
Code/developpement

16. METTRE EN PLACE LE BACKLOG
Ecrire les exigences
#mstechdays
Code/developpement

17. METTRE EN PLACE LE BACKLOG
#mstechdays
Code/developpement

18. METTRE EN PLACE LE
BACKLOG
Elaboration d’un BackLog
#mstechdays
Code/developpement

19. PLANIFIER
Piloter son projet
#mstechdays
Code/developpement

20. PLANIFIER
#mstechdays
Code/developpement

21. PLANIFIER ET SUIVRE
Définition des itérations et création des tâches
#mstechdays
Code/developpement

22. MISE EN PLACE DU LOT #0
L’environnement de développement et le framework applicatif
#mstechdays
Code/developpement

23. LOT #0
• Création de la solution Visual Studio
– Liée à une tâche d’initialisation
– Création de l’arborescence projets
• projets d’analyse
• projets applicatifs
• projets de documentation (ex: SHFB…)
• projets de base de données
• projets de tests
• projets de déploiements
#mstechdays
Code/developpement

24. LOT #0
Le diagramme d’architecture (Layer Diagram)
• vision « macro »
• Source de documentation
• Validation à la compilation
Attention : validation assez longue sur les projets
volumineux.
#mstechdays
Code/developpement

25. MISE EN PLACE DE LA
SOLUTION
Projets et diagramme de couches
#mstechdays
Code/developpement

26. AZURE WEB SITE
#mstechdays
Code/developpement

27. AZURE WEB SITE
Permet la mise en place rapide
• d’un environnement d’intégration
• d’une intégration continue
Idéal pour les projets configurables
uniquement via le web.config
#mstechdays
Code/developpement

28. AZURE WEB SITE
Actions à mener
• Création du web site windows azure
• Autoriser la connexion entre Azure et VS
Online
Un build est automatiquement créé.
#mstechdays
Code/developpement

29. CRÉATION DU PROJET VS /
AZURE
Mise en place de la liaison
#mstechdays
Code/developpement

30. REALISATION
#mstechdays
Code/developpement

31. REALISATION
#mstechdays
Code/developpement

32. SPRINT BOARD
Mise à jour des tâches
#mstechdays
Code/developpement

33. EDITION EN LIGNE : « MONACO »
Outil d’édition en ligne
• Solution de « fixing » rapide
• Option de « Staging »
• Permet le maquettage HTML pure
• Lié au source control Git pour le moment
#mstechdays
Code/developpement

34. EDITION EN LIGNE : « MONACO »
Les raccourcis à connaitre
• « CTRL+E » pour trouver les options
• « ? » Rappel les commandes principales
#mstechdays
Code/developpement

35. EDITION D’UN PROJET AVEC
MONACO
#mstechdays
Code/developpement

36. TESTS
#mstechdays
Code/developpement

37. DECLENCHEMENT DU BUILD
#mstechdays
Code/developpement

38. COUTS DE MISE EN PLACE DE
CETTE USINE ??
0€
UNIQUEMENT DU TEMPS …
#mstechdays
Code/developpement

39. PACKAGING
#mstechdays
Code/developpement

40. PACKAGING
#mstechdays
Code/developpement

41. AZURE VM POUR LE BUILD
Quand le build Visual Studio Online ne suffit plus
#mstechdays
Code/developpement

42. LIMITE DU BUILD VISUAL STUDIO
ONLINE
Le build Visual Studio Online pose les
contraintes suivantes
• Build < 1h et <75Go
• Interdit
–
–
–
–
#mstechdays
installation de composants
droits administrateurs
connexion RDP au serveur de build
mode « interactive »
Code/developpement

43. Azure VM est une option
pour avoir son propre
environnement de build /
intégration.
#mstechdays
Azure VM
Dans ce cas, nous
utilisons un Build
Controller interne et non
hébergé par « Visual
Studio Online ».
Visual Studio
Online
DEFINIR UN BUILD CONTROLLER
Code/developpement

44. MISE EN PLACE D’UN BUILD
CONTROLLER
La cible
• Un Active Directory
• Un Serveur de Build
Active
Directory
#mstechdays
Code/developpement
Build
Server

45. MISE EN PLACE D’UN BUILD
CONTROLLER
Le IAAS
VM
1
VM
2
Subnet
Availability Set
Cloud Svc
Virtual Network
Storage Account
Storage Account
Affinity Group
#mstechdays
Code/developpement
Region

46. MISE EN PLACE D’UN BUILD
CONTROLLER
## INITIALISATION DES COMMANDES POWERSHELL AZURE
$subcriptionLocation = "C:Users<UserProfile>Downloads<SubscriptionName>credentials.publishsettings"
## Préparation des services azures, récupération de la subscription Azure
Get-AzurePublishSettingsFile
Import-AzurePublishSettingsFile $subcriptionLocation
## Pour retrouver les abonnements associés
Get-AzureSubscription | Format-Table -Property SubscriptionName,SubscriptionId
#mstechdays
Code/developpement

47. MISE EN PLACE D’UN BUILD
CONTROLLER à utiliser
# Définition de la subscription
Select-AzureSubscription -SubscriptionName $subcriptionName
# Création du groupe d'affinité
New-AzureAffinityGroup -Name $affinity -Location $location -Description
$descriptionAffinity
#mstechdays
Code/developpement

48. MISE EN PLACE D’UN BUILD
CONTROLLER
# Ajout d'un Vnet 10.0.0.0/8 & "Subnet-AD" 10.0.1.0/29 & "Subnet-BUILD" 10.0.2.0/24
Set-AzureVNetConfig -ConfigurationPath $networkConfigLocation
# Ajout du service cloud (accès public)
New-AzureService -AffinityGroup $affinity -ServiceName $serviceName -Description $descriptionService
Exemple de fichier de configuration XML
<NetworkConfiguration xmlns:xsd="http://www.w3.org/2001/XMLSchema"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://schemas.microsoft.com/ServiceHosting/2011/07/NetworkConfiguration">
<VirtualNetworkConfiguration>
<VirtualNetworkSites>
<VirtualNetworkSite name="Vnet-TD2014" AffinityGroup="Affinity-TD2014">
<AddressSpace>
<AddressPrefix>10.0.0.0/8</AddressPrefix>
</AddressSpace>
<Subnets>
<Subnet name="Subnet-AD">
<AddressPrefix>10.0.1.0/29</AddressPrefix>
</Subnet>
<Subnet name="Subnet-BUILD">
<AddressPrefix>10.0.2.0/24</AddressPrefix>
</Subnet>
</Subnets>
</VirtualNetworkSite>
</VirtualNetworkSites>
</VirtualNetworkConfiguration>
</NetworkConfiguration>
#mstechdays
Code/developpement

49. MISE EN PLACE D’UN BUILD
CONTROLLER
# Ajout de compte de stockage
New-AzureStorageAccount -StorageAccountName $accountStorage -AffinityGroup $affinity
# Création de la VM AD
Set-AzureSubscription -SubscriptionName $subcriptionName -CurrentStorageAccount $accountStorage
# pour retrouver les images
# Get-AzureVMImage | Where-Object {$_.OS -eq "Windows"} | Format-List -Property
Label,ImageName,Description
$vmAD = New-AzureVMConfig -name $vmNameAD -InstanceSize 'Small' -ImageName $image |
Add-AzureProvisioningConfig -Windows -Password $adminPassword -AdminUsername $adminUserName |
Set-AzureSubnet $vsubnetAD
New-AzureVM -ServiceName $serviceName -VMs $vmAD -VNetName $vnet -DeploymentName Depl-BUILD WaitForBoot
#Ajout disque pour du HDD pour l'AD "V"
Get-AzureVM $serviceName -Name $vmNameAD | Add-AzureDataDisk -CreateNew -DiskLabel sysvol DiskSizeInGB 32 -LUN 2 -HostCaching None | Update-AzureVM
#mstechdays
Code/developpement

50. MISE EN PLACE D’UN BUILD
CONTROLLER
#Credentials pour WinRmHTTPs
$securePassword = ConvertTo-SecureString -String
$adminPassword -AsPlainText –Force
#Configuration de l’AD
Invoke-Command `
-ConnectionUri $uri `
-Credential $adminCredentials `
-SessionOption $option `
-ScriptBlock {
$adminCredentials = New-Object `
-TypeName
System.Management.Automation.PSCredential `
-ArgumentList "$vmNameAD$adminUserName",
$securePassword
Param($pdomNetbios, $pdomFQDN, $padminPassword)
#Initialise le disque v et format
Initialize-Disk -Number 2 -PartitionStyle MBR
New-Partition -DiskNumber 2 -UseMaximumSize -DriveLetter v
Format-Volume -DriveLetter v -FileSystem NTFS -Confirm:$false
#Récupération des informations de communication WinRmHTTPs
$uri = Get-AzureWinRMUri -ServiceName $serviceName -Name
$vmNameAD
Import-Module ADDSDeployment
Install-ADDSForest `
-CreateDNSDelegation:$false `
-DatabasePath "v:windowsNTDS" `
-DomainMode "Win2012R2" `
-DomainName $pdomFQDN `
-DomainNetBiosName $pdomNetbios `
-ForestMode "Win2012R2" `
-InstallDns:$true `
-LogPath "v:windowsNTDS" `
-NoRebootOnCompletion:$false `
-SysvolPath "v:windowsSYSVOL" `
-SafeModeAdministratorPassword (convertto-securestring $padminPassword -asplaintext -
#Setup AD
Import-Module -Name ServerManager
Install-WindowsFeature -Name AD-Domain-Services -IncludeManagementTools
$option = New-PSSessionOption -SkipCACheck
force) `
-Force:$true
} `
-ArgumentList $domNetbios, $domFQDN, $adminPassword
#mstechdays
Code/developpement

51. MISE EN PLACE D’UN BUILD
CONTROLLER
#Création de la Vm "BUILD-VSBUILD" et mise dans le domaine
$vmBUILD = New-AzureVMConfig -name $vmNameBUILD -InstanceSize 'Large' -ImageName $imageVS |
Add-AzureProvisioningConfig -WindowsDomain -joindomain $domFQDN -Domain $domNetbios `
-DomainPassword $adminPassword -Password $adminPassword `
-DomainUserName $adminUserName -AdminUsername $adminUserName |
Set-AzureSubnet $vsubnetBUILD
New-AzureVM -ServiceName $serviceName -VMs $vmBUILD -VNetName $vnet -WaitForBoot
#mstechdays
Code/developpement

52. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

53. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

54. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

55. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

56. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

57. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

58. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

59. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

60. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

61. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

62. MISE EN PLACE D’UN BUILD
CONTROLLER
#mstechdays
Code/developpement

63. MISE EN PLACE DU BUILD
CONTROLLER
#mstechdays
Code/developpement

64. CONCLUSION
#mstechdays
Code/developpement

65. CONCLUSION
Nous avons mis en place
–
–
–
–
–
–
#mstechdays
un backlog projet
un source control
un serveur d’intégration avec Azure Web Site
un build d’intrégration continue
un réseau Windows Azure
un controlleur de builds personnalisé
Code/developpement

66. CONCLUSION
Visual Studio Online et Windows Azure
• Simplifie l’industrialisation
• Permet l’agilité
• Permet l’amélioration continue
des sites web (mais pas que…)
#mstechdays
Code/developpement

67. CONCLUSION
Franck Farré
Architecte
ffarre@sqli.com
Fabrice Hautot
Chef de projet technique
fhautot@sqli.com
Ressources
http://www.technologies-ebusiness.com/
#mstechdays
Code/developpement

68. Digital is
business