Procédure pas à pas : création d'une application Web simple

Article
08/21/2008

Mise à jour : novembre 2007

Dans cette procédure pas à pas, vous allez créer une application Web simple à utiliser comme base pour un test Web dans Procédure pas à pas : enregistrement et exécution d'un test Web.

Pour créer un exemple de test Web, vous devez utiliser une application Web à laquelle vous pouvez apporter des modifications arbitraires.

Dans cette procédure, vous allez exécuter les tâches suivantes :

Créer une application Web simple.
Tester l'application Web manuellement.

Composants requis

Pour exécuter cette procédure pas à pas, vous avez besoin de :

Microsoft Visual Studio 2005

Création d'une application Web

Pour créer l'application Web

Dans le menu Fichier de Microsoft Visual Studio 2005, cliquez sur Nouveau, puis sur Site Web.

La boîte de dialogue Nouveau site Web s'affiche.
Sous Modèles Visual Studio installés, cliquez sur Site Web ASP.NET.
Dans la zone Emplacement, sélectionnez Système de fichiers, puis tapez le nom du dossier dans lequel vous souhaitez conserver votre application Web. Ajoutez ColorWebApp\ColorWebApp à la fin du nom du dossier. Par exemple, tapez le nom de dossier C:\SitesWeb\ColorWebApp\ColorWebApp.

Remarque :

Incluez le nom deux fois afin de pouvoir ajouter un projet de test Web au premier dossier, et il sera séparé de l'application Web elle-même dans le deuxième dossier.
Dans la liste Langage, choisissez le langage de programmation que vous préférez.

Remarque :

Dans cette procédure pas à pas, vous n'allez écrire qu'un minimum de code.
Cliquez sur OK.

Remarque :
Incluez le nom deux fois afin de pouvoir ajouter un projet de test Web au premier dossier, et il sera séparé de l'application Web elle-même dans le deuxième dossier.

Remarque :
Dans cette procédure pas à pas, vous n'allez écrire qu'un minimum de code.

Ajout de contrôles à l'application Web

Pour ajouter des contrôles à l'application Web

Dans l'Explorateur de solutions, cliquez avec le bouton droit sur Default.aspx, puis choisissez Concepteur de vues.

Une page vierge s'affiche.
Si la boîte à outils n'est pas visible, cliquez sur Affichage, puis sur Boîte à outils.
À partir du groupe Standard, faites glisser un contrôle RadioButtonList sur la page.

Un contrôle RadioButtonList est ajouté à l'aire de conception.
Dans le panneau des balises actives Tâches RadioButtonList, cliquez sur le lien Modifier les éléments.

Un Éditeur de collections ListItem s'affiche.

Remarque :

Vous pouvez également afficher l'Éditeur de collections ListItem en modifiant la collection Items dans la fenêtre Propriétés.
Cliquez sur Ajouter pour ajouter un nouvel élément.
Sous propriétés ListItem :
1. Affectez la valeur Red à la propriété Text.
2. Affectez la valeur True à la propriété Selected.
Cliquez sur Ajouter pour ajouter un autre élément.
Sous Propriétés ListItem, remplacez la valeur de la propriété Text par Blue.
Cliquez sur OK pour fermer l'Éditeur de collections ListItem.
Faites glisser un Button sur la page et remplacez la valeur de la propriété Text par Envoyer.
Dans le menu Fichier, cliquez sur Enregistrer tout.

Remarque :
Vous pouvez également afficher l'Éditeur de collections ListItem en modifiant la collection Items dans la fenêtre Propriétés.

Ajout de pages à l'application Web

Pour ajouter des pages à l'application Web

Dans le menu Site Web, cliquez sur Ajouter un nouvel élément.
Dans la boîte de dialogue Ajouter un nouvel élément, cliquez sur le modèle Web Form, nommez-le Red.aspx, puis cliquez sur Ajouter.
En bas de la fenêtre du document, cliquez sur l'onglet Design pour basculer en mode Design.
Faites glisser un Label sur la page. Affectez la valeur Red à la propriété Text et la valeur Red à la propriété ForeColor.
Dans le menu Site Web, cliquez sur Ajouter un nouvel élément.
Dans la boîte de dialogue Ajouter un nouvel élément, cliquez sur le modèle Web Form, nommez-le Blue.aspx, puis cliquez sur Ajouter.
En bas de la fenêtre du document, cliquez sur l'onglet Design pour basculer en mode Design.
Faites glisser un Label sur la page. Affectez la valeur Blue à la propriété Text et la valeur Blue à la propriété ForeColor.
Dans le menu Fichier, cliquez sur Enregistrer tout.

Ajout de fonctionnalités à l'application Web

Pour ajouter des fonctionnalités à l'application Web

Dans l'Explorateur de solutions, cliquez avec le bouton droit sur Default.aspx, puis cliquez sur Concepteur de vues.
Double-cliquez sur le ButtonEnvoyer. Visual Studio bascule sur la page de code et crée un gestionnaire d'événements squelette pour l'événement Click du contrôle Button.

Ajoutez le code suivant au gestionnaire d'événements :

if (this.RadioButtonList1.SelectedValue == "Blue")
{
    Response.Redirect("Blue.aspx");
}
else
{
    Response.Redirect("Red.aspx");
}

If RadioButtonList1.SelectedValue = "Blue" Then
    Response.Redirect("Blue.aspx")
Else
    Response.Redirect("Red.aspx")
End If

Dans le menu Fichier, cliquez sur Enregistrer tout.

Test manuel de l'application Web

Pour tester l'application Web manuellement

Dans l'Explorateur de solutions, cliquez avec le bouton droit sur Default.aspx, puis cliquez sur Définir comme page de démarrage.
Appuyez sur CTRL+F5 pour exécuter l'application Web dans le navigateur. Vous allez voir la première page.
Cliquez sur Red, puis sur Envoyer. Si l'application fonctionne correctement, vous allez passer à la page qui contient le Label indiquant Red.
Revenez à la première page.
Cliquez sur Blue, puis sur Envoyer. Si l'application fonctionne correctement, vous allez passer à la page qui contient le Label indiquant Blue.

Étapes suivantes

Dans cette procédure pas à pas, vous avez créé une application Web simple et vous l'avez testé manuellement. Maintenant, vous êtes prêt à créer un test Web vous permettant de tester cette application. Pour plus d'informations, consultez Procédure pas à pas : enregistrement et exécution d'un test Web.