Concepts Webdev 12 PDF | PDF | Ajax (Programmation) | Sites web\nConcepts Webdev 12 PDF\nEnregistrerEnregistrer 9525263-Concepts-Webdev-12.pdf pour plus tard\n249 vues155 pages\nDessin.book Page 1 Vendredi, 22.\nfvrier 2008 5:53 17\nDessin.book Page 2 Vendredi, 22. fvrier 2008 5:53 17\nWebDev 12 - Concepts\nVersion 12 - (1) 11-07\nVisitez rgulirement le site www.pcsoft.fr, espace tlchargement, pour vrifier si des\nmises jour sont proposes.\nConseil : Pour recevoir directement des mises jour intermdiaires et des conseils\ndutilisation, abonnez-vous la LST (revue trimestrielle + CD), en franais.\nCette documentation nest pas contractuelle. Des modifications ont pu intervenir dans\nle logiciel depuis la parution de ce manuel. Veuillez consulter laide en ligne.\nTous les noms de produits ou autres marques cits dans cet ouvrage sont des marques dposes par leurs propritaires respectifs.\nPC SOFT 2007 : Aucune reproduction intgrale ou partielle du prsent ouvrage sur quelque support que ce soit ne\npeut tre effectue sans lautorisation expresse de PC SOFT.\nDessin.book Page 3 Vendredi, 22. fvrier 2008 5:53 17\nWebDev 12 est un puissant outil de dveloppement de sites Internet / Intranet, qui fournit\ntous les outils ncessaires la conception et la ralisation de sites pour le Web.\nPour une formation rapide et efficace WebDev 12, nous vous conseillons lordre dapprentissage suivant :\nCe manuel prsente les principaux concepts ncessaires la cration dun site\nLe guide dauto-formation permet une premire approche "pratique" de WebDev.\nVous pouvez ainsi vous familiariser avec les principaux diteurs de WebDev.\nTestez les diffrents exemples livrs avec WebDev dans les domaines qui vous intressent (e-commerce, annuaire, planning, ...).\nLe "manuel de programmation" est prvu pour une lecture ponctuelle au fur et mesure\nde vos besoins. Pour chaque sujet, vous trouverez le concept associ et la liste des fonctions du WLangage correspondantes.\nL'aide en ligne permet de trouver rapidement la syntaxe d'une fonction du WLangage,\ndobtenir une aide sur linterface, ...\nNous vous souhaitons une agrable prise en main de WEBDEV.\nRemarque : En cas de divergence entre le manuel et l'aide en ligne, suivez les instructions\nDessin.book Page 4 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 5 Vendredi, 22. fvrier 2008 5:53 17\nQuest-ce quun site ? ........................................................................................................11\nSite statique, semi-dynamique ou dynamique ? .............................................................12\nLes diffrents types de sites dynamiques .......................................................................13\nLes diffrents types de pages ...........................................................................................14\nComparaison pages AWP et pages dynamiques WebDev ..............................................18\nPARTIE 2 - DVELOPPEMENT DUN SITE\nDvelopper un site avec WebDev .....................................................................................25\nTerminologie : Site et projet ..............................................................................................26\nMachines et logiciels ncessaires ....................................................................................27\nConfiguration du serveur ...................................................................................................28\nTableau de bord du projet .................................................................................................29\nPerso-dossiers : Organisez votre projet ............................................................................30\nGestionnaire de sources (GDS) .........................................................................................31\nCentre de Suivi de Projets .................................................................................................33\nWinDev, WebDev, WinDev Mobile : Projet unique ...........................................................34\nConfiguration de projet ......................................................................................................35\nGnration multiple ...........................................................................................................36\nLes deux types de code .....................................................................................................39\nLe WLangage : un langage simple et trs puissant ........................................................42\nComposants multi-produits ...............................................................................................44\n2 looks de site : modles ou framesets ...........................................................................47\nModle de pages (template) .............................................................................................48\nFrameset : une page HTML divise ..................................................................................49\nJe cre une page sous lditeur ... ....................................................................................50\nLes fichiers suivants sont automatiquement crs : .....................................................51\nChoisir un type de champ selon linformation afficher ................................................52\nQuel type dimage choisir : dynamique, statique, gnre, ... ? ....................................54\nCrer des effets sur les boutons : boutons personnaliss .............................................56\nLes modles de champs ...................................................................................................58\nRpter un groupe de champs .........................................................................................59\nAfficher un fichier dans une Table ou dans une Zone Rpte ...................................60\nPositionner les champs dans une page ...........................................................................61\nSuperposer les champs .....................................................................................................62\nDessin.book Page 6 Vendredi, 22. fvrier 2008 5:53 17\nDes feuilles de styles CSS : pour simplifier la mise en page ..........................................63\nSite centr ou adapt ? .....................................................................................................64\n10 conseils dergonomie ... ...............................................................................................65\nSite multi-langue ................................................................................................................69\nAfficher et enchaner les pages ........................................................................................73\nEmpcher le retour sur une page .....................................................................................79\nChoisir un type de bouton / lien .....................................................................................80\nOrdre dexcution des codes des boutons / liens ..........................................................81\nTlcharger un fichier (image, ...) vers le serveur (Upload) ............................................83\nWebDev et les tats ..........................................................................................................84\nDiffrents modes dimpression ........................................................................................85\nRaliser un traitement sur plusieurs pages successives ...............................................86\nEnvoyer des emails ............................................................................................................87\nConserver des informations sur le poste de linternaute grce aux cookies ................89\nProtger laccs au site : mots de passe .........................................................................90\nCrypter les informations qui transitent sur le Web avec SSL .........................................91\nAvantage scuritaire pour votre site dynamique : la gestion du "Back" ........................92\nPaiement scuris avec prestataire ................................................................................95\nPARTIE 5 - BASE DE DONNES\nLes diffrents types de fichiers accessibles ....................................................................99\nComment lier un champ sa rubrique ......................................................................... 100\nHyper File Classic ............................................................................................................ 101\nHyper File Client / Serveur ............................................................................................. 102\nLes requtes ................................................................................................................... 103\nLes requtes intgres ................................................................................................... 104\nRplication universelle ................................................................................................... 105\nArchitecture 3-tiers ......................................................................................................... 106\nTester un site : Les lments tester ........................................................................... 109\nComment tester un site ? .............................................................................................. 110\nLe dbogueur .................................................................................................................. 112\nQuand peut-on utiliser le dbogueur ? ......................................................................... 113\nA quoi sert ladministrateur WebDev ? ......................................................................... 114\nPARTIE 7 - DPLOYER UN SITE\nDploiement dun site statique ou dun site semi-dynamique WebDev ..................... 117\nDploiement dun site dynamique WebDev ................................................................. 118\nCentre de contrle dhbergement ............................................................................... 122\nRfrencement dun site ............................................................................................... 123\nDessin.book Page 7 Vendredi, 22. fvrier 2008 5:53 17\nMise en service dun site dynamique WebDev ............................................................. 124\nServeur ddi ou mutualis ? ........................................................................................ 125\nQuel type de serveur choisir ? ....................................................................................... 127\nInstaller un site dynamique WebDev sur des configurations spcifiques .................. 128\nMaintenance dun site dynamique WebDev ................................................................. 135\nConsulter les statistiques de frquentation des sites dynamiques ............................ 136\nRcuprer des donnes sur un site .............................................................................. 137\nPrincipales nouveauts de WebDev 12 ........................................................................ 143\nVous connaissez dj WinDev ....................................................................................... 145\nFonctions du WLangage spcifiques WebDev 12 ..................................................... 146\nComposants livrs avec WebDev .................................................................................. 149\nExemples livrs avec WebDev ....................................................................................... 150\nDessin.book Page 8 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 9 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 10 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 11 Vendredi, 22. fvrier 2008 5:53 17\nQuest-ce quun site ?\nUn site Internet / Intranet est un ensemble de pages HTML stockes sur un serveur Web.\nCes pages HTML sont organises dans un but prcis (par exemple, prsenter une entreprise, vendre des produits, ...).\nUn site est destin tre utilis par des internautes. Les internautes utilisent un simple\nnavigateur pour accder au site.\nPoste serveur chez un hbergeur.\nLes pages HTML sont stockes\nLinternaute accde au site et\naffiche des pages HTML\ngrce un navigateur\nWebDev permet de crer facilement des sites Internet / Intranet qui grent ou non des\nDessin.book Page 12 Vendredi, 22. fvrier 2008 5:53 17\nPlusieurs types de sites peuvent tre raliss :\n- des sites statiques.\n- des sites semi-dynamiques\n- des sites dynamiques.\nLe tableau ci-dessous prsente les principales diffrences entre ces types de sites :\nest fixe, dtermin une fois\nUn site statique ne peut pas\ninteragir avec des donnes.\nest construit partir de donnes prsentes dans des fichiers\nCependant, le contenu des\npages est fixe.\nSite statique WebDev : le moteur WebDev nest pas ncessaire.\nSite semi-dynamique WebDev : le moteur WebDev nest\nLes donnes affiches dans\nles pages varient.\nEn gnral, les pages permettent de :\n- raliser des traitements et/\nou des calculs par programmation.\n- afficher des donnes stockes dans une base de donnes.\n- afficher des images et du texte interactif.\nSite dynamique WebDev : le\nmoteur WebDev est ncessaire.\nLe tableau ci-dessous prsente quelques exemples de sites statiques et de sites\n- site de prsentation dune socit, ...\n- site dune association\n- site dun quotidien ...\n- catalogue de produits avec gestion en temps\nrel des commandes\n- site de gestion des rservations de voyages\n- site de gestion des stocks dune entreprise\nRemarque : Un site dynamique peut contenir une partie statique (prsentation de lentreprise, ...).\nWebDev permet de crer :\n- des pages statiques.\n- des pages dynamiques.\n- des pages semi - dynamiques.\nDessin.book Page 13 Vendredi, 22. fvrier 2008 5:53 17\nLes diffrents types de sites dynamiques\nUn site dynamique permet dafficher des pages dont le contenu varie. Le plus souvent, le\ncontenu de ces pages est li une base de donnes.\nIl est ainsi possible par exemple dans un site dynamique de grer en temps rel les rservations de voyages. Ces rservations sont directement enregistres dans un fichier de\ndonnes et peuvent tre affiches tout moment.\nWebDev propose deux types de sites dynamiques :\n- site dynamique WebDev. Ce type de site ncessite un moteur WebDev sur le serveur.\nIl permet de manipuler de nombreuses bases de donnes.\n- site dynamique PHP. Ce type de site ncessite un moteur PHP sur le serveur. Ce type\nde site est conseill pour hberger des sites dynamiques chez un hbergeur grand public.\nSeules les bases de donnes MySQL peuvent tre manipules avec ce type de site.\nDessin.book Page 14 Vendredi, 22. fvrier 2008 5:53 17\nLes diffrents types de pages\nDiffrents types de pages peuvent tre utiliss dans les sites crs avec WebDev :\nLes pages statiques. Ce type de page permet dafficher des donnes fixes.\nLes pages semi-dynamiques. Ces pages permettent dafficher des donnes disponibles dans une base de donnes. Ces pages et leur contenu sont gnres sur le poste\nde dveloppement lors de la cration du site. Lorsque les pages HTM correspondant\naux pages dynamiques sont cres, le contenu de la page est alors fix.\nLes pages dynamiques WebDev. Ces pages permettent dafficher dynamiquement les\ninformations contenues dans une base de donnes. Le contenu de la page varie en\nfonction de lenregistrement affich.\nLors de laffichage dune page dynamique, le contexte correspondant est automatiquement sauvegard et mis jour sur le serveur. Le contexte de lapplication contient principalement les variables globales, les variables de positionnement dans les fichiers de\nLes pages dynamiques WebDev AWP. Ces pages permettent dafficher dynamiquement des donnes contenues dans une base de donnes. Le contenu de la page varie\nen fonction de lenregistrement affich.\nLes pages AWP peuvent utiliser ou non le contexte de lapplication. Ce contexte peut\ntre stock sous forme de cookie ou sur disque. Si les pages AWP nutilisent pas le contexte de lapplication, elles sont autonomes.\nLes pages dynamiques PHP. Ces pages permettent dafficher dynamiquement des\ndonnes contenues dans une base de donnes. Ces pages peuvent uniquement tre\nutilises dans un site PHP.\nLes pages suivantes prsentent ces diffrents types de pages.\nDessin.book Page 15 Vendredi, 22. fvrier 2008 5:53 17\nPrincipe dune page statique\nD V E L O PP E M E NT\nCration dune page\nWebDev (fichier ".WWH")\nD P L O IE M E NT\nPage statique visualise\nDessin.book Page 16 Vendredi, 22. fvrier 2008 5:53 17\nPrincipe dune page semi-dynamique\nassocie au projet\nD P L O I E M E N T\nPage statique (correspondant aux pages\nsemi-dynamiques) en excution sous le navigateur.\nLa page affiche correspond aux informations\ndemandes par linternaute.\nDessin.book Page 17 Vendredi, 22. fvrier 2008 5:53 17\nPrincipe dune page dynamique\nD V E L O P P E M E NT\nCration dune page dynamique\nsous WebDev (fichier ".WWH")\nD P L O I E M E NT\nPage dynamique en excution sous le navigateur.\nLes donnes affiches dans les pages varient en\nfonction des manipulations de linternaute.\nDessin.book Page 18 Vendredi, 22. fvrier 2008 5:53 17\nLors de l'affichage d'une page dynamique WebDev, les oprations suivantes sont effectues :\n1. Demande d'affichage de la page.\n2. Lancement du moteur WebDev. Le moteur sera prsent sur le serveur jusqu' la fin de\n3. Cration du contexte de l'application. Ce contexte sera prsent sur le serveur jusqu' la\n4. Le moteur WebDev excute le code serveur et construit la page HTML ( partir des donnes de la base de donnes par exemple).\n5. Lorsque le moteur a fini de construire la page HTML, le serveur transmet le rsultat au\nclient (le navigateur).\nPoste de linternaute\nWebDev et fermeture du contexte (fin\nCration du fichier\nDessin.book Page 19 Vendredi, 22. fvrier 2008 5:53 17\nUne page AWP est un fichier binaire contenant le code HTML de la page, et le code serveur\n(saisi sous l'diteur de code par le dveloppeur). Ce fichier doit avoir l'extension ".awp"\npour pouvoir tre interprt par le serveur.\nAinsi, lorsqu'un navigateur (le client) dsire accder une page dynamique AWP ralise\navec WebDev :\n1. Le serveur reconnat qu'il s'agit d'un fichier AWP.\n2. Le serveur appelle le moteur WebDev pour lire le fichier AWP.\n3. Le moteur WebDev excute le code serveur et construit la page HTML ( partir des donnes de la base de donnes par exemple).\n4. Lorsque le moteur a fini de construire la page HTML, le moteur se ferme.\n5. Le serveur transmet le rsultat (la page HTML) au client (le navigateur).\nRemarque : il est possible dutiliser un contexte avec les pages AWP en dfinissant les variables persistantes grce la fonction DclareContexteAWP.\nDessin.book Page 20 Vendredi, 22. fvrier 2008 5:53 17\nQue signifie AJAX et quel est son intrt ?\nsi certains lments prsents dans une page affiche (le contenu du panier, les caractristiques d'un produit, une liste de villes, une carte gographique, ) doivent tre modifis, seuls ces lments seront rafrachis. Le serveur n'aura pas envoyer la page entire\nsur le poste de l'internaute.\n- le serveur est moins sollicit. Il peut alors supporter un plus grand nombre de connexions simultanes.\n- les informations qui circulent sont de taille rduite.\n- la dure de transmission est plus courte.\n- l'affichage pour l'internaute est immdiat et sans effet visuel.\nAJAX peut tre utilis deux niveaux diffrents dans un site WebDev :\n- AJAX automatique et immdiat : un simple clic suffit pour accder aux avantages AJAX.\nLe code reste le mme.\n- AJAX programm : utilisation des fonctions de gestion AJAX pour les traitements complexes.\nRemarque : Seuls les navigateurs rcents supportent la technologie AJAX (Internet Explorer 5.5 et suprieur, FireFox 1.0 et suprieur, Netscape 7 et suprieur, Opera 8 et suprieur, Safari 1.2 et suprieur, ). La fonction AJAXDisponible permet de savoir si le\nnavigateur en cours supporte la technologie AJAX. Si un traitement utilisant la technologie\nAJAX est excut sur un navigateur ne supportant pas cette technologie, le traitement\ns'excute "comme si" il nutilisait pas la technologie AJAX (rafrachissement de la page entire par exemple).\nDessin.book Page 21 Vendredi, 22. fvrier 2008 5:53 17\nAJAX automatique et immdiat\nLe schma suivant prsente lutilisation automatique et immdiate de AJAX dans un site\nde la requte\nPar exemple, une page d'un site permet de connatre diffrentes caractristiques d'un\npays (capitale, devise, drapeau, situation, ). En fonction du pays slectionn par l'internaute, les informations correspondantes sont affiches.\nAction de l'internaute. Dans notre exemple, slection du pays dans la combo\n"Slectionner le pays souhait".\nEnvoi de la requte au serveur.\nExcution de la requte : recherche des caractristiques du pays slectionn.\nEnvoi du rsultat de la requte :\n- sans AJAX : toute la page est envoye.\n- avec AJAX : seules les caractristiques du pays sont envoyes.\nAffichage des caractristiques du pays :\n- sans AJAX : toute la page est raffiche.\n- avec AJAX : seuls les champs contenant les caractristiques du pays sont\nDessin.book Page 22 Vendredi, 22. fvrier 2008 5:53 17\nLe schma suivant prsente l'utilisation de "AJAX programm" dans un site WebDev :\ndexcution de la\nAnalyse du rsultat\ndu rsultat :\nExcution d'un traitement navigateur (fonction AJAXExcute ou AJAXExcuteAsynchrone).\nDemande d'excution d'une procdure serveur.\nExcution de la procdure serveur.\nGnration du rsultat. Le rsultat de la procdure sera exprim sous forme\nd'une chane de caractres ou d'un document XML.\nEnvoi du rsultat de la procdure (Mot-cl RENVOYER).\nAnalyse du rsultat de la procdure.\nAffichage des informations modifies. Seuls les champs ncessaires sont rafrachis.\nDessin.book Page 23 Vendredi, 22. fvrier 2008 5:53 17\nDveloppement dun site\nDessin.book Page 24 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 25 Vendredi, 22. fvrier 2008 5:53 17\nDvelopper un site avec WebDev\nCration du Projet\nCration de l'analyse\n- RAD projet\n- RAD page\n- Conception et saisie du\nsur un poste de test\nTest du site depuis\ndu site sur le serveur\nTests rels du site\nTests de monte\nPartie 2 : Dveloppement dun site\nDessin.book Page 26 Vendredi, 22. fvrier 2008 5:53 17\nUn projet WebDev est un ensemble de pages, champs, classes, composants, ... dont le\nbut est de raliser un site Internet / Intranet.\nUne analyse WebDev regroupe la description des fichiers de donnes.\nUn projet est gnralement associ une analyse.\nUne analyse peut tre associe un ou plusieurs projets.\nPour crer le site "jaidebeauxyeux.com", crez le projet "jaidebeauxyeux".\nDessin.book Page 27 Vendredi, 22. fvrier 2008 5:53 17\nMachines et logiciels ncessaires\nune machine : PC, Mac, Unix, WebTV, console,\nun navigateur : Internet Explorer, FireFox, Netscape, ...\nun accs Internet (ou Intranet)\nAucun module ne sera tlcharger. Le fonctionnement est immdiat et rapide.\nLa machine de dveloppement\n1 machine serveur : PC\n1 machine : PC\n1 systme d'exploitation\nserveur (Windows ou Linux) :\n1 systme d'exploitation :\nNT, Windows 2000 ou suprieur.\nWindows 2000 ou suprieur.\n1 logiciel serveur Web :\n1 serveur dapplication\n1 logiciel WebDev\nle site lui mme\nle site en cours de\nles donnes *\nles donnes (optionnel) *\nau moins un navigateur :\nLes donnes peuvent se trouver sur une autre machine relie en rseau.\nUne machine UNIX ou Linux peut tre utilise en frontal du serveur.\nDessin.book Page 28 Vendredi, 22. fvrier 2008 5:53 17\nau site WebDev\nSeul un navigateur\n(IIS, Apache, ...)\nDessin.book Page 29 Vendredi, 22. fvrier 2008 5:53 17\nLe tableau de bord du projet est un lment indispensable la gestion de projets WinDev.\nLe tableau de bord permet davoir une vision globale et synthtique de ltat davancement dun projet.\nLe tableau de bord du projet est compos :\n- de voyants : Si les voyants sont verts, tout va bien. Les voyants rouges signalent un problme potentiel.\n- de listes dlments, permettant un accs rapide aux principales options du projet.\n- de compteurs, permettant de grer les nouveauts, les demandes, ...\nDessin.book Page 30 Vendredi, 22. fvrier 2008 5:53 17\nLditeur de projets de WebDev permet de reprsenter la cartographie complte du projet.\nSur des projets de taille importante, la navigation dans cette reprsentation peut tre dlicate. La notion de "perso-dossiers" permet damliorer cette navigation.\nUn "perso-dossier" contient les lments que vous y rangez, par exemple une partie du\nsite : la gestion des clients, la gestion des fournisseurs, ...\nDes lments peuvent tre communs plusieurs "perso-dossiers". Il est ainsi plus simple\nde travailler sur une partie du site.\nDtail dun perso-dossier\nDessin.book Page 31 Vendredi, 22. fvrier 2008 5:53 17\nPour simplifier vos dveloppements en quipe, WebDev propose dsormais un gestionnaire de sources. Ce gestionnaire de sources permet plusieurs dveloppeurs de travailler simultanment sur le mme projet.\nIl est possible de partager les lments prsents dans le GDS :\n- via un rseau.\n- en mode dconnect. Dans ce cas, les lments sur lesquels un travail spcifique devra tre effectu seront extraits du GDS par exemple lors de la connexion du portable\nau systme gnral.\nDessin.book Page 32 Vendredi, 22. fvrier 2008 5:53 17\nVoici un exemple dutilisation du Gestionnaire de Sources :\nExtraction de la Fentre Beta du\nProjet A Version 1 9h13\nModification en clientle\nExtraction de la fentre Alpha du\nProjet A Version 1 9h57\nRintgration de la fentre Alpha modifie\ndans le Projet A Version 2 10h41\nProjet A Version 2 14h28\nRintgration de la fentre Beta modifie\ndans le Projet A Version 3 18h32\nSi un lment (page, tat, ...) du projet est extrait, ce mme lment ne pourra pas tre\nextrait une seconde fois.\nAprs modification des lments extraits, il est ncessaire de rintgrer ces lments\npour que le projet de base prenne en compte ces modifications. En effet, la base de sources conserve un historique de tous les lments du projet depuis leur cration.\nA chaque rintgration dun lment, le numro de version du projet de base est incrment de 1.\nDessin.book Page 33 Vendredi, 22. fvrier 2008 5:53 17\nAprs avoir list lensemble des tches dun projet, le Centre de suivi de projet soccupe\nde tout. La saisie du temps pass est quasi automatique, ne demande aucune action spcifique et ne gnre aucune contrainte particulire.\nLors de louverture du projet concern, le Centre de suivi de projet demande ou indique la\ntche en cours. Ds quune tche est ralise, il suffit dindiquer que cette tche est termine et de spcifier la nouvelle tche.\nUne tche peut tre relie un lment du projet (page, tat, ...). Chaque fois que llment concern est ouvert, le temps pass sur cet lment est dcompt et mmoris\ndans le Centre de suivi. Inversement, depuis la liste des tches, il est possible douvrir\nautomatiquement llment correspondant la tche que vous voulez raliser.\nChaque dveloppeur peut galement visualiser directement sa liste de tches dans le volet "Centre de suivi".\nLe Centre de Suivi de Projets permet de grer le planning de ralisation dun projet, de sa\ncration sa livraison finale. Il est ainsi possible de connatre lensemble des tches raliser sur un projet, les dveloppeurs concerns, les dures ncessaires, ltat davancement du projet, ...\nDessin.book Page 34 Vendredi, 22. fvrier 2008 5:53 17\nWinDev, WebDev, WinDev Mobile : Projet\nLes projets crs actuellement sont souvent multi-cibles.\nPar exemple, pour un ERP destin fonctionner sous Windows, il est fort probable qu'en\nplus de l'application qui sera le socle de la solution applicative, des commerciaux seront\nquips de PDA ou de Smartphones, les magasiniers utiliseront des terminaux mobiles\npour la gestion des stocks et qu'un site Intranet et un site Internet seront mis en place.\nDsormais, toutes ces informations sont regroupes dans un projet global.\nQuelque soit le produit avec lequel un projet a t cr, il est possible de l'ouvrir avec les\nLorsque vous ouvrez un projet dans un produit diffrent de celui qui a permis de le crer, un assistant\nsaffiche, permettant de crer un configuration de\nprojet spcifique au produit utilis.\nPar exemple, si un projet WinDev est ouvert avec\nWebDev, vous pouvez crer une configuration de\nprojet nomme "SiteWEB", permettant de regrouper\ntous les lments ncessaires au site WebDev.\nDans les phases d'utilisation de l'environnement, il\nest possible de visualiser depuis chaque environnement les lments de chaque cible. Un projet sous\nWinDev affiche les vignettes des pages WebDev et\nles fentres WinDev Mobile par exemple. Cliquer sur\nune page WebDev depuis l'diteur de projet WinDev\nouvre la page WebDev (WebDev doit tre install sur\nSont galement partags : les documents, les descriptions de modlisations, les composants, les classes, ...\nDessin.book Page 35 Vendredi, 22. fvrier 2008 5:53 17\nLes configurations de projet permettent de crer partir d'un mme projet plusieurs "cibles" diffrentes.\nVous pouvez ainsi crer partir d'un mme projet par exemple :\n- 2 ou 3 sites qui ne contiennent pas les mmes lments, qui ont des noms\n- 3 ou 4 composants\n- 2 bibliothques\nA tout moment, vous pouvez travailler sur une configuration spcifique : les lments n'appartenant pas cette configuration apparaissent griss sous l'diteur de projet.\nIl est possible de gnrer en une seule opration toutes les configurations dun projet (ou\nuniquement certaines) grce la gnration multiple.\nDessin.book Page 36 Vendredi, 22. fvrier 2008 5:53 17\nLes configurations de projets permettent de dfinir simplement les diffrentes "Cibles" de\nvotre projet. Vous pouvez ainsi dfinir pour un mme projet plusieurs sites, plusieurs bibliothques ou plusieurs composants.\nPour gnrer le rsultat de chaque configuration, vous pouvez bien entendu slectionner\nune une chaque configuration, et gnrer le programme correspondant.\nUn autre moyen plus rapide existe : la gnration multiple. Vous slectionnez en une seule opration les configurations gnrer, et le rsultat est immdiat.\nPour lancer une gnration multiple, utilisez loption "Atelier .. Gnration multiple".\nDessin.book Page 37 Vendredi, 22. fvrier 2008 5:53 17\nLe RAD (Rapid Application Development) permet de crer des pages partir :\n- de lanalyse lie au projet,\n- des modles RAD standard,\n- des modles RAD personnaliss,\n- des gabarits WebDev.\nLes pages gnres contiennent tout le code ncessaire leur fonctionnement. Ces pages peuvent tre testes immdiatement, avec les donnes prsentes sur le poste de dveloppement\nRAD Application complte\nExemple de page gnre par le RAD\nExemple de code gnr\npar le RAD\nDessin.book Page 38 Vendredi, 22. fvrier 2008 5:53 17\nLe RID (Rapid graphical Interface Design) permet de crer des pages partir :\nLes pages gnres contiennent uniquement les champs lis aux rubriques de lanalyse.\nTout le code ncessaire au fonctionnement de ces pages reste la charge du dveloppeur. Vous pouvez directement saisir votre code personnalis.\nExemple de page gnre par le RID\nCette page ne contient aucun code.\nDessin.book Page 39 Vendredi, 22. fvrier 2008 5:53 17\nDeux sortes dactions peuvent tre programmes dans un site WebDev :\nlocal (sur le poste de\nlinternaute) : vrification simple dune saisie, ...\n2. Actions ncessitant\nun retour au poste serveur\ndans la base de donnes,\ncalculs / traitements par\nPour grer ces deux sortes dactions, lditeur de code de WebDev diffrencie deux types\nCode Serveur (code Jaune ou Rose sous lditeur de code) : Ce code est crit en WLangage (code jaune) ou en PHP (code rose, disponible uniquement dans les pages PHP).\nCe code est excut sur le serveur.\nCode Navigateur (code Vert ou Bleu) : Ce code est crit en WLangage (code vert) ou en\nintgr aux pages HTML WebDev. Ce code est excut en local (sur le poste de linternaute), et ne ncessite pas daction du serveur.\nDessin.book Page 40 Vendredi, 22. fvrier 2008 5:53 17\nLes codes excuts sur le poste serveur sont reprsents sous lditeur de code par un\nbandeau Jaune ou Rose.\n- bandeau Jaune = WLangage : le sigle WL prcde lintitul du code.\n- bandeau Rose = PHP : le sigle PHP prcde lintitul du code.\nPour passer dun code jaune (WLangage) un code rose (PHP), il suffit de cliquer sur le\nsigle WL prcdant lintitul du code (ou inversement en cliquant sur PHP). Lors de lenregistrement de la page PHP, le code WLangage est automatiquement converti en code\nNous vous conseillons de dvelopper en WLangage.\nDessin.book Page 41 Vendredi, 22. fvrier 2008 5:53 17\nLes codes excuts sur le poste de linternaute (sur le navigateur) sont reprsents sous\nlditeur de code par un bandeau bleu ou vert.\n- bandeau vert = WLangage : le sigle WL prcde lintitul du code.\nLa barre dicones situe au bas de la fentre de code permet de grer des vnements\nsupplmentaires ceux proposs par dfaut :\nCes vnements sont ajouts aux codes affichs par lditeur de code par simple clic sur\nlicone du code correspondant. Exemples dvnements supplmentaires : double-clic,\ntouche enfonce, touche presse, touche relche, bouton enfonc, souris dplace, ...\nRappel : Le code navigateur est disponible dans les pages dynamiques, semi-dynamiques, ou statiques.\nDessin.book Page 42 Vendredi, 22. fvrier 2008 5:53 17\nLe WLangage : un langage simple et trs\nou le PHP.\nDisponible en franais et en anglais, le WLangage est compos dordres simples, proches\ndu langage courant. Le franais permet une programmation intuitive (le WLangage est\ncompatible avec WinDev, AGL n1 en France).\nVoici un tout petit exemple illustrant la puissance du WLangage : la vrification de la saisie\ndune adresse :\nEn WLangage, quelques lignes suffisent ...\nSI SansEspace(ADRESSE) = "" ALORS\nErreur("Veuillez indiquer votre adresse")\nfunction EXE_SansEspace( szChaine , nPartie )\nvar nPremier = 0;\nvar nDernier = szChaine.length-1;\nif (nPartie & 1) while (szChaine.charAt(nPremier)==" ") nPremier++;\nif (nPartie & 2) while (szChaine.charAt(nDernier)==" ") nDernier--;\n// Clic (onclick) de BOUTON_OK\nalert("Veuillez indiquer votre adresse ");\nLe code WLangage est plus facile crire, comprendre, maintenir. La fiabilit est amliore. Les volutions sont plus simples.\nDessin.book Page 43 Vendredi, 22. fvrier 2008 5:53 17\nUn composant est un ensemble d'lments WebDev : pages, tats, analyse, ... Cet ensemble d'lments effectue une fonctionnalit prcise. Par exemple, un composant peut correspondre une des fonctionnalits suivantes :\n- Envoi de Fax,\n- Envoi d'e-mails,\nUn composant WebDev peut tre redistribu d'autres dveloppeurs WebDev (gratuitement ou non). Ces dveloppeurs pourront ainsi intgrer simplement la fonctionnalit propose par le composant dans leur site. Le composant sera donc intgr au site, et\ndistribu avec le site.\nGnration du composant\nImportation du composant dans\ndiffrents projets WebDev\nDessin.book Page 44 Vendredi, 22. fvrier 2008 5:53 17\nWinDev, WebDev et WinDev Mobile offrent la possibilit de crer des composants multiproduits. Ces composants peuvent contenir des fentres, des pages, ... et tre utiliss\naussi bien dans un projet WinDev, WebDev ou WinDev Mobile.\nProjet commun WinDev, WebDev et WinDev Mobile\nPages HTML intgrer dans le composant\nFentres intgrer dans le composant\n- Slection des lments\n- Choix des produits cibles (WinDev, WebDev, ...)\nUtilisables dans les projets des\nproduits cibles choisis\nDessin.book Page 45 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 46 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 47 Vendredi, 22. fvrier 2008 5:53 17\n2 looks de site : modles ou framesets\nsite bas sur des "modles de pages" : les pages utilisent le mme modle. Les pages\nsenchanent et saffichent entirement dans le navigateur. Le principe de dveloppement du site est simple : il suffit de crer le modle de pages et dutiliser ce modle\ndans les diffrentes pages.\nsite bas sur des "framesets" : un frameset permet de figer une partie du site (le menu\npar exemple). Les pages senchanent dans une frame du frameset.\nCes deux looks de site sont prsents dans les pages suivantes.\nAvantages des modles de pages\nLutilisation de modles de pages dans vos sites permet de :\noptimiser la vitesse daffichage des pages du site.\nlimiter le nombre de fichiers HTML gnrs (et donc le nombre de fichiers HTML charger sur le poste de linternaute).\nsimplifier la cration des pages du site.\nsimplifier la mise jour de la charte graphique du site.\nLors de la conception dun site, il est possible de choisir un des deux modes de prsentation suivants :\nDessin.book Page 48 Vendredi, 22. fvrier 2008 5:53 17\nModle de pages (template)\nWebDev permet de crer des modles de pages. Ces modles contiennent tous les lments graphiques communs lensemble des pages de votre site.\nLes modifications effectues dans un modle de pages sont automatiquement reportes\nsur toutes les pages utilisant ce modle.\nUn modle de pages permet de respecter la charte graphique dfinie pour un site.\nDfinition dun modle de pages.\nLe modle est encadr dun\ntrait jaune sous lditeur.\nUtilisation du modle dans plusieurs pages.\nLes lments appartenant au modle sont identifis par un carr jaune.\nPour crer un modle de pages partir de la page en cours, slectionnez loption\n"Fichier .. Enregistrer comme un modle".\nPour crer une page utilisant un modle, slectionnez le modle utiliser lors de la cration de la page.\nRemarque : La programmation associe aux lments du modle peut tre directement\nralise dans le modle.\nDessin.book Page 49 Vendredi, 22. fvrier 2008 5:53 17\nFrameset : une page HTML divise\nUn frameset est un type de page spcifique : cette page est divise en plusieurs zones.\nChaque zone est appele "Frame". Dans chaque frame, une page HTML est affiche.\nUn frameset permet de regrouper plusieurs pages dans une seule fentre du navigateur.\nUn exemple trs courant est lutilisation dune frame pour le menu du site, la seconde frame permettant dafficher les pages du site.\nUn frameset affich sous le navigateur\no une page\nDcomposition schmatique du frameset en 4 frames\nLes framesets permettent de changer facilement une partie des informations affiches.\nUne mme frame peut accueillir diffrentes pages selon les actions effectues par linternaute.\nDessin.book Page 50 Vendredi, 22. fvrier 2008 5:53 17\nJe cre une page sous lditeur ...\nPour crer une page avec WebDev, les tapes sont les suivantes :\nCration de la page sous lditeur de pages de WebDev.\nSaisie du code (tape optionnelle).\nDessin.book Page 51 Vendredi, 22. fvrier 2008 5:53 17\nLes fichiers suivants sont automatiquement crs :\n.WWH : Format source des pages\nCe fichier contient la description complte de la page\n(champ, code navigateur, code serveur). Ce fichier est\nutilis par lditeur et reste sur la machine du dveloppeur.\n.WDL : Bibliothque du projet\nGnre lors du dploiement du site dynamique,\nla bibliothque contient le code serveur des pages du projet. Ce fichier sera prsent sur le serveur.\n(champ, code navigateur, code serveur). Certains paramtres de cette page sont gnriques et seront remplis\ndynamiquement lors de laffichage de la page.\n.AWP : Page AWP\nGnr partir du fichier WWH, ce fichier contient\nla description des champs, le code serveur, le\ncode navigateur. Ce fichier sera prsent sur le\n.HTM : Page HTML du site\nGnr partir du fichier WWH, ce fichier contient la\ndescription des champs en HTML et le code navigateur\n.PHP : Page PHP\ncode navigateur au format PHP. Ce fichier sera\nprsent sur le serveur.\nDessin.book Page 52 Vendredi, 22. fvrier 2008 5:53 17\nChoisir un type de champ selon linformation afficher\nWebDev met votre disposition de nombreux champs :\nUtilisez un champ de\nLibell HTML, Libell\nDfinir une zone de couleur\nCellule, Tableau HTML\nAfficher un prix, une quantit, une adresse, une date, une\nChamp daffichage format\nSlectionner une valeur parmi une liste (Pays, Ville, )\nSlecteur, Combo, Liste\nSlectionner plusieurs valeurs parmi une liste (les destinataires dun message, des fichiers tlcharger, )\nAfficher une image graphique (Photo, )\nImage, Image clicable\nAfficher une animation (Gif anim)\nAfficher une page selon la zone clique sur une image\nAfficher le contenu dun fichier en table (Liste des clients,\ndtail dune commande, )\nTable fichier ou mmoire, Zone rpte fichier ou mmoire\nAfficher une image rafrachie rgulirement\nChamp Web Camra\nRpter des champs dans une page (Catalogue Produits\navec la photo, ...)\nUtiliser un code HTML existant\nUtiliser un applet Java (calendrier, horloge, ...)\nAfficher des informations hirarchises (contenu dun rpertoire, ...)\nAligner des champs (tableau HTML)\nProgrammer une action dans une page (afficher une page,\nvalider une saisie, )\nBouton, Champ Lien\nDessin.book Page 53 Vendredi, 22. fvrier 2008 5:53 17\nAfficher une page dun autre site dans une de vos pages\nAfficher un histogramme, une courbe, un graphe de type\nAfficher une page de votre site lintrieur dune de vos pages\nAfficher un menu automatique (qui se construit au fur et\nmesure du parcours du site)\nChamp Chemin de navigation\nAfficher des vignettes dimages\nDessin.book Page 54 Vendredi, 22. fvrier 2008 5:53 17\nQuel type dimage choisir : dynamique,\nstatique, gnre, ... ?\nLes images sont souvent utilises pour illustrer les pages des sites.\nDiffrents types dimages peuvent tre utiliss avec WebDev. Chaque type correspond\nune utilisation spcifique de limage.\nVoici un rcapitulatif des caractristiques de ces images, et comment les utiliser.\nConseil : utilisez toujours des images homothtiques pour les images provenant dune\nDessin.book Page 55 Vendredi, 22. fvrier 2008 5:53 17\nImage non modifie pendant lutilisation du site (logo de la\nImage modifie uniquement dans\nun code navigateur (image slectionne par un champ Upload).\nImage modifie pendant lutilisation du site (image du produit\ndans une fiche, photo dans un annuaire, ...)\nCest le type dimage le plus souvent utilis.\nImage dessine pendant lutilisation du site :\n- graphes (fonctions grXXX)\n- dessins (fonctions dXXX)\nIl est possible dutiliser une image\nDepuis une base de\nImages de produits affiches\ndans une zone rpte\nLimage associe une image statique doit tre slectionne\nsous lditeur WebDev.\nCette image pourra tre change en programmation uniquement dans un code navigateur.\nLes formats dimage reconnus par WebDev sont autoriss.\nLors de lenregistrement de la page, limage est automatiquement convertie au format GIF ou JPEG, et enregistre dans le\nrpertoire <NomProjet>_WEB (sauf si limage est dj au format GIF ou JPEG).\nLors du dploiement du site WebDev :\n- le fichier associ limage doit tre prsent sur le serveur.\n- si limage est change dans un code navigateur, la nouvelle image doit tre accessible et dans un format reconnu\nUne image dynamique peut tre change par programmation\ndans un code serveur ou dans un code navigateur.\nLimage associe au champ par programmation doit tre :\n- prsente dans le rpertoire <NomProjet>_WEB.\n- dans un format reconnu par le navigateur (GIF, JPEG ou\nAttention : lutilisation de mmos binaires nest pas possible.\nUne image gnre est construite au cours de lutilisation du\nsite dynamique WebDev.\nIl est dconseill dutiliser ce type dimage pour afficher des fichiers de type "image" existants : les performances de votre\nsite risquent dtre rduites.\nQuand le navigateur demande laffichage de limage (lors de\nlaffichage ou de la ractualisation de la page par exemple),\nune image temporaire du dessin en cours est ralise sur le\nserveur et enregistre au format JPG. Cette image est affiche\nCes images sont enregistres dans des mmos binaires (mmo) ou dans des champs texte (chemin).\nIl est conseill dutiliser une image Homothtique centre :\ntoutes les images affiches seront redimensionnes proportionnellement afin dtre affiches dans le champ image.\nType de limage\nDessin.book Page 56 Vendredi, 22. fvrier 2008 5:53 17\nCrer des effets sur les boutons : boutons\nQuand on cre un bouton par dfaut, il est gris. Pour personnaliser ce look, il suffit dutiliser des images. Ces images permettent de dfinir la forme et la couleur du bouton (description du bouton, onglet "Dtail").\nSi une seule image est lie au bouton, cette image sera utilise quelle que soit laction\neffectue par linternaute.\nPour crer des effets spcifiques, par exemple changer les couleurs lors du survol du bouton, il suffit dassocier plusieurs images au bouton.\nPour crer uniquement un effet de survol, associez deux images au bouton : une image\ncorrespondant ltat "normal" du bouton et une image correspondant ltat "survol".\nCes images sont spcifies dans longlet "Dtail" de la fentre de description du bouton :\n- Le bouton "Catalogue" permet de choisir directement les deux types d'images parmi\nune bibliothque d'images livre avec WebDev.\n- Loption "Image du cadre / fond avec 3 images" permet de grer simplement la largeur\nde limage associe au bouton. Si cette option est slectionne, WebDev dcoupe\nautomatiquement limage du bouton en 3 images afin dtre la mme taille que le\nDessin.book Page 57 Vendredi, 22. fvrier 2008 5:53 17\nPour crer un effet denfoncement du bouton, associez une image spcifique au bouton :\ncette image contient trois dessins. Chacun des dessins correspond un tat spcifique\ndu bouton : normal, enfonc, survol. Dans ce cas, la gestion de ltat du bouton est ralise par une applet Java spcifique livre avec WebDev (vous ne vous occupez de rien,\nWebDev fait tout !).\nImage contenant les diffrents tats du bouton : Normal, Enfonc et survol\nPour uniformiser le style de vos boutons, dfinissez un style spcifique, et utilisez ce style\npour tous vos boutons.\nDans ce cas, il suffit de spcifier le fichier image utiliser dans longlet "Dtail" de la fentre de description du bouton (option "Image").\nRemarque : Le bouton "Catalogue" permet de choisir directement une image 3 tats parmi une bibliothque d'images livre avec WebDev\nDessin.book Page 58 Vendredi, 22. fvrier 2008 5:53 17\nLes modles de champs\nWebDev permet de crer des modles de champs. Un modle de champs est un ensemble de champs, rutilisables dans plusieurs pages.\nLes modifications effectues dans un modle de champs sont automatiquement reportes sur toutes les pages utilisant ce modle.\nUn modle de champs permet de\n- regrouper un ensemble de champs dans un but prcis.\n- rendre les champs indpendants de la page les accueillant.\nDfinition dun modle de champs : le modle\nest encadr dun trait jaune sous lditeur.\nUtilisation du modle dans\nLes lments appartenant\nau modle sont entours\nen bleu et identifis par un\nUn modle de champs peut tre cr :\n- directement (option "Fichier .. Nouveau .. Modle de champs")\n- partir de champs prsents dans la page (option "Champ .. Refactoring .. Crer un modle de champs avec la slection").\nPour crer une page utilisant un modle de champs, crez un champ de type "Modle de\nLes caractristiques des lments peuvent tre dsolidarises du modle. Par exemple,\ndsolidariser la position dun champ du modle pour positionner le champ ailleurs tout en\nconservant les autres volutions sur le champ (code, style, ...). On parle alors dhritage\nde champ. Dans ce cas, les lments sont identifis par un carr bleu.\nDessin.book Page 59 Vendredi, 22. fvrier 2008 5:53 17\nRpter un groupe de champs\nCration de la zone rpte sous\nlditeur de WebDev\nAffichage de la zone rpte\nPour chaque champ de la zone rpte, plusieurs caractristiques peuvent tre modifies\nlors de la rptition : libell, couleur du texte, ...\nLes rptitions peuvent tre ralises :\n- sur une colonne,\n- sur plusieurs colonnes. Dans ce cas, on parle de "Zone rpte horizontale".\nLors de la cration dune zone rpte, il est possible de lier la zone rpte directement\nun fichier de donnes ou une requte. Les attributs de la zone rpte sont automatiquement dfinis. Aucune programmation nest ncessaire.\nLes zones rptes permettent de rpter un ensemble de champs "n" fois. Lors de cette\nrptition, les champs de la zone rpte peuvent afficher des informations diffrentes.\nIl est ainsi possible dafficher chaque rptition des enregistrements dune base de donnes.\nDessin.book Page 60 Vendredi, 22. fvrier 2008 5:53 17\nAfficher un fichier dans une Table\nUne table fichier ou une zone rpte fichier permet dafficher des donnes provenant\ndun fichier de donnes. La structure du fichier a t dcrite sous lditeur danalyses, et\nles donnes ont t saisies par exemple dans le site.\nUn parcours du fichier permet dafficher les donnes dans la table ou dans la zone rpte. Pour chaque ligne affiche, le fichier est lu : lenregistrement lu est affich dans une\nligne de la table ou une rptition de la zone rpte.\nSous WebDev, une table fichier ou une zone rpte fichier est cre laide dun assistant. Vous choisissez les rubriques affiches, la cl de parcours du fichier, ... et le champ\nest cr, avec tout le code ncessaire. Une rglette apparat automatiquement, et permet\ndafficher les enregistrements suivants ou prcdents du fichier.\nIl est possible de limiter les enregistrements affichs dans le champ en utilisant un filtre\n(fonction HFiltre utilise dans le code dinitialisation du champ).\nPlusieurs fonctions du WLangage permettent de manipuler :\n- les tables fichier. Ces fonctions commencent toutes par "Table".\n- les zones rptes fichier. Ces fonctions commencent toutes par "ZoneRpte".\nPour ajouter un enregistrement, ajoutez lenregistrement dans le fichier Hyper File correspondant (fonction HAjoute), puis r-affichez :\n- la table avec la fonction TableAffiche.\n- la zone rpte avec la fonction ZoneRpteAffiche.\nPour supprimer un enregistrement, supprimez lenregistrement dans le fichier Hyper File\ncorrespondant (fonction HSupprime), puis r-affichez :\nDessin.book Page 61 Vendredi, 22. fvrier 2008 5:53 17\nWebDev offre plusieurs mthodes pour optimiser le positionnement des champs dans les\nles rgles et la grille\nPour activer la visualisation des tables de positionnement, utilisez loption "Affichage .. Visualisation du tableau de positionnement".\nLes rgles dalignement comme la grille magntique permettent daligner simplement les\nchamps dune page.\nLes rgles sont affichables grce loption "Affichage .. Rgles".\nLa grille est activable grce loption "Affichage .. Grille".\nLes tables de positionnement sont le moyen le plus courant pour aligner des champs dans\nune page HTML. Elles permettent galement de crer des bas de page.\nDessin.book Page 62 Vendredi, 22. fvrier 2008 5:53 17\nPour obtenir des effets de transparence ou de profondeur, superposez vos champs.\nChaque champ possde une option "Le champ peut tre superpos" (onglet "Dtail" de la\nfentre de description du champ).\nEn cochant cette option, le champ nest plus li aux tables de positionnement de la page.\nVous pouvez dplacer et positionner un champ "au-dessus" de chacun des champs de votre page.\nAttention : on dfinit le champ qui va se superposer, et non pas celui qui est recouvert et\naccepte le recouvrement.\nPar exemple, pour superposer un libell sur une image, il faut rendre le libell superposable et positionner le libell sur limage.\nAttention : Pour que la superposition soit ralise, linternaute doit possder un navigateur rcent (Internet Explorer version 4 ou suprieur, Netscape 4.7 ou suprieure).\nCe type de navigateur est aujourdhui trs rpandu.\nDessin.book Page 63 Vendredi, 22. fvrier 2008 5:53 17\nDes feuilles de styles CSS : pour simplifier\nLes feuilles de styles sont des modles qui permettent duniformiser la prsentation des\nchamps dans les pages.\nQuand vous modifiez une caractristique du style, tous les champs associs ce style\nsont mis jour. Il est ainsi possible de modifier la charte graphique dun site en effectuant uniquement quelques modifications dans les styles utiliss.\nUn exemple dutilisation des feuilles de styles : augmenter la taille de 8 15 :\nAttention : Pour utiliser les feuilles de styles (CSS), linternaute doit possder un navigateur supportant les feuilles de styles (Internet Explorer version 4 ou suprieur, Netscape\n4.7 ou suprieure).\nRemarque : Longlet "CSS personnalis" permet de saisir directement du code CSS. Ce\ncode sera ensuite ajout dans la feuille de styles CSS.\nLes feuilles de styles permettent de dfinir :\n- la taille et la forme de vos textes, la police,\n- lalignement de vos paragraphes, les retraits de paragraphe, ...\n- le style de texte (gras ou italique), sa couleur, ...\nDessin.book Page 64 Vendredi, 22. fvrier 2008 5:53 17\nSite centr ou adapt ?\nLa mise en page est un lment fondamental dans la ralisation dun site. Pour optimiser\ncette mise en page, il est ncessaire de prendre en compte la rsolution de lcran de linternaute.\nPar exemple, si votre site est cr pour la rsolution 1024 x 768 pixels, les internautes\nutilisant une rsolution de 800 x 600 verront apparatre de nombreux ascenseurs.\nDune manire gnrale, la date dimpression de ce manuel, il est conseill de dvelopper des sites optimiss pour une rsolution 800 x 600.\nDeux types de mise en page dun site peuvent tre utiliss :\n- site centr :\nLes pages sont centres dans le navigateur. Si la rsolution de linternaute est suprieure la rsolution optimale du site, des marges blanches apparaissent de part et\ndautre de la page.\nRsolution : 800 x 600\nRsolution : 1024 x 768 :\nles marges apparaissent de chaque ct de la page\nsite adapt :\nLes pages sont affiches normalement dans le navigateur. Si la rsolution de linternaute est suprieure la rsolution optimale du site, une marge blanche est ajoute\ndroite des pages.\nla page reste "colle" gauche\nRemarque : Le type de mise en page (centr ou adapt) configur dans un modle de\npage sera automatiquement utilis par les pages associes ce modle.\nDessin.book Page 65 Vendredi, 22. fvrier 2008 5:53 17\n10 conseils dergonomie ...\nSoignez lentre dans votre site.\nUn site est lanc partir dune page daccueil. Cette page permet "dentrer" dans le site.\nSoignez la prsentation de la page daccueil et simplifiez le lancement du site : le logo ou\nle lien permettant de lancer le site doit tre visible et facilement identifiable.\nLorsque linternaute arrive sur un site, il doit facilement identifier la personne ou la socit\nresponsable du site par un choix de la page daccueil : il suffit dindiquer un nom, une\nadresse postal et une adresse internet, ...\nDautres informations sont utiles :\n- la date de ralisation du site ou de dernire mise jour,\n- le thme du site, son contenu et sa finalit,\n- ladministrateur physique de la socit, numro RCS de la socit, ...\nDessin.book Page 66 Vendredi, 22. fvrier 2008 5:53 17\nVos pages sont trs longues ? Permettez linternaute de retourner directement\nLorsque vos pages sont trs longues (plus de 2 crans), utilisez des boutons ou des liens\npour retourner rapidement en haut de la page (et viter lutilisation de lascenseur).\nFin de la page avec un lien\nHarmonisez le style et lalignement de vos boutons.\nVrifiez que vos boutons utilisent tous le mme "look", et vrifiez lalignement de vos boutons.\nBoutons non aligns,\nutilisant diffrents styles\nPour viter laffichage dascenseurs inutiles dans les pages dun frameset, slectionnez\nloption "Ascenseur automatique" dans la fentre de description de la page (onglet "Frame"). Cette option permet dafficher lascenseur uniquement sil est ncessaire.\nDessin.book Page 67 Vendredi, 22. fvrier 2008 5:53 17\nVous affichez des listes de plus de 20 lments ? Utilisez plusieurs pages pour lister les lments (champ rglette).\nUtilisez des images 100% ou Homothtiques centres.\nPour conserver les proportions de vos images, il est conseill de choisir :\n- soit des images 100% (pour les images statiques ou dynamiques ou si limage est\nde taille identique celle du champ).\n- soit des images homothtiques centres (pour les images gnres ou les images de\ntaille varie provenant dune base de donnes) : la taille de limage sadaptera homothtiquement la zone dfinie pour limage. Les proportions seront respectes.\nImage 100 % si la\ncorrespond celle de\nlimage, sinon image\ndaffichage sous lditeur\n(description de limage,\nDessin.book Page 68 Vendredi, 22. fvrier 2008 5:53 17\nImage sous lditeur\nImage sous le navigateur.\nProblme daffichage des\nEn cas de problme daffichage, vrifiez principalement que :\n- limage existe,\n- limage est enregistre dans un format reconnu par le navigateur (GIF ou JPG par\n- limage est prsente dans le sous-rpertoire du projet <NomProjet>_WEB.\nLinternaute doit saisir une quantit ? Utilisez une combo pour simplifier la saisie\n10 Vous proposez un catalogue de produits avec possibilit de commander ?\nIndiquez toutes les informations sur le produit (nom, rfrence, prix, ...) chaque fois, y\ncompris le bouton ou le lien permettant de commander le produit.\nDessin.book Page 69 Vendredi, 22. fvrier 2008 5:53 17\nUne page en franais ...\n... la mme page en anglais\nPour crer un site multi-langue, il suffit de slectionner les diffrentes langues gres par\nle projet (option "Projet .. Description du projet", onglet "Langues").\nVous pourrez ensuite configurer tous les lments du projet dans ces diffrentes langues.\nPar exemple, WebDev vous permet de configurer :\n- les diffrents lments (libell, titre de page, ...).\n- les caractristiques daffichage (masque de saisie, ...).\n- les fichiers image des lments (bouton, champ image, ...).\nTous les lments (pages, tats, images, ...) ncessaires sont regroups dans un seul rpertoire par langue.\nWebDev permet de crer trs rapidement des sites multi-langues partir dun mme projet.\nDessin.book Page 70 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 71 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 72 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 73 Vendredi, 22. fvrier 2008 5:53 17\nAfficher et enchaner les pages\nUn site est un ensemble de pages. Ces pages sont relies entre elles grce aux boutons\n(ou aux liens). Un clic sur un bouton entrane laffichage dune nouvelle page.\nPour afficher une nouvelle page, il faut se poser deux questions :\n1. o afficher la page (nouveau navigateur, frame, ....) ?\n2. quelle page afficher ?\nO afficher la page ?\nSlection de la destination sous lditeur de pages (cas le plus courant)\nDans un bouton, pour dfinir la destination de la page afficher :\nAffichez la description du\nbouton ou du lien (clic\ndroit sur le champ, option\nDans la liste des destinations, slectionnez une\ndestination prdfinie ou\nune frame (dans le cas dun frameset).\nRemarque : Les destinations prdfinies sont prsentes dans les pages suivantes de ce\nSlection de la destination sous lditeur de code\nLorsque la destination dpend dun choix de linternaute, cette destination doit tre slectionne par programmation. Par exemple, si linternaute nindique pas son mot de passe,\nune page derreur apparat dans un nouveau navigateur; sinon, la page suivante saffiche\ndans le navigateur en cours.\nLa fonction WLangage ChangeDestination permet de modifier par programmation la destination dune action. Cette fonction doit tre utilise dans un code navigateur.\nLaffichage dune page se fait dans une "destination" spcifique : page en cours, nouveau\nLa destination peut tre dfinie :\n- soit sous lditeur de pages : aucune programmation nest ncessaire.\n- soit sous lditeur de code, dans un traitement du bouton (ou du lien).\nDessin.book Page 74 Vendredi, 22. fvrier 2008 5:53 17\nLors du choix de la destination pour un bouton, un lien, une image clicable, une option de\nmenu, ... il est possible de choisir :\n- une destination prdfinie : quatre destinations prdfinies sont proposes :\n- Navigateur en cours (_top pour les habitus)\n- Frame en cours (_self)\n- Frame parent (_parent)\n- Nouveau navigateur (_blank). Dans ce cas, vous pouvez choisir les caractristiques du nouveau navigateur (prsence de la barre de menu, de la barre de message, ...).\n- une frame du frameset en cours.\nRemarque : dans ce schma, la zone grise reprsente la zone dans laquelle la page est affiche lors du clic sur\nNouvelle page affiche dans\nla totalit du navigateur\nNouvelle page affiche\ndans la mme frame\nDessin.book Page 75 Vendredi, 22. fvrier 2008 5:53 17\n(imbrication de 2 framesets)\nla page contenant le\nfentre du navigateur\nFentre de dfinition des\ncaractristiques du nouveau navigateur\nDessin.book Page 76 Vendredi, 22. fvrier 2008 5:53 17\nLa page afficher peut tre dfinie :\n- soit sous lditeur de pages (aucune programmation nest ncessaire).\n- soit sous lditeur de code dans un traitement du bouton (du lien, de limage\nSlection de la page afficher sous lditeur de pages (cas le plus courant)\nPour dfinir la page afficher :\nAffichez la fentre de description\ndu champ (clic droit sur le champ,\nDans la liste des actions, slectionnez la page afficher.\nSlection de la page afficher par programmation\nIl est ncessaire de slectionner la page afficher par programmation lorsque :\nplusieurs pages peuvent tre affiches (par exemple soit une page derreur si le mot\nde passe nest pas saisi, soit la page suivante du site).\nune action particulire doit tre effectue sur le serveur (calcul, lecture denregistrement, ...).\nPlusieurs fonctions du WLangage permettent douvrir une nouvelle page (ou frameset).\nLes principales fonctions sont : PageAffiche (pour les pages) et FramesetAffiche (pour les\nDessin.book Page 77 Vendredi, 22. fvrier 2008 5:53 17\nAffichage dune page dynamique : cration du contexte associ\nNous savons que WebDev permet de crer des pages dynamiques. Le contenu dynamique\ndes pages est dfini la vole lexcution de la page (cest--dire lorsque la page est\naffiche sur le navigateur de linternaute).\nPour chaque page dynamique affiche sur le navigateur, un "contexte de page" est cr\nsur le serveur. Ce contexte contient toutes les informations relatives la page (valeur des\nvariables en cours, contenu des champs, ....).\nChaque page dynamique (affiche sur le poste de chaque internaute) est associe un\ncontexte de page.\nSi la page permet dafficher des donnes diffrentes (fiche produit avec boutons de parcours par exemple), chaque nouvel enregistrement affich, le contexte est modifi, et la\npage est uniquement actualise.\nDessin.book Page 78 Vendredi, 22. fvrier 2008 5:53 17\nAfficher ou Actualiser une page dynamique ? PageAffiche ou\nLe WLangage propose deux fonctions pour afficher une page dynamique : PageAffiche et\nPageActualise. Ces fonctions permettent dafficher ou dactualiser une page dynamique.\nCes deux concepts sont totalement diffrents.\nAffichage dune page = nouvelle page\nLaffichage dune page dynamique correspond louverture dune "nouvelle page" sur le\nnavigateur. Par exemple, ouverture de la page "Visu_Produit" permettant de visualiser larticle slectionn dans une table.\nAttention : Si vous "affichez" une page prcdemment ouverte, la page et son contexte\nsont ferms puis rouverts. Toutes les donnes de la page sont r-initialises.\nActualisation dune page = r-affichage de la page (plus rapide)\nLactualisation dune page dynamique consiste r-afficher une page dj ouverte sous\nle navigateur. Laction effectue est identique lutilisation de la touche "Rafrachir" du\nLes donnes dynamiques prsentes dans la page sont mises jour en fonction des contextes prsents sur le serveur. Seules les donnes modifies sont raffiches.\nExemple : Dans un site commercial, la page prsentant la liste des produits slectionns\nest actualise lorsquun nouveau produit est command.\nConseil de performances :\nPour actualiser les donnes affiches dans une page dynamique, utilisez la fonction "PageActualise". Avec la fonction "PageAffiche", le temps de chargement de la page est\nDessin.book Page 79 Vendredi, 22. fvrier 2008 5:53 17\nEmpcher le retour sur une page\nPour empcher le retour sur une page par le bouton "Prcdent" du navigateur :\n1. Affichez la page sous lditeur de pages de WebDev.\n2. Slectionnez loption "Affichage .. Description de la slection". La fentre de description de la page saffiche.\n3. Affichez longlet "Dtail".\n4. Cochez loption "Empcher le retour sur cette page par le bouton "Prcdent" du navigateur".\nLe bouton "Prcdent" du navigateur permet linternaute de revenir sur une page dj\nconsulte. Cependant, le retour sur une page nest pas toujours souhaitable.\nPar exemple, dans un site commercial, si linternaute revient sur la page de validation de\ncommande, il pourrait valider sa commande 2 fois, et donc passer 2 commandes.\nDessin.book Page 80 Vendredi, 22. fvrier 2008 5:53 17\nSelon lopration effectuer sur les champs de\nla page, plusieurs types de bouton / lien sont\nLe choix du type de bouton / lien se fait dans la\ndescription du champ (onglet "Gnral").\nVoici quelques exemples dutilisation "classique" de boutons / liens dans une page :\n- Envoi des donnes de la page en cours au serveur pour traitement\nExemple : Formulaire denregistrement : le lien permet de\nvrifier la validit des informations saisies et dafficher une\npage de confirmation.\nPour effectuer ce type de traitement, utilisez un lien de type\n"Envoyer la valeur des champs au serveur". Les donnes de\nla page sont envoyes au serveur pour tre traites.\n- Effectuer un traitement sur le serveur, sans rcuprer les\ndonnes de la page en cours\nExemple : Page de menu constitue de boutons : chaque\nbouton permet de lancer une page du site.\nPour effectuer ce type de traitement, utilisez un bouton de\n- Effectuer un traitement en code navigateur\nExemple : Excuter un calcul simple en\nlocal, un contrle de saisie, ...\nPour effectuer ce type de traitement,\nutilisez un bouton de type "Aucune".\n- Affichage dune page extrieure au site WebDev\nExemple : Lancer un site de moteur de recherche laide dun bouton.\nPour effectuer ce type de traitement, utilisez un bouton de type "Aucune".\n- Rinitialiser les champs de la page\nExemple : Lien permettant de vider les champs de la page en cours.\nPour effectuer ce type de traitement, utilisez un lien de type "R-initialiser les champs\nde la page".\nDessin.book Page 81 Vendredi, 22. fvrier 2008 5:53 17\nOrdre dexcution des codes des boutons /\nDeux codes de clic sont associs aux boutons / liens :\nun code de clic serveur saisi en WLangage (uniquement dans les pages dynamiques).\nCe code sera excut sur le serveur.\nCode de clic\nLe tableau ci-aprs prsente les diffrents codes excuts selon le type de bouton / lien\nchoisi, et laction associe.\nLaspect du bouton / lien et sa destination ninfluent pas sur lordre des codes excuts.\nDessin.book Page 82 Vendredi, 22. fvrier 2008 5:53 17\nOrdre des codes excuts\nAction associe :\nExcuter le code de clic du bouton / lien\nCodes excuts :\n1. Code de clic navigateur du champ.\n2. Code navigateur du submit de la page (sil existe).\n3. Envoi des valeurs prsentes dans les champs de\nla page pour mettre jour le contexte de la page\n4. Code serveur du champ.\nAction associe : Afficher la page\n5. Affichage de la page.\nAction associe : Aucune\nMise jour automatique du contexte de\npage sur le serveur\nAffichage automatique de la page.\n2. Affichage de la page initiale (page avec tous les\nchamps initialiss vide ou 0 et excution du\ncode dinitialisation de chacun des champs).\nCode navigateur uniquement.\nAction associe : Excuter le code de clic du bouton /\n2. Code serveur du champ.\n3. Affichage de la page.\nAffichage automatique de la page\nDessin.book Page 83 Vendredi, 22. fvrier 2008 5:53 17\nTlcharger un fichier (image, ...) vers le\nLupload est lopration qui consiste tlcharger sur le poste serveur un fichier provenant du poste de linternaute.\nLors de la validation de la page,\nle fichier "upload" est copi\nsur le disque dur du serveur.\nSur le navigateur de linternaute\nNote : Laspect du bouton "Parcourir" est dfini par le navigateur.\nUn exemple simple : La cration dun contact dans un annuaire.\nLinternaute veut associer une photographie la fiche du contact. Cette photo est prsente sur le disque dur de son poste.\nLe champ de type UPLOAD permet linternaute de slectionner limage grce un bouton "Parcourir".\nLors de la validation de la fiche, le fichier image slectionn est envoy au serveur et copi\nsur le disque dur du serveur (fonction UploadCopieFichier).\nLors de la consultation du contact, limage apparatra dans la fiche.\nDessin.book Page 84 Vendredi, 22. fvrier 2008 5:53 17\nWebDev et les tats\nGrce lditeur dtats, ralisez des impressions de qualit.\nUn tat est cr selon le principe suivant :\n- les donnes imprimer sont issues dune source de donnes (fichier dcrit dans une\nanalyse, vue Hyper File, requte, zone mmoire ou fichier texte).\n- ltat regroupe, trie et met en forme les donnes.\nSources de ltat\nLtat cr peut ensuite tre :\n- imprim sur limprimante du serveur (cas dun site Intranet).\n- affich dans le navigateur de linternaute (format HTML, PDF, ...).\n- envoy par mail linternaute (format PDF).\nDessin.book Page 85 Vendredi, 22. fvrier 2008 5:53 17\nDiffrents modes dimpression\nEtat sous lditeur dtats de WebDev\nPour imprimer des documents gnrs par votre site (factures, devis, ...), crez des tats\ngrce lditeur dtats.\nPour imprimer ces tats quelle que soit la configuration du poste de linternaute, il est conseill de proposer au moins deux modes dimpression :\n- Impression au format HTML : Ltat saffiche dans une nouvelle page du site. Linternaute na qu utiliser le bouton "Imprimer" du navigateur pour imprimer ltat. Aucun\nlogiciel spcifique nest ncessaire.\n- Impression au format PDF : Ce mode dimpression ncessite la prsence dAcrobat\nReader sur le poste de linternaute. Limpression se fait directement partir de ce logiciel.\nDessin.book Page 86 Vendredi, 22. fvrier 2008 5:53 17\nRaliser un traitement sur plusieurs pages\nDans un site commercial, une prise de commande peut par exemple tre ralise sur diffrentes pages :\n- page 1 : Slection des produits commander.\n- page 2 : Visualisation du panier.\n- page 3 : Validation de la commande et saisie des coordonnes du client.\nPage 1 : Slection des produits\nPage 3 : Saisie des coordonnes du client\nDans ce cas, lcriture des donnes dans les fichiers ne doit seffectuer que dans le code\ndu bouton de validation de la commande : tous les lments de la commande doivent\ntre mmoriss jusqu la validation finale. Ncrivez pas dans les fichiers en cours de traitement.\nRemarque : Il est galement possible dutiliser une transaction, mais nous vous recommandons de mmoriser les informations de la commande.\nDessin.book Page 87 Vendredi, 22. fvrier 2008 5:53 17\nLes emails permettent :\n- aux internautes de communiquer entre eux : envoi demails au responsable du site,\nsite de mailing-list, ...\n- de valider une prise de commande : dans un site commercial, un email est envoy aux\ninternautes pour valider leur commande.\n- de transfrer des donnes dun poste un autre : les nouvelles commandes saisies\nsur un site commercial sont transfres par email au sige de la socit pour traitement, ...\nWebDev permet denvoyer des emails depuis un site par 2 mthodes.\nEnvoi de lemail depuis le poste de linternaute\nUtilisez cette mthode lorsque linternaute doit envoyer un email une adresse dfinie :\nauteur du site, support technique, service commercial, ...\nLa fonction navigateur EmailOuvreMessagerie permet douvrir le logiciel de messagerie\nde linternaute. Certains paramtres peuvent tre remplis par dfaut : adresse email du\nCette mthode permet dutiliser directement la messagerie de linternaute : aucun traitement spcifique nest effectuer dans le site WebDev.\nDessin.book Page 88 Vendredi, 22. fvrier 2008 5:53 17\nEnvoi de lemail depuis le serveur (pages dynamiques uniquement)\nDans ce cas, cest le serveur qui gre lenvoi des emails.\nLenvoi des emails peut tre ralis :\n- directement dans le site dynamique WebDev (par exemple pour un transfert de donnes par email, ou pour un email de validation de commande);\n- par le spooler demail (livr avec WebDev).\nEnvoi direct des\nUtilisez cette mthode pour une gestion personnalise des emails :\n- un contrle sur le contenu des emails envoys par les internautes (cas dun site de\ntype "liste de diffusion"),\n- la vrification de la validit de ladresse du destinataire,\n- le cryptage des informations envoyes par emails,\n- la validation dun traitement, ...\nDessin.book Page 89 Vendredi, 22. fvrier 2008 5:53 17\nConserver des informations sur le poste de\nlinternaute grce aux cookies\nUn cookie est un fichier enregistr par le site WebDev sur le poste de linternaute. Ce fichier peut tre relu tout moment depuis le serveur ou par le navigateur. Les cookies permettent de stocker des informations persistantes sur le poste de linternaute.\nPar exemple, lors de la premire connexion de linternaute, des informations lui sont demandes : son nom dutilisateur, son login, ... et sont stockes sur sa machine. Lors des\nconnexions suivantes, le site WebDev ira directement lire ces informations dans le cookie\ncr lors de la premire connexion et pourra saluer linternaute par son prnom ds la premire page.\ndonnes par linternaute\nLe nouvel internaute doit ici saisir\nson nom et son mot de passe\nlit des donnes\nenregistres sur le poste\nLe site WebDev affiche par dfaut\nles informations lues dans le cookie\nPour crer des cookies dans un site WebDev, utilisez la fonction du WLangage CookieEcrit.\nPour lire les cookies dans un site WebDev, utilisez la fonction du WLangage CookieLit.\nDessin.book Page 90 Vendredi, 22. fvrier 2008 5:53 17\nProtger laccs au site : mots de passe\nUne gestion daccs un site par mot de passe est ncessaire dans deux cas :\n1. Protger des informations personnelles\n2. Limiter laccs un site\nProtger des informations personnelles\nPour accder de nouveau des donnes personnelles, linternaute peut spcifier un mot\nde passe. Ainsi, dans un site commercial, un mot de passe dfini par linternaute lui permet daccder au dtail de ses prcdentes commandes.\nDans ce cas, la gestion de laccs un site ncessite :\nA la premire connexion, linternaute sidentifie et saisit son mot de passe.\nAux connexions suivantes, linternaute sidentifie et accde aux fonctionnalits qui lui\nsont rserves (et son historique, ...).\nla possibilit pour linternaute de retrouver un mot de passe oubli.\nWebDev est livr avec toutes les ressources ncessaires la gestion de mots de passe\nLimiter laccs un site\nPar dfaut, un site internet est accessible nimporte quel internaute. Mais un site nest\npas toujours destin au grand public : certaines fonctionnalits peuvent tre rserves\ncertains types dinternautes (administrateur de site, ...).\nDans ce cas, le gestionnaire du site attribue un mot de passe chaque internaute. Ce mot\nde passe ne pourra pas tre modifi. Ce mot de passe permet un accs des fonctionnalits plus ou moins limites.\n- un mot de passe spcifique sera attribu aux commerciaux : ils accderont aux statistiques de ventes, ...\n- un mot de passe spcifique sera attribu lquipe marketing : ils pourront mettre en\nligne de nouveaux produits.\nWebDev permet de grer simplement ces diffrents types daccs un site.\nDessin.book Page 91 Vendredi, 22. fvrier 2008 5:53 17\nCrypter les informations qui transitent sur\nle Web avec SSL\nPar dfaut, les donnes circulant entre le poste de linternaute et le serveur Web ne sont\npas protges. La confidentialit des donnes changes n'est pas certifie.\nPour assurer la confidentialit, plusieurs systmes existent. Un systme courant est l'utilisation du protocole SSL (Secure Socket Layer).\nMise en place des transactions scurises par protocole SSL\nPour mettre en place des transactions scurises par SSL, il est ncessaire deffectuer les\nformalits lies ce protocole (certification payante dune cl SSL par un organisme spcialis). Pour plus de dtails, consultez laide en ligne de WebDev.\nSeul le transfert de donnes sensibles doit tre scuris : transfert du numro de carte\nbancaire par exemple. En effet, le mode scuris est plus lent.\nLa mise en place dune transaction scurise est effectue lors de louverture dune nouvelle page par un bouton (ou un lien). Il suffit dutiliser la fonction SSLActive dans le code\nnavigateur du bouton (ou du lien). Ds l'ouverture de la page scurise, toutes les actions\neffectues seront en mode scuris (cest--dire crypt).\nOprations en mode scuris\nPour revenir en mode non scuris, il suffit dutiliser la fonction SSLActive(Faux) dans le\ncode navigateur d'un bouton (ou dun lien) permettant d'ouvrir une nouvelle page.\nTransactions scurises par SSL dans un site WebDev\nDessin.book Page 92 Vendredi, 22. fvrier 2008 5:53 17\nAvantage scuritaire pour votre site\ndynamique : la gestion du "Back"\nUn navigateur permet de parcourir les diffrentes pages dun site laide des boutons\n) et "Prcdent" (\n) de son menu.\nA chaque nouvelle page dynamique affiche sur le navigateur, un contexte de page spcifique son traitement est cr sur le serveur.\nLorsquune mme page dynamique est utilise pour afficher des donnes diffrentes (page avec table fichier, zones rptes ou page de type "Fiche avec parcours", ...), le contexte de page prsent sur le serveur varie en fonction des donnes affiches.\nLorsque linternaute appuie sur le bouton "Prcdent" (ou "Back"), le navigateur ne prvient ni le site ni le serveur. Le navigateur revient la page prcdente sans le contexte\nAucune gestion particulire nest ncessaire lorsque on fait un "Back" entre des pages diffrentes.\nUne gestion spcifique est ncessaire pour une mme page dynamique affichant des donnes diffrentes.\nPourquoi grer le "Back" ? Un exemple simple ...\nPour comprendre la ncessit de la gestion du "Back", tudions un exemple simple : une\npage dynamique qui permet dafficher la liste des lecteurs DVD-ROM disponibles.\nEtape 1 : Affichage de la liste des DVD-ROM\nLe contexte contient la liste des lments affichs dans cette table : lecteurs de DVD ROM\nde la marque CREATIVE.\nDessin.book Page 93 Vendredi, 22. fvrier 2008 5:53 17\nLes priphriques de la marque "NEC" sont affichs. Le contexte de la page sur le serveur\nest mis jour : le contexte contient la liste des lments affichs dans cette table (lecteurs\nde DVD ROM de la marque NEC).\nLa page dynamique affiche sur le navigateur correspond la page affiche ltape 1.\nCependant, le serveur nest pas inform par le navigateur que linternaute a utilis la touche Back.\nLe contexte de page sur le serveur est toujours celui correspondant aux enregistrements\nSi linternaute slectionne dans la table un lment (DVD ROM de la marque "CREATIVE"),\nllment slectionn sera llment correspondant dans le contexte : un lment NEC. Il\ny a dsynchronisation entre la page dynamique visualise et le contexte de page prsent\nsur le serveur. Le moteur WebDev dtecte cette dsynchronisation.\nUne gestion du bouton Back est ncessaire.\nEtape 2 : Clic sur le lien "Priphriques suivants".\nDessin.book Page 94 Vendredi, 22. fvrier 2008 5:53 17\nComment grer le "Back" ?\nPour grer le "Back", vous pouvez utiliser :\nle code de synchronisation de la page dynamique. Ce code est appel en cas de dsynchronisation.\nun champ de saisie cach (champ de saisie invisible) pour identifier lenregistrement\naffich sur le navigateur.\nloption "Dsactiver le mcanisme de synchronisation des pages pour ce champ" sur\nvos boutons et/ou vos liens (onglet "Avanc" de la description du bouton).\nSelon le type daction pouvant tre effectu dans la page dynamique, il est possible de\nchoisir et de combiner lune ou lautre de ces options.\nExemple dtaill de gestion du Back\nUne page dynamique permet de parcourir les diffrents produits dun site. Les boutons\nprsents dans la page sont les suivants :\nCette action ne ncessite pas de gestion particulire du "Back". Ce bouton ne manipule pas les fichiers de donnes : une dsynchronisation entre le contexte et la page affiche na pas dinfluence.\nLaction "Supprimer le produit en cours" manipule un fichier de donnes. Il est important que lenregistrement supprim corresponde lenregistrement visualis par linternaute.\nPour grer le "Back" dans ce cas, il est conseill dutiliser :\n- un champ cach (invisible) dans la page dynamique : ce champ contiendra lidentifiant de lenregistrement rellement en cours sur le navigateur.\n- le code de synchronisation : ce code permet de mettre jour le contexte (recherche\nde lenregistrement visualis par linternaute).\nLes actions effectues dans le code de synchronisation seront :\n1. Re-lecture de lenregistrement correspondant lidentifiant stock dans le\n2. Si lenregistrement nest pas trouv : une page derreur est affiche, et le code\ndu bouton "Supprimer" nest pas excut.\n3. Si lenregistrement est trouv, le contexte de page est alors automatiquement\nmodifi sur le serveur : le code du bouton "Supprimer" est excut.\nLa scurit totale !\nLexemple "Annuaire" livr avec WebDev illustre le cas prsent dans cette page.\nDessin.book Page 95 Vendredi, 22. fvrier 2008 5:53 17\nPaiement scuris avec prestataire\nDiffrents prestataires permettent de proposer un paiement scuris pour tous les sites\ncommerciaux. Tout paiement ralis avec une carte bancaire est valid par le prestataire\nauprs du centre de carte bancaire.\nLes diffrentes tapes du paiement sont les suivantes :\n- Serveur dapplication\n- Site WebDev\n1. Le client valide sa commande.\n2. Le site WebDev demande un dbit au prestataire.\n3. Le prestataire demande la saisie du numro de carte.\n4. Le client saisit son numro de carte.\n5. Aprs vrification, le prestataire envoie un numro daccord.\n6. La commande est accepte.\nLexemple "REWALI" utilise ce type de paiement.\nDessin.book Page 96 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 97 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 98 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 99 Vendredi, 22. fvrier 2008 5:53 17\nLes diffrents types de fichiers accessibles\nWinDev, WebDev et WinDev Mobile propose un accs simple aux bases de donnes les\nPartie 5 : Base de donnes\nUDC : Universal Data Connector (HLitRecherche, HExcuteRequte, Fichier, rubrique,\nLiaison fichier automatique, SQLExec, ...).\nDessin.book Page 100 Vendredi, 22. fvrier 2008 5:53 17\nComment lier un champ sa rubrique\nPour afficher dans une page des informations provenant dune base de donnes, il est ncessaire de lier les champs de cette page avec les diffrentes rubriques de la base de donnes.\nLa mthode daffichage et de rcupration des informations est trs simple :\n- La liaison dun champ avec une rubrique est dfinie sous lditeur de pages, lors de la\ndescription du champ (onglet "Fichier").\n- La fonction PageVersFichier permet de mettre jour lenregistrement avec les donnes prsentes dans la page.\n- La fonction FichierVersPage permet de mettre jour les donnes affiches dans la\npage avec les informations enregistres dans le fichier.\nDessin.book Page 101 Vendredi, 22. fvrier 2008 5:53 17\nUne application WebDev Hyper File peut fonctionner en mode Classic (appel Hyper File\nClassic) ou en mode Client / Serveur.\nLes caractristiques du mode Classic sont les suivantes :\n- Un site utilisant Hyper File Classic est excut sur diffrents navigateurs. Pour chaque\nsite excut, une session est lance sur le serveur.\n- Les fichiers de donnes sont prsents dans un rpertoire accessible par les sessions\ndes sites WebDev (sur le serveur Web ou sur un autre poste). Chaque session accde\nphysiquement aux fichiers de donnes.\n- Les traitements (requte, lecture / ajout dans un fichier, ...) sont raliss par chaque\nDessin.book Page 102 Vendredi, 22. fvrier 2008 5:53 17\nUne application WinDev Hyper File peut fonctionner en mode Classic ou en mode Client /\nLes caractristiques du mode Client / Serveur sont les suivantes :\n- Un site Hyper File Client / Serveur est excut sur diffrents postes utilisateur. Pour\nchaque site lanc, une session est prsente sur le serveur Web.\n- Les fichiers de donnes sont prsents sur un poste serveur (Serveur Hyper File). Seul\nle poste serveur accde physiquement aux fichiers de donnes.\n- Lensemble des traitements (requte, lecture/ajout dans un fichier, ...) sont raliss\nServeur Hyper File\nConnexion du type :\nDessin.book Page 103 Vendredi, 22. fvrier 2008 5:53 17\nUne requte sert interroger une base de donnes pour visualiser, insrer, modifier ou\nsupprimer des donnes. La structure de la requte dfinit les donnes manipules.\nUne requte peut interroger un ou plusieurs fichiers.\nLditeur de requtes permet de crer trs simplement des requtes, sans avoir programmer.\nPage et champs dune\npage (onglet "Contenu")\n(utilisation dans les\nDonnes en provenance dun\nou de plusieurs fichiers (Hyper\nFile, Oracle, ...)\nLe rsultat de la requte se manipule\nDessin.book Page 104 Vendredi, 22. fvrier 2008 5:53 17\nLes requtes intgres\nLes champs dune page peuvent tre lis un fichier de donnes ou une requte existante, ... Il est galement possible de lier ces champs une requte cre lors de la conception du champ.\nZone rpte lie une requte intgre\nRequte intgre : MaPage_1$Requte\nDans ce cas, la requte est intgre la page. Elle est prsente dans le fichier WPW correspondant la page. Si le fichier WPW est transmis, les requtes intgres utilises par\ncette page seront galement fournies.\nDessin.book Page 105 Vendredi, 22. fvrier 2008 5:53 17\nLa rplication universelle permet de maintenir jour des bases de donnes de format\nidentique ou diffrent (Hyper File Classic, Oracle, SQL Server, ...). Il est par exemple possible de raliser une synchronisation entre une base de donnes Hyper File Classic et une\nbase de donnes Oracle.\nIl est possible dadapter la synchronisation des cas particuliers. Par exemple, il est possible de rcuprer uniquement les enregistrements concernant un produit spcifi ou les\nenregistrements raliss une certaine date, de grer les conflits, ...\nCes adaptations doivent tre effectues par programmation grce la fonction HRplProcdureFiltre.\nLa rplication universelle utilise un modle centralis : toutes les bases de donnes se\nsynchronisent avec une base de donnes matre. La base de donnes matre rpercute\nensuite les modifications vers les autres bases de donnes.\nDessin.book Page 106 Vendredi, 22. fvrier 2008 5:53 17\nLe but du 3-Tiers est de sparer les 3 "couches" habituelles dune application : IHM, traitements et donnes.\nUne application sera donc compose de 3 couches indpendantes :\n- une couche prsentation,\n- une couche traitements,\n- une couche daccs aux donnes.\nCette sparation a pour but de rendre indpendante chacune des couches afin de faciliter\nla maintenance et les volutions futures de lapplication. Elle assure une scurit plus importante car laccs la base de donnes nest autoris que par la couche de traitements.\nElle a galement lavantage doptimiser le travail en quipe et le dveloppement multi-cibles.\nDessin.book Page 107 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 108 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 109 Vendredi, 22. fvrier 2008 5:53 17\nTester un site : Les lments tester\nLe test dun site est une tape fondamentale dans le dveloppement dun site. Le test permet de vrifier le bon fonctionnement du site et son utilisabilit.\nenchanement des pages, excution du code saisi, ...\nle "look" du site :\nutilisez diffrents navigateurs (principalement Internet Explorer et Netscape Navigator), utilisez diffrentes rsolutions cran, redimensionnez le navigateur, ...\nles fonctionnalits spcifiques au Web :\nimpression, cookies, touche "Prcdent" du navigateur, ...\nlaccs au site par diffrents internautes :\ngestion des logins et des mots de passe, gestion des accs concurrentiels aux fichiers\nde donnes, ...\nla non-rgression dun site lors dune mise jour :\nvalidation des modifications effectues dans un site et vrification que les fonctionnalits non modifies sont toujours accessibles.\nla monte en charge (pour un site install sur le serveur) :\nvalidation du nombre maximum dinternautes pouvant accder au site.\nVoici quelques exemples des principaux points tester dans un site WebDev :\nDessin.book Page 110 Vendredi, 22. fvrier 2008 5:53 17\nPlusieurs outils sont disponibles pour tester un site WebDev :\n- lditeur principal de WebDev.\n- ladministrateur WebDev.\nCe module est indispensable lexcution dun site dynamique WebDev. Sur le poste\nde dveloppement, il est possible de tester les sites dynamiques depuis une page de\ntest cre par ladministrateur.\n- WDTestSite, loutil de test de monte en charge.\nLe tableau ci-dessous prsente quand et comment utiliser ces diffrents modes de test.\nLe lancement du test depuis lditeur permet par exemple de tester :\n- les fonctionnalits du site,\n- le code utilis dans les diffrents traitements. Un puissant\ndbogueur permet de suivre\npas pas lexcution des diffrents traitements.\n- lutilisation du site avec diffrents navigateurs (installs sur\nle poste de dveloppement).\nCe type de test permet lutilisation\nOption "Projet .. Mode test .. Tester\nle projet" ou "Projet .. Mode test ..\nTester le projet depuis la page\ndaccueil" depuis lditeur.\nLe lancement du test depuis ladministrateur permet par exemple de\n- les fonctions spcifiques au\nWeb (cookies, ...),\n- lutilisation du site dans des\n1. Lancez ladministrateur WebDev (option "Programmes .. WebDev 12 .. Administrateur WebDev"\ndepuis le menu "Dmarrer").\n2. Cliquez sur le bouton "Page de\ntest" (onglet "Configuration").\nLes droits de linternaute (droits\ndaccs, dcriture et de lecture)\ncorrespondent aux droits du dveloppeur.\nRemarque : Ce test permet dutiliser le site WebDev dans des conditions identiques celles dun\ncorrespondent aux droits de lutilisateur par dfaut dfini dans le\nserveur Web utilis.\nDessin.book Page 111 Vendredi, 22. fvrier 2008 5:53 17\nWDTestSite permet de raliser des\ntests de monte en charge.\nWDTestSite permet de lancer plusieurs connexions simultanes\nun site WebDev.\nChaque connexion effectue une\nsuccession dactions dans le site\nWebDev (scnario pr-dfini)\nCe test doit tre effectu sur un site\nWebDev install sur un poste de\ndploiement, prt tre mis en service.\n1. Crez un scnario de test (avec\n2. Installez WDTestSite et le scnario sur diffrents postes pour simuler un grand nombre daccs.\n3. Spcifiez le nombre de connexions effectuer.\n4. Lancez le scnario de test sur\nLes tests automatiques permettent\nde tester les procdures et les classes dun site diffrents niveaux\nLes scnarios de test sont automatiquement gnrs en WLangage\npartir du test de la procdure ou de\nla classe. Les scnarios peuvent\ntre modifis sous lditeur de code.\n1. Affichez la procdure ou la classe sous lditeur de code.\n2. Slectionnez loption "Tests\nautomatiques .. Enregistrer un\nChaque poste effectue un nombre\nde connexions dfini. Chaque connexion effectue le scnario slectionn.\nDessin.book Page 112 Vendredi, 22. fvrier 2008 5:53 17\nPour mettre au point votre code, un dbogueur est livr en standard avec WebDev.\nLe dbogueur permet une excution pas pas de vos sites dynamiques, en visualisant le\ncode WLangage excut, le contenu des variables, ...\nPour lancer le dbogueur, utilisez :\nsoit un point darrt directement plac dans lditeur de code : lorsque la ligne prcde dun point darrt sera excute, le dbogueur sera automatiquement lanc.\nPour poser un point darrt, il suffit de cliquer devant la ligne de code : une puce rouge\nsoit le mot-cl serveur STOP du WLangage directement dans votre code WLangage :\nle dbogueur sera automatiquement lanc ds que cette ligne de code sera excute.\nsoit loption "Projet .. Mode Test .. Tracer le projet" : le dbogueur est lanc en mme\ntemps que le test du site dynamique.\nDessin.book Page 113 Vendredi, 22. fvrier 2008 5:53 17\nQuand peut-on utiliser le dbogueur ?\nLe "Go" de page :\nLe test de la page en cours sous lditeur peut tre lanc par loption "Code .. Tester la\nLe "Go" de projet :\nLe test du projet sur le poste de dveloppement peut tre lanc par loption "Projet ..\nMode test .. Tester le projet".\nLe projet dploy :\nIl est possible de dbogueur le projet dploy. Cette fonctionnalit est trs utile pour\nreproduire un problme survenant uniquement dans des conditions spcifiques.\nPour lancer le projet dploy, il faut utiliser loption "Projet .. Mode test .. Se connecter\nun site et dboguer la connexion".\nRemarque : Cette option est utilisable avec un serveur de dveloppement ou de dploiement. Le serveur doit tre configur pour autoriser le dbogage distance.\nLe projet dploy en cours dutilisation :\nIl est possible de dbogueur le projet dploy, en cours dutilisation. Cette fonctionnalit est trs utile pour reproduire un problme survenant uniquement dans des conditions spcifiques. Le cas le plus courant : vous utilisez le site, et vous rencontrez le\nproblme : vous pouvez lancer le dbogueur immdiatement en mettant un point darrt dans le code de votre projet.\nPour utiliser une session du projet dploy, il faut utiliser loption "Projet .. Mode test\n.. Dboguer une connexion existante".\nLorsquun test est ralis depuis lditeur, le dbogueur peut toujours tre utilis. Il suffit\nde placer les points darrt aux endroits voulus, pour pouvoir dbogueur pas pas le site.\nLes diffrents types de tests disponibles depuis lditeur sont les suivants :\nDessin.book Page 114 Vendredi, 22. fvrier 2008 5:53 17\nA quoi sert ladministrateur WebDev ?\nEn dveloppement (pour le test) comme en dploiement, ladministrateur WebDev est ncessaire lexcution des sites dynamiques WebDev.\nLors du dveloppement dun site dynamique WebDev, ladministrateur permet principalement de :\n- tester les sites dynamiques grce la page de test (onglet "Avanc", bouton "Page de\n- rgler les paramtres de connexion aux sites dynamiques pour vos tests : temps de\ndconnexion, ... (onglet "Configuration")\n- supprimer directement les connexions de test en cours (onglet "Connexions")\n- changer le serveur Web utilis pour vos tests (onglet "Avanc", option "Serveur")\n- effectuer un diagnostic en cas de problme lors du lancement dun site dynamique\nWebDev (onglet "Avanc", bouton "Diagnostic")\n- autoriser le dbogage distance (onglet "Configuration").\nEn dploiement, ladministrateur WebDev permet de :\n- grer les comptes WebDev (onglet "Configuration")\n- grer la configuration des diffrents sites dynamiques installs sur le serveur : nombre\nde connexions autorises, ... (onglet "Sites")\n- personnaliser les messages derreurs des diffrents sites dynamiques installs sur le\nserveur (onglet "Avanc"),\nDessin.book Page 115 Vendredi, 22. fvrier 2008 5:53 17\nDployer un site\nDessin.book Page 116 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 117 Vendredi, 22. fvrier 2008 5:53 17\nDploiement dun site statique ou\ndun site semi-dynamique WebDev\nLe dploiement dun site statique ou semi-dynamique est ralis par FTP :\n(lien de lancement)\nInformations ncessaires pour le dploiement\nAvant deffectuer un dploiement par FTP, lhbergeur doit communiquer au dveloppeur\n- Nom du serveur Web o linstallation doit tre ralise (ou son adresse IP)\n- Nom dutilisateur et mot de passe dfinis dans le serveur FTP\nLors du dploiement par FTP, le dveloppeur doit prciser dans WDDploie :\n- les informations fournies par lhbergeur\n- les fichiers installer\nPartie 7 : Dployer un site\nSi vous navez pas ces informations, inutile de tenter dinstaller. Appelez le prestataire\npour obtenir ces informations.\nDessin.book Page 118 Vendredi, 22. fvrier 2008 5:53 17\nDploiement dun site dynamique WebDev\nLes diffrents types de dploiement\nWebDev propose trois mthodes de dploiement dun site dynamique :\ndploiement par mdia physique (CD ROM, ...) du site WebDev, avec cration dune\nversion dinstallation livrable sur CD ROM lhbergeur\nCration de la version\ndinstallation par le\ndveloppeur sur un\n(CD ROM, ...)\nRemarque : un serveur dapplication WebDev peut tre intgr linstallation fournie\npar mdia physique.\ndploiement distance directement depuis le poste de dveloppement (par transfert\nde fichiers par Internet, FTP)\ndinstallation par FTP\nserveur FTP, du\nDessin.book Page 119 Vendredi, 22. fvrier 2008 5:53 17\ndploiement distance depuis un poste dadministration (par transfert de fichiers par\nCration du package\nChoisir une mthode de dploiement\nLe choix de la mthode de dploiement dpend surtout des contraintes imposes par lhbergeur et de la localisation du serveur de dploiement (distant ou prsent dans les locaux).\nLinstallation par mdia physique est conseille si le serveur Web est facilement accessible (par exemple, le serveur Web se situe dans les mmes locaux que lquipe de dveloppement).\nLinstallation distance (par FTP) directement depuis le poste de dveloppement est\nconseille si le poste de dploiement nest pas facilement accessible. Un serveur FTP\nstandard doit tre prsent sur le poste de dploiement.\nAvant deffectuer une installation distance, lhbergeur doit configurer le serveur FTP et\nle gestionnaire de comptes WebDev.\nExcution du Package :\nInstallation du site sur\nle serveur par FTP\nDessin.book Page 120 Vendredi, 22. fvrier 2008 5:53 17\nLinstallation distance (par FTP) directement depuis un poste de dadministration est\nconseille si les caractristiques du serveur ne sont pas connues par le dveloppeur lors\nde la cration du programme dinstallation. Le programme dinstallation est appel dans\nce cas un "Package".\nSi un site est destin plusieurs clients, il est ainsi possible de crer un seul package et\nde le fournir tous les clients voulus.\nLes paramtres du serveur (Adresse, compte FTP, ...) ne seront renseigns que lors de\nlexcution du package sur le poste dadministration.\nDploiement sur mdia physique : informations ncessaires\nLors dun dploiement par mdia physique, les informations concernant linstallation et le\nparamtrage du site sont donnes la fois dans lassistant de prparation de linstallation\net dans lassistant dinstallation.\nLors de la prparation de linstallation, il est ncessaire de fournir :\n- le rpertoire dinstallation,\n- les fichiers installer,\n- le rpertoire de gnration de linstallation.\nLors de linstallation, il est ncessaire de fournir :\n- le rpertoire des fichiers de donnes,\n- le rpertoire des fichiers du site.\nAprs linstallation, il est ncessaire de paramtrer les caractristiques du site (temps de\nconnexion, nombre de connexions, ...) dans ladministrateur WebDev (version de dploiement).\nDessin.book Page 121 Vendredi, 22. fvrier 2008 5:53 17\nDploiement par FTP directement depuis le poste de dveloppement : informations ncessaires\nAvant deffectuer un dploiement par FTP directement depuis le poste de dveloppement, lhbergeur doit communiquer au dveloppeur les informations suivantes :\n- Nom dutilisateur et mot de passe associ dfinis dans le gestionnaire de compte WebDev\nLors du dploiement par FTP, le dveloppeur doit prciser dans lassistant :\n- le nom du sous-rpertoire des fichiers de donnes\n- les diffrents paramtres de connexions au site\n- Il est possible de raliser une installation diffre, la date et lheure choisies.\n- L'installation et la mise jour par FTP sont scurises par mot de passe et cryptage\ndes donnes transmises.\nLors de la cration du programme dinstallation, aucune information spcifique nest ncessaire.\nLors de lexcution du programme dinstallation du site (depuis un poste dadministration), lhbergeur devra indiquer :\nDploiement par FTP directement depuis un poste dadministration : informations ncessaires\nDessin.book Page 122 Vendredi, 22. fvrier 2008 5:53 17\nCentre de contrle dhbergement\nDestin principalement aux hbergeurs et aux Webmasters, le centre de contrle d'hbergement permet d'aider hberger plus facilement les sites WebDev 12.\nLe centre gre bien sur les comptes WebDev, mais galement, le compte au niveau du\n"Serveur WEB IIS" (versions 5.xx, 6.xx et 7.xx) et les droits au niveau du systme dexploitation Windows.\nUn choix par dfaut est propos : il permet d'installer un serveur par simple clic, sans comptences spcifiques.\nLe paramtrage des lments suivants est centralis :\n- Comptes Windows,\n- Groupes des utilisateurs FTP,\n- Groupes des clients WebDev,\n- Home Directory,\n- Alias FTP,\n- Comptes WebDev,\n- Rpertoires des donnes,\n- Sites Web virtuels, ...\nDessin.book Page 123 Vendredi, 22. fvrier 2008 5:53 17\nRfrencement dun site\nPour que votre site soit visit, les internautes doivent le trouver. Pour cela, votre site doit\ntre propos lorsque linternaute saisira les mots-cls caractrisant votre site dans un moteur de recherche.\nPour simplifier le rfrencement de votre site, WebDev vous permet dintgrer une page\ndaccueil votre site. Cette page daccueil permet de saisir la description de votre site et\nles mots-cls dcrivant votre site.\nIl est possible dintgrer une page daccueil votre site :\n- soit lors de la cration du projet (dans lassistant de cration du projet).\n- soit lors du dveloppement du projet (option "Projet .. Rfrencement du site (page\nPlusieurs modles de pages daccueil sont proposs.\nExemple de page daccueil cre automatiquement par WebDev :\nDessin.book Page 124 Vendredi, 22. fvrier 2008 5:53 17\nMise en service dun site dynamique\nVotre site dynamique WebDev sera accessible par les internautes ds quil aura t mis\nen service. La mise en service dun site dynamique WebDev consiste activer le site.\nLactivation dun site dynamique WebDev peut se faire par plusieurs mthodes :\nsoit lors de linstallation par FTP : une case cocher permet dactiver automatique-\nment le site aprs son installation.\nsoit avec ladministrateur distance (voir Maintenance dun site dynamique WebDev, page 135).\nsoit avec ladministrateur WebDev prsent sur le poste de dploiement (option "Site\nWebDev bloqu", dans longlet "Sites").\nDessin.book Page 125 Vendredi, 22. fvrier 2008 5:53 17\nServeur ddi ou mutualis ?\nLes hbergeurs proposent deux types de serveurs pour installer vos sites WebDev :\nserveur mutualis :\nserveur dont les ressources sont partages par diffrents clients (client = socit faisant hberger son site chez un hbergeur)\n- systme dexploitation\n- serveurs Web et FTP\nLhbergeur fournit un poste serveur diffrents clients.\n- configure le serveur FTP.\n- dtermine le nombre maximum de connexions sur lensemble des sites dynamiques\ndun mme client ( laide du gestionnaire de comptes WebDev).\nLinstallation et les mises jour dune site dynamique ou statique peuvent tre ralises par FTP.\nDessin.book Page 126 Vendredi, 22. fvrier 2008 5:53 17\nserveur ddi :\nle serveur est rserv au client. Lhbergeur fournit uniquement laccs Internet\n(adresse IP, cble, ...).\nLa machine est soit loue par lhbergeur, soit fournie par le client.\nPoste ddi au client :\n- serveur Web et si\nncessaire serveur FTP\n- sites WebDev\nLhbergeur fournit uniquement laccs Internet (adresse IP, cble, ...).\n- fournir ventuellement le poste serveur (location possible)\n- configurer le poste (systme, ...)\n- installer le serveur Web\n- installer et configurer les sites WebDev (par FTP ou par CD ROM)\nDessin.book Page 127 Vendredi, 22. fvrier 2008 5:53 17\nLe tableau ci-dessous prsente les avantages et inconvnients des diffrents types de\nQuel que soit le type de serveur choisi, il est ncessaire de possder une licence de dploiement pour chacun des sites dynamiques WebDev installs sur le serveur.\nChaque serveur hberge un ou plusieurs sites dynamiques WebDev.\nce serveur ?\n- Cot moindre\n- Administration du serveur ralise par lhbergeur\nUn serveur mutualis est\nconseill pour :\nPrincipaux inconvnients :\n- Ressources mmoire partages entre les sites prsents sur le serveur.\n- En cas de blocage dun site, tous les sites sur\nle serveur sont bloqus.\n- Utilisation dexcutables autonomes rarement possible.\n- Accs non scuris aux donnes :\nDes personnes non autorises peuvent avoir\naccs aux donnes : lhbergeur, et potentiellement, dautres clients, si le serveur nest\npas correctement configur.\nConseil : cryptez les fichiers de donnes pour\nviter toute utilisation non autorise.\n- Ressources du poste serveur disponibles\npour le(s) site(s) install(s) sur ce poste.\n- Gestion du rapatriement des donnes totalement personnalisable :\n- rplication par e-mails,\n- utilitaire WDREPLIC,\n- copie des fichiers par FTP.\n- Cot important\n- Administration du poste serveur entirement\nralise par le client, la plupart du temps.\nles sites peu visits (jusqu 20 ou 30 connexions simultanes),\nles sites ncessitant\npeu de mmoire (pas de\ncalculs trs importants\neffectus sur le serveur),\nles sites en phase de dmarrage.\nUn serveur ddi est conseill pour :\n- les sites trs visits,\n- les sites ncessitant\nune place disque et mmoire importante,\n- les sites grant des donnes sensibles,\nDessin.book Page 128 Vendredi, 22. fvrier 2008 5:53 17\nInstaller un site dynamique WebDev sur\ndes configurations spcifiques\n1. Installation sur un serveur Web sous Windows (NT, 2000 ou suprieur) ou\nSont installs sur le serveur :\n- le serveur dapplication\n- le site dynamique WebDev\n- le serveur Web sous Windows\n- le serveur Web sous Linux\nDessin.book Page 129 Vendredi, 22. fvrier 2008 5:53 17\n2. Installation sur un serveur Windows, avec un accs Internet par UNIX\nServeur Web Unix\n- Serveur dapplication WebDev\n- Sites dynamiques WebDev\n1. Ouverture dune page statique. La page statique est prsente sur le serveur UNIX.\n2. Lancement du site dynamique WebDev (prsent sur le serveur Windows) par un lien\nprsent dans la page HTML statique.\n3. Fonctionnement normal du site WebDev.\nRemarque : la mme configuration peut tre adopte avec un serveur Linux.\n- Serveur Web sous Windows\nDessin.book Page 130 Vendredi, 22. fvrier 2008 5:53 17\nLe systme Load Balancer permet de rpartir la charge de connexion sur un site dynamique WebDev sur diffrents postes.\nSolution 1 : Installation du site dynamique WebDev uniquement sur le serveur de donnes.\nCette solution consiste installer :\n- sur chaque serveur WEB, le serveur dapplication WebDev,\n- sur le serveur de donnes, les sites dynamiques WebDev et les fichiers de donnes.\nDessin.book Page 131 Vendredi, 22. fvrier 2008 5:53 17\nSolution 2 : Installation du site dynamique WebDev sur tous les serveurs WEB.\n- sur chaque serveur WEB, le serveur dapplication WebDev, et les sites dynamiques\n- sur le serveur de donnes, les fichiers de donnes des sites dynamiques WebDev.\nDessin.book Page 132 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 133 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 134 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 135 Vendredi, 22. fvrier 2008 5:53 17\nMaintenance dun site dynamique WebDev\nLe dploiement dun site dynamique est une tape importante du dveloppement dun site, mais ce nest pas la dernire : la maintenance du site commence ...\nLa maintenance regroupe :\nLa gestion des sites dynamiques dploys :\nUn administrateur WebDev distance peut tre lanc depuis nimporte quel navigateur et nimporte quel poste. Cet administrateur permet de configurer laccs au site\ndynamique, de raliser des sauvegardes rgulires par FTP, ...\nLvolution du site dynamique : corrections, nouveauts, ...\nLa mise jour distance (FTP) ou linstallation par mdia physique permettent de faire\nvoluer votre site dynamique.\nLa surveillance de laccs au serveur WEB :\nUn robot de surveillance permet de tester rgulirement laccs au serveur Web. En\ncas de problme (blocage du serveur et des sites WebDev, ...), un e-mail est automatiquement envoy au responsable du site dynamique. Il est aussi possible de relancer\nle moteur WebDev ou de rebooter.\nWebDev (sur poste de\ndveloppement pour un\nMise jour des sites\nWebDev depuis le poste\nde dveloppement par FTP\n- Administrateur WebDev\n- Site dynamique WebDev\nWebDev (conseill sur un\nDessin.book Page 136 Vendredi, 22. fvrier 2008 5:53 17\nConsulter les statistiques de frquentation\nIl est important de disposer de statistiques prcises sur les visites des sites.\nComment savoir qui est venu sur votre site, les pages qui ont t consultes, les applications qui ont t utilises, de quel site vient linternaute ?\nWebDev est fourni avec un outil complet de statistiques pour les pages dynamiques :\nWDStatistiques. Cet outil peut tre install sur nimporte quel poste.\nQuelques exemples de statistiques fournies par WDStatistiques : nombre de connexions\npar jour, pages consultes, systmes dexploitation et navigateurs des internautes, ...\nExemples de statistiques de sites dynamiques :\nDessin.book Page 137 Vendredi, 22. fvrier 2008 5:53 17\nRcuprer des donnes sur un site\nUn site commercial permet aux internautes deffectuer des commandes, des rservations, ...\nPour rcuprer ces informations, vous pouvez utiliser plusieurs mthodes.\nConseil : Traitez les donnes rcupres dans une application de "Back Office" ralise\nRcuprer les donnes dun site\n1. Linternaute effectue une commande sur le site.\n2. Le site WebDev indique linternaute que la commande a bien t enregistre. Linternaute est inform quil recevra un email de confirmation.\n3. Le site WebDev envoie un email au sige de la socit. Cet email contient la commande effectue par linternaute.\n4. Un email est envoy linternaute par la socit pour lui indiquer que sa commande\na bien t prise en compte.\n- Solution simple mettre en place.\n- Ne ncessite aucun excutable supplmentaire sur le serveur.\nInconvnient : Rcupration "simple" des donnes : pas de mise jour des donnes vers\nDessin.book Page 138 Vendredi, 22. fvrier 2008 5:53 17\nCette solution peut tre utilise avec un serveur mutualis.\nCette solution est conseille par exemple pour des sites de commerce lectronique traitant un nombre limit de commandes.\nWebDev permet deffectuer rgulirement une sauvegarde des fichiers de donnes du\nsite WebDev. Cette sauvegarde peut tre ensuite transfre par FTP au sige de la socit. Il suffit alors de :\n- rcuprer la sauvegarde compresse des fichiers de donnes\n- dcompresser les fichiers ( laide dune application WinDev)\n- traiter les donnes prsentes dans les fichiers.\n- Ne ncessite aucun excutable supplmentaire chez lhbergeur.\nInconvnient : Tous les fichiers de donnes de lapplication sont rcuprs.\nEffectuer une rplication\nLa rplication permet de maintenir jour des bases de donnes distantes de mme structure. Il est ainsi possible de faire une rplication entre la base de donnes dun site WebDev et la base de donnes de lapplication WinDev au sige de la socit.\nPar exemple, une base de donnes de saisie de commandes et de gestion de stocks est\nutilise la fois sur un site WebDev (prise de commandes en ligne) et au sige de la socit (prise de commandes tlphonique ou par courrier).\nLa rplication permet de :\n- transmettre les commandes saisies en ligne au sige de la socit (rplication monodirectionnelle)\n- transmettre les commandes saisies en ligne au sige de la socit, et de transmettre\nla mise jour des stocks au site Internet (rplication bi-directionnelle)\nAttention : Il est ncessaire de prendre en compte les contraintes de la rplication ds la\ncration du projet. En effet, plusieurs rgles doivent tre respectes lors de la description\nde lanalyse et des rubriques des fichiers.\nIl y a deux types de rplication :\n- la rplication par emails\n- la rplication laide de WDReplic\nDessin.book Page 139 Vendredi, 22. fvrier 2008 5:53 17\n1.1 Rplication par emails\nUn moteur demails est install :\n- sur le serveur. Ce moteur de-mails est livr avec WebDev.\n- au sige de la socit.\nA chaque modification de la base de donnes (ajout, modification, suppression), un email\nest cr. Cet email contient toutes les informations ncessaires la mise jour de la base\nde donnes distante. Lemail est envoy et trait par le moteur de-mails.\nSige de la\nBack Office (WinDev)\n- Moteur demails\nMise jour des donnes possible :\n- du serveur vers le sige de la socit.\n- du sige vers le serveur.\nMoteur demails en tche de fond sur le serveur et sur le poste rceptionnant les emails\nau sige de la socit.\nCette solution est conseille pour un site install sur un serveur ddi (il nest pas toujours possible de lancer un excutable en permanence sur un serveur mutualis).\n- Application Front Office\n- Moteur demails (livr\navec le serveur dapplication WebDev)\nDessin.book Page 140 Vendredi, 22. fvrier 2008 5:53 17\n2.2 Rplication laide de WDREPLIC\nWDREPLIC est un utilitaire permettant de mettre jour des bases de donnes distantes.\nCet utilitaire est livr avec WebDev et WinDev.\n- Application Back\ntransfert sur le\n- Application Front\n- Lancement rgulier de WDREPLIC sur le serveur pour effectuer la rplication (par un\ntraitement BATCH par exemple).\n- Ncessite un accs direct ainsi que des droits de lecture et dcriture sur un rpertoire\nde transfert prsent sur le serveur.\nCette solution est conseille pour une application installe sur un serveur ddi sur lequel un accs direct est possible.\nDessin.book Page 141 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 142 Vendredi, 22. fvrier 2008 5:53 17\nDessin.book Page 143 Vendredi, 22. fvrier 2008 5:53 17\nPrincipales nouveauts de WebDev 12\nLisez cette partie si vous connaissez WebDev 11.\nWebDev 12 prsente de nombreuses nouveauts, aussi bien pour dvelopper des sites\nWebDev dynamiques que pour dployer des sites WebDev statiques.\nLa compatibilit avec WinDev 12 et WinDev Mobile 12 est totale.\nNouveau RAD (Rapid Application Development)\nEditeur danalyse :\nNom des rubriques et des fichiers multilangue\nGroupes de lanalyse manipulables par programmation\nDbogage disponible en mode AWP.\nDbogage dun site prsent sur un serveur.\nDbogage dune session lance sur un serveur.\nGo de procdure globale.\nVolet Trace du dbogueur pour afficher le rsultat de la trace lors du dernier test.\nItrations dans les tests automatiques.\nAssistant daide au rfrencement.\nGnration automatique dun fichier SiteMaps.\nHyper File Client / Serveur :\nTche programme sur le serveur\nNouveau look des menus, avec de nouvelles options de personnalisation\nChamp onglet : permet de grer des "plans" facilement. Il est possible de prsenter un produit avec plusieurs onglets (prsentation, dtail, technique, tarif).\nRecherche des styles inutiliss.\nNouveau catalogue dimages.\nRefactoring dune slection de champs en modle de champs.\nModle de modles de champs.\nModle de modles de fentres.\nHritage de styles.\nDessin.book Page 144 Vendredi, 22. fvrier 2008 5:53 17\nGestionnaire de Sources :\nExtraction automatique de la page ds sa modification.\nGestion du changement physique de machine.\nMasquage des fichiers de lanalyse.\nPossibilit de traiter les tches et les bugs lors de la r-intgration.\nFonctions HTMLVersTexte et HTMLVersRTF\nProprits HTMLAvant et HTMLAprs\nProprits CouleurFond, Bulle, Etat\nNouvelles proprits sur la police (..PoliceGras, ..PoliceItalique, ...)\nNouvelles proprits CSS natives (opacit, alignement, largeur, ...)\nGestion du GFI\nAjax est disponible en PHP\nDessin.book Page 145 Vendredi, 22. fvrier 2008 5:53 17\nVous connaissez dj WinDev\nWebDev permet de crer des pages alors que WinDev permet de crer des fentres.\nSi vous crez une page PHP, un code supplmentaire apparat : un code PHP sexcutant sur le serveur.\nDe nouvelles fonctions du WLangage spcifiques Internet et Intranet sont disponibles (la liste de ces fonctions est donne page 146).\nCertaines fonctions du WLangage inadaptes Internet et Intranet nexistent plus.\nCertaines fonctions du WLangage sont uniquement utilisables dans un traitement excutable en code serveur.\nCertaines fonctions du WLangage sont uniquement utilisables dans un traitement excutable en code navigateur.\nDe nouveaux types de champs plus spcifiques une application Internet / Intranet\nChamp Image clicable (Map Area)\nChamp Libell HTML\nChamp Tableau HTML\nCertains types de champs inutiles sur Internet ont disparu : ascenseur, potentiomtre,\nActiveX, Objet OLE, Onglet, spin, ...\nCe qui change dans WebDev :\nDessin.book Page 146 Vendredi, 22. fvrier 2008 5:53 17\nFonctions du WLangage spcifiques\n(Dtail dans laide en ligne du WLangage)\nAnnule l'excution automatique de la procdure navigateur appele par la\nAJAXAppelAsynchroneEnCours Permet de savoir si une procdure serveur appele par la fonction\nAJAXExcuteAsynchrone est en cours dexcution.\nPermet de savoir si la technologie AJAX est utilisable dans le navigateur en\nExcute une procdure serveur sans rafrachir la page. Cette fonction est\nbloquante. Tant que le rsultat de la procdure excute n'est pas rcupr, aucun autre traitement n'est excut.\nExcute une procdure serveur sans rafrachir la page. Cette fonction n'est\npas bloquante. Les autres traitements continuent de s'excuter normalement (que le rsultat de la procdure excute soit rcupr ou non).\nAjoute une adresse Internet dans la liste des favoris de l'internaute.\nAppelle un script ASP externe et renvoie la page rsultat dans la fentre en\ncours du navigateur.\nAppelle un script externe .asp et renvoie le rsultat dans une chane. Une\nrequte http est effectue : il est possible d'utiliser soit une mthode POST,\nsoit une mthode GET.\nPermet de spcifier l'action effectue en cas de dsynchronisation entre la\npage HTML affiche dans le navigateur et le contexte de page sur le serveur.\nChange la frame de destination de la page.\nAjoute un lien dans un chemin de navigation.\nInsre un lien dans un chemin de navigation.\nDfinit le fonctionnement des contextes AWP.\nRenvoie le nombre d'instances du site WebDev en cours d'excution sur le\nPermet de savoir si un contexte de page existe sur le serveur.\nFerme un contexte de page.\nOuvre un nouveau contexte de page sans renvoyer les informations vers le\nEcrit un cookie sur le poste de l'internaute lors du prochain affichage d'une\npage WebDev dans le navigateur.\nRcupre la valeur d'un cookie enregistr sur le poste de linternaute.\nDclarer une liste de variables dont la valeur sera persistante entre les affichages successifs des pages AWP\nRenvoie l'tat d'un e-mail envoy par une session SMTP ouverte en mode\nOuvre le logiciel de messagerie par dfaut de l'internaute sur le poste navigateur.\nDessin.book Page 147 Vendredi, 22. fvrier 2008 5:53 17\nRenvoie un fichier spcifique sur le navigateur.\nInitialise automatiquement les champs d'une page avec les valeurs des rubriques associes dans l'enregistrement en cours (charg en mmoire) du\nfichier Hyper File.\nActualise un frameset affich dans le navigateur de l'internaute partir du\ncontexte prsent sur le serveur.\nAffiche un frameset WebDev dans le navigateur de l'internaute et ferme\ntous les contextes de pages et de frameset en cours.\nRenvoie le nom physique complet du rpertoire contenant les images, les\nDfinit la taille de l'image contenant le graphe.\nRenvoie la position horizontale du curseur de souris par rapport au champ\nRenvoie la position verticale du curseur de souris par rapport au champ\nRenvoie le numro de la zone de limage clique par linternaute (image clicable uniquement).\nPermet de manipuler des fonctionnalits spcifiques sur des objets de la\nRenvoie l'adresse IP du poste de l'Internaute connect au site WebDev.\nFerme la fentre en cours du navigateur et stoppe l'excution du code en\nRenvoie le nom du navigateur de linternaute.\nOuvre une nouvelle fentre du navigateur.\nActive ou dsactive leffet appliqu par WebDev sur les pages inactives lors\nde laffichage dune page modale.\nActualise une page affiche dans le navigateur de l'internaute partir du\nPermet dobtenir ladresse Internet dune page WebDev.\nAffiche une page dans le navigateur de linternaute.\nRenvoie le nom de la page contenant le code WLangage en cours d'excution.\nVrifie si la page spcifie est actuellement affiche dans le navigateur de\nRemet zro (ou non) les champs de la page en cours et lance les traitements d'initialisation des champs.\nRenvoie la valeur d'un paramtre pass la page en cours.\nFait dfiler une page pour positionner un champ dans la partie visible de la\npage (le plus haut) dans le navigateur.\nRenvoie le nom de la page prcdente.\nAffiche une page semi-dynamique dans le navigateur de l'internaute partir d'une page WebDev dynamique ou statique.\nPermet de dfinir le taux de grisage des pages inactives.\nAffiche une page WebDev dans le navigateur de l'internaute et ferme tous\nles contextes de pages en cours.\nDessin.book Page 148 Vendredi, 22. fvrier 2008 5:53 17\nValide la page spcifie et lance l'excution d'un bouton.\nEnvoie les donnes dune page actuellement affiche sous le navigateur\nvers un serveur ASP.\nInitialise automatiquement la valeur mmoire des rubriques d'un fichier\navec la valeur des champs de la page.\nvers un serveur JSP.\nvers un serveur PHP.\nAppelle un script PHP externe et renvoie la page rsultat dans la fentre en\nAppelle un script externe .php et renvoie le rsultat dans une chane. Une\nAppelle un script externe (par exemple .php, .asp, .mhtml ou .mht) et renvoie la page rsultat dans la fentre en cours du navigateur.\nAppelle un script externe (par exemple .php ou .asp) et renvoie le rsultat\ndans une chane. Une requte http est effectue : il est possible d'utiliser\nsoit une mthode POST, soit une mthode GET.\nRenvoie ladresse Internet de connexion un site dynamique WebDev situ\nsur le mme serveur.\nAffiche un site dynamique (cr avec WebDev) dans le navigateur de l'internaute partir d'une page WebDev dynamique ou statique.\nPermet d'activer ou de dsactiver le mode scuris SSL.\nSupprime du contexte AWP une variable ajoute par DclareContexteAWP\nEnregistre sur le serveur un fichier "upload" par l'internaute.\nConnatre le nom d'un fichier "upload" par l'internaute.\nDessin.book Page 149 Vendredi, 22. fvrier 2008 5:53 17\nComposants livrs avec WebDev\nPermet de grer une demande de documentation (brochure,\ncatalogue, ...) dans un site WebDev.\nPermet dafficher un diagramme de GANTT dans une table\nmmoire ou dans une page intgre au composant.\nCentralise la gestion des utilisateurs et de leurs mots de passe.\nPermet de gnrer une image code en fonction des paramtres donns.\nPermet dindexer des documents (texte, vidos, sons, ) selon un identifiant gr par lutilisateur (pouvant provenir dun\nfichier de donnes Hyper File, ) et des mots-cls (texte contenu dans un document, nom de fichier, etc).\nPermet galement deffectuer des recherches sur les documents ainsi indexs et de gnrer des statistiques dindexation (mots-cls inutiliss, nombre de documents par motscls, etc).\nAttention : Les documents ne sont pas stocks. Seuls les\nmots-cls permettant d'indexer les documents sont enregistrs dans les fichiers de donnes du composant.\nPermet de grer facilement un panier de commandes dans\nPermet de mettre en place un systme de paiement scuris\nen utilisant la solution de la socit PayBox.\nAttention : ceci nest pas une recommandation de PC SOFT\npour lutilisation de la solution de paiement scuris de la socit PayBox.\nDeux sous-rpertoires sont spcifiques chacun de ces exemples :\n- le sous-rpertoire "<NomDuComposant>-Exemple" contient un exemple de projet utilisant le composant.\n- le sous-rpertoire "<NomDuComposant>-Source" contient le projet du composant.\nDes composants supplmentaires seront livrs avec la Lettre du Support Technique (LST)\nou disponibles sur notre site (www.pcsoft.fr).\nWebDev est livr en standard avec de nombreux composants. Ces composants sont livrs\navec leurs sources et avec un exemple dutilisation.\nVoici la liste des principaux composant livrs avec WebDev :\nDessin.book Page 150 Vendredi, 22. fvrier 2008 5:53 17\nExemples livrs avec WebDev\nLes exemples livrs avec WebDev prsentent de manire didactique les diffrentes fonctionnalits de WebDev.\nLeur code source est comment et dtaill.\nCes exemples sont prsents dans le sous-rpertoire "Exemples" du rpertoire d'installation de WebDev et peuvent tre ouverts directement depuis le volet "Assistants, Exemples\nDiffrents types d'exemples sont livrs avec WebDev :\n- exemples complets : ces exemples correspondent des sites complets, qui peuvent\ntre utiliss sans adaptation.\n- exemples didactiques : ces exemples illustrent une fonctionnalit spcifique.\nNom de lexemple\nGestion de supermarch en ligne.\nPermet de visualiser, rechercher des produits dans diffrentes boutiques. Ces produits peuvent tre achets\net stocks dans un panier virtuel jusquau paiement.\nGestion de petites annonces.\nPermet des recherches multicritres, ajout, modification et suppression d'annonces, ainsi qu'une gestion\nAchat de voyages en ligne.\nPermet de slectionner un voyage, de faire des rservations, ...\nGestion de dysfonctionnements.\nPermet de crer, modifier ou supprimer des suggestions ou des dysfonctionnements. Permet galement la\nrecherche et la consultation des informations enregistres.\nGestion de dysfonctionnements en PHP.\nDessin.book Page 151 Vendredi, 22. fvrier 2008 5:53 17\nUtilise le composant Moteur de recherche pour effectuer des recherches par mot-cls.\nSite de location de DVD en ligne.\nSite de vente et de location de biens immobiliers.\nCet exemple utilise un fichier de donnes de plus d'1\nmillion d'enregistrements. Il permet de visualiser, de rechercher et de commander des maquettes.\nUne fois la commande tablie, il est possible d'imprimer\nla facture au format PDF ou dutiliser le module PayBox\nde paiement scuris\nCette application Web simule une gestion de parc informatique.\nCet exemple est un site de gestion de blogs.\nCet exemple est bas sur une gnration AWP, ce qui\npermet entre autres de pouvoir rfrencer le site dans\ntous les moteurs de recherche.\nDe plus, chaque blog peut tre export en RSS.\nCet exemple est un site Php de gestion de blogs.\nIl est possible de mettre en forme le texte, d'inclure des\nimages, des citations, etc...\nCet exemple explique comment utiliser le grapheur livr\nen standard avec WebDev et associer des actions au\nclic sur des parties dynamiques du graphe.\nCet exemple est dvelopp pour Microsoft Internet Explorer 5.5 (ou version ultrieure). Il utilise les fonctionnalits d'dition HTML d'Internet Explorer.\nCet exemple permet de simuler des emprunts et notamment de calculer :\n- le montant des mensualits partir du montant emprunt donn\n- le montant empruntable partir d'une mensualit donne\n- le rapport d'un placement partir d'un apport mensuel\nLe tableau d'amortissement est affich pour chacun\ndes cas. Ce tableau peut tre dit dans un fichier au\nformat PDF (fonctionnalit standard de WebDev).\nDessin.book Page 152 Vendredi, 22. fvrier 2008 5:53 17\nCet exemple propose les fonctionnalits principales\nd'un forum utilisateur (cration de forums, de sujets (ou\ntopics) et de messages, modration par un administrateur, etc...).\nCet exemple est une galerie d'images et de photographies simplifie.\nLes images contenues dans le rpertoire "Data" du rpertoire "Exe" du projet sont affiches en miniature\ndans une liste horizontale dfilante. Le dfilement des\nimages est ralis grce AJAX.\nCet exemple est un site Php. Il s'agit d'une galerie d'images et de photographies simplifie.\nCet exemple permet d'afficher de faon dynamique les\ntches des diffrents collaborateurs.\nIl est possible d'ajouter, de modifier ou de supprimer\ndes tches dans le planning, simplement en cliquant\nsur les lments du planning.\nToutes les manipulations sont effectues grce AJAX.\nCet exemple de site marchand simplifi est un site Php\nralis avec WebDev. Il permet de visualiser, de rechercher et de commander des maquettes.\nCet exemple permet de dessiner des graphes.\nPrsente le mixage entre un site dynamique WebDev\nclassique et un site AWP WebDev.\nLes pages AWP du site seront rfrencs par les moteurs de recherche. Elles contiennent les produits classs par rayon.\nLes pages dynamiques permettent de grer les prises\nde commandes et les informations sur les clients du site. Ces informations nont pas tre rfrences par\nen standard avec WebDev pour tracer des graphes\nDessin.book Page 153 Vendredi, 22. fvrier 2008 5:53 17\nWW_WebChat est un site de discussion en ligne et en\nPlusieurs personnes peuvent se connecter au site et\ndiscuter avec les autres personnes dj prsentes.\nTous les traitements effectus (envoi de messages,\netc.) sont grs grce AJAX. Il n'y a donc aucun effet\nde rafraichissement dans les pages.\nCet exemple explique comment manipuler les images\nen code navigateur : zoomer, se dplacer, grer le clic\nsur une carte. (ici une carte Michelin)\nCet exemple explique comment modifier la feuille de\nstyles d'une page WebDev par programmation. Le changement de feuille de styles s'effectue en code navigateur.\nCe principe peut tre utile par exemple pour changer\nl'interface d'un site en fonction des prfrences de l'internaute.\nCet exemple fournit sous forme de superchamps des\nbandeaux Flash personnalisables.\nCet exemple montre comment modifier deux frames diffrentes, sans rafficher tout le frameset.\nCet exemple a pour but de prsenter l'utilisation des\nmap area en programmation ou par action prdfinie.\nCet exemple montre comment utiliser le CSS pour encadrer et mettre en vidence des mots dans un libell\nHTML (ou un champ HTML).\nPrsente lutilisation de fichiers XML.\nPermet de grer des commandes, modifier les quantits commandes, valider et enregistrer des commandes au format XML.\nDessin.book Page 154 Vendredi, 22. fvrier 2008 5:53 17\nCet exemple montre comment grer une rglette dans\nune page AWP.\nLa rglette est gnre en WLangage grce diverses\noptions (nombre de rsultats par page de recherche,\nnombre total de rsultat, ...).\nCet exemple propose l'utilisation du superchamp TexteDefilant. Ce superchamp permet de faire dfiler du texte dans un cadre de votre page\nCe site permet de dtecter la fermeture d'un navigateur\nclient afin d'enregistrer, par exemple, sa dconnexion\nou d'effectuer des oprations spcifiques.\nCet exemple montre un dialogue entre deux navigateurs distincts. Il permet d'ouvrir une nouvelle page\ndans un nouveau navigateur et de rcuprer des valeurs modifies.\nCe site est un diaporama de photographies du Cantal\nCe site permet de proposer des fichiers en tlchargement aux utilisateurs en fonction du groupe auquel ils\nCe site permet d'utiliser les variables d'environnement\nafin de rcuprer certaines informations sur les internautes.\nCe site permet d'intgrer un menu droulant Flash qui\ninteragit avec WebDev. Ce site permet donc d'utiliser\ndes animations Flash dans un site WebDev.\nCe site montre aussi l'interaction avec une animation\nCet exemple permet de montrer comment changer dynamiquement l'apparence d'un formulaire contenu\nCe site ralis permet d'intercepter l'appui sur la touche\n[TABULATION] pour insrer une tabulation dans un\nCe programme permet de dtecter la touche frappe au\nclavier (vnement OnKeyDown) sous Internet Explorer.\nCette fonctionnalit est mise en place dans un jeu de\nDessin.book Page 155 Vendredi, 22. fvrier 2008 5:53 17\nCe programme ralis avec WebDev explique les cas\nles plus frquents dutilisation de zones rptes.\nCe programme ralis avec WebDev montre comment\ngrer des zones rptes contenant des graphes dynamiques.\nDes exemples supplmentaires sont livrs avec la Lettre du Support Technique (LST) ou\nsont disponibles sur notre site (www.pcsoft.fr).\nDocuments similaires à 9525263-Concepts-Webdev-12.pdf\nFailles de Securite Des Applications Web\nSTDME044N-6P - PRISOMÈTRE AUTOMATIQUE VICAT 6 POSTES TROPICALISÉS, CONTRÔLÉ PAR PC AVEC LOGICIEL VICAT-WIN\nACA-BUR PROGRESSION PACA\nAVDI Common User's Manual French