Support de Cours/TP LA RI3

ATELIER DE GL (DREAMWEAVER)

IntroductionCe document concerne la configuration et le développement sur un poste local (client/serveur en même temps) d’une application web dynamique sous Dreamweaver. Avant de commencer, il faut s’assurer que le serveur web (Apache) et le serveur de base de données (MYSQL) sont bien installés et en marche (on peut installer le packet easyPHP et le lancer).

1. Configuration d’une application web sous Dreamweaver

Avant de faire la configuration d’une application web sous Dreamweaver, il faut commencer par créer un dossier local (sur la racine c : par exemple), et un dossier distant dans le serveur web (c:/ProgramFiles/easyPhp/www) dans lequel seront hébergés les pages enregistrées initialement dans le dossier local. Par la suite, les étapes suivantes sont à suivre :

a. Créer un nouveau site :

Ecole Polytechnique Centrale 1

Support de Cours/TP LA RI3

b. Définir le nom du site et les informations locales :

c. Définir le type d’accès et les informations distantes

Ecole Polytechnique Centrale 2

Support de Cours/TP LA RI3

d. Définir le nom du serveur et le dossier racine du serveur d’évaluation dans lequel le serveur web traite les pages dynamique (même chemin que le dossier distant)

Ecole Polytechnique Centrale 3

Support de Cours/TP LA RI3

Une fois la configuration est terminée, toutes les pages (PHP ou HTML) doivent être enregistrées dans le dossier local, puis exportées vers le serveur.

2. Création d’une connexion vers le serveur de base de donnéesUne connexion est un chemin établit entre l’application web et le serveur base de données MYSQL. Ainsi, avant d’établir cette connexion, il faut tout d’abord créer la base de données (Bouton Droit sur le serveur actif/administration/Gestion bases de données).Par la suite, suivre les étapes suivantes :

a. Créer une nouvelle connexion

Ecole Polytechnique Centrale 4

Support de Cours/TP LA RI3

b. Saisir les infos de la connexion puis valider

Une connexion reste utile pour toute l’application.

3. Création d’une page de consultationUne page de consultation permet d’afficher dans une page web les informations disponibles dans la base de données :

a. Créer un jeux d’enregistrement :

Ecole Polytechnique Centrale 5

Support de Cours/TP LA RI3

Ecole Polytechnique Centrale 6

Support de Cours/TP LA RI3

b. Configurer le jeu d’enregistrement :

c. Concevoir la page PHP : créer un tableau de deux lignes et de n colonnes (n est le nombre de colonnes de la table correspondante dans la base de données). La première ligne sert d’entête d’affichage, et dans la deuxième ligne glisser chaque champs vers une cellule :

Ecole Polytechnique Centrale 7

Support de Cours/TP LA RI3

d. Pour afficher tous les enregistrements dans la page web, il faut créer une région répétée sur la deuxième ligne. Pour cela, sélectionner la deuxième ligne du tableau et insérer une région répétée :

Ecole Polytechnique Centrale 8

Support de Cours/TP LA RI3

4. Création d’une page d’insertion de donnéesUne page d’insertion de données nous permet à partir d’une page web d’insérer des

données dans une table de la base de données. Pour cela il faut :a. Créer un formulaire HTML et nommer chaque composant :

b. Ajouter un comportement de serveur « insérer un enregistrement » et le configurer :

Ecole Polytechnique Centrale 9

Support de Cours/TP LA RI3

5. Création d’une page de recherche de donnéesUne page de recherche de données nous permet d’importer des données qui

correspondent au(x) critère(s) de la recherche et de les afficher sur une page web. Pour cela il faut :

a. Créer un formulaire de recherche et nommer ces composants :

Ecole Polytechnique Centrale 10

Support de Cours/TP LA RI3

b. Créer un jeu d’enregistrements filtrés qui importent les données qui correspondent au critère de recherche de la variable du formulaire. Si la recherche concerne plus qu’un critère, il faut écrire une requête en mode avancé :

Ecole Polytechnique Centrale 11

Support de Cours/TP LA RI3

c. Créer un tableau dynamique (2 lignes et n colonnes) dans lequel glisser chaque composant du jeu d’enregistrement dans une cellule.

d. Créer une région répétée sur la deuxième ligne qui permet d’afficher tous les enregistrements concernés.

6. Création d’une page de mise à jour de donnéesUne page de mise à jour de données nous permet de modifier des données de la base à

partir d’une page web. Pour cela il faut :a. rechercher l’enregistrement à modifier dans la BD par un formulaire de

recherche et créer un jeu d’enregistrement filtré (voir paragraphe précédent).b. Créer un formulaire qui correspond au jeu d’enregistrement créé dans lequel

glisser tous ses composants.c. Ajouter un comportement de serveur « mettre à jour l’enregistrement ».d. Configurer les paramètres.

Ecole Polytechnique Centrale 12

Support de Cours/TP LA RI3

7. Création d’une page de suppression de donnéesUne page de suppression de données nous permet de supprimer des données de la base

à partir d’une page web. Pour cela il faut :a. créer un jeu d’enregistrement normal.b. Placer tous les enregistrements dans un tableau dynamique.c. Ajouter une colonne à la fin dans laquelle écrire le mot « Supprimer » et faire

un lien vers la page elle-même en important avec l’URL la clé primaire dans une variable ID :

Ecole Polytechnique Centrale 13

Support de Cours/TP LA RI3

d. créer un nouveau jeu d’enregistrement filtré selon le paramètre de l’URL ‘ID’ :

Ecole Polytechnique Centrale 14

Support de Cours/TP LA RI3

e. Créer un formulaire qui contient tous les composants du formulaire avec un champ masqué qui correspond à la clé primaire.

f. Ajouter un comportement de serveur « Supprimer l’enregistrement » et le configurer :

Ecole Polytechnique Centrale 15