Créer une «application web» avec AngularJS, nodejs et mongodb v Brouillon

Dimension: px
Commencer à balayer dès la page:

Download "Créer une «application web» avec AngularJS, nodejs et mongodb v110813 Brouillon"

Transcription

1 Créer une «application web» avec AngularJS, nodejs et mongodb v Brouillon

2 Ce texte est sous licence Creative Commons Attribution - Partage dans les Mêmes Conditions 4.0 International. Pour accéder à une copie de cette licence, merci de vous rendre à l'adresse suivante ou envoyez un courrier à Creative Commons, 444 Castro Street, Suite 900, Mountain View, California, 94041, USA. Le titulaire des droits autorise toute utilisation de l œuvre originale (y compris à des fins commerciales) ainsi que la création d œuvres dérivées, à condition qu elles soient distribuées sous une licence identique à celle qui régit l œuvre originale.

3 Notes de l'auteur Ce document est à l'origine destiné aux élèves de seconde, du lycée G Fichet de Bonneville (Haute-Savoie), qui ont choisi de suivre l'enseignement d'exploration PSN (Pratique Scientifique et Numérique). Il est aussi utilisable en spécialité ISN. Dans tous les cas, des connaissances en JavaScript, HTML et CSS sont indispensables avant d'aborder AngularJS et nodejs (voir, par exemple, les 19 activités «JavaScript, HTML et CSS» que j'ai rédigées pour les élèves). Ce document n'a pas la prétention d'être la «bible» d'angularjs, de nodejs ou de mongodb (n'oubliez pas qu'il s'adresse à des élèves ayant une pratique limitée de la programmation), il a été conçu pour travailler «en collaboration» avec l'enseignant (certaines parties ne sont pas détaillées, les enseignants devront adapter leurs explications en fonction des contraintes locales (OS installé, possibilité d'installer des logiciels sur les machines...)). Les premières pages de la deuxième partie abordent des sujets relativement théoriques (client-serveur, protocole HTTP...) ce qui va à l'encontre de l'esprit de ce document. Cependant cette digression me semble indispensable vu les sujets abordés dans cette seconde partie. David Roche

4 1re partie : les bases d'angularjs

5 AngularJS? Qu'est ce que c'est? AngularJS (site officiel) est un framework JavaScript open-source (rechercher la définition d'open-source et de framework) développé par Google. Il a été créé par Miško Hevery (en 2010). La version 1.0 (première version dite stable) date de juin Ce framework facilite grandement le développement d'application web selon le modèle MVC (Modèle Vue Controleur). Nous aurons l'occasion de revenir plus tard sur ces notions, mais vous avez peut-être déjà eu l'occasion d'utiliser des applications web (souvent appelées «web app»). Par exemple Gmail et GoogleDoc sont des «web app» (site internet ressemblant à des applications «classiques»). Notez bien qu'angularjs n'est pas un "logiciel", vous allez donc produire du code (HTML, JavaScript et CSS). Première approche AngularJS va nous permettre de rajouter de nouveaux attributs aux balises HTML, tous ces nouveaux attributs commenceront par : ng- Par exemple nous pourrons avoir <p ng-controller="moncontroleur">...</p> Dans notre 1 er exemple nous utiliserons 2 attributs apportés par AngularJS : ng-app et ng-controller, mais il en existe beaucoup d'autres que nous étudierons plus tard dans ce document. Nous allons pouvoir introduire ce que nous appellerons pour l'instant des «variables» directement dans le code HTML (ces «variables» pourront être contrôlées grâce au JavaScript). Ceci va rendre notre page HTML dynamique (les données affichées pourront évoluer au cours de temps). Ces «variables» seront facilement reconnaissables, car elles seront encadrées par des accolades : {{mavariable exemple : <h1>{{montitre</h1>. Le navigateur n'affichera pas {{montitre, mais la valeur contenue dans la «variable» montitre. Un premier exemple code HTML ex1.html <!doctype html> <html lang="fr"> <head> <meta Charest="UTF-8"> <title>test AngularJS</title> <script src="lib/angular.min.js"></script> <script src="javascript/ex1.js"></script> </head> <body ng-app> <h1 ng-controller="moncontrol">{{mavariable</h1> </body> </html> code JavaScript ex1.js function moncontrol($scope){ $scope.mavariable="hello World!"; Quelques remarques sur le contenu de la balise head du fichier HTML : Avant de commencer vous devez télécharger le framework sur le site officiel (http://angularjs.org/), choisir «stable», «Minified» et cliquez sur Download. Récupérer le fichier «angular.min.js». La ligne «<script src="lib/angular.min.js"></script>» va vous permettre d'utiliser AngularJS. À vous de l'adapter en fonction du dossier qui accueille le fichier «angular.min.js». La ligne suivante («<script src="javascript/ex1.js"></script>») va nous permettre d'accéder à notre fichier JavaScript «ex1.js», ici aussi, attention au chemin choisi. Vous avez sans doute remarqué l'attribut ng-app au niveau de la balise body. Cela signifie simplement qu'angularjs sera actif de la balise <body> jusqu'à la balise </body>. L'attribut ng-controller dans la balise <h1> va nous permettre de définir un contrôleur. Ce contrôleur sera actif de la balise <h1> jusqu'à la balise </h1>. Tout ce qui se trouve entre les balises <h1> et </h1> sera soumis à la

6 «surveillance» du contrôleur «moncontrol», dans cette «zone», c'est lui le «patron», c'est lui le chef d'orchestre. Qu'est-ce qu un contrôleur dans AngularJS? Ce contrôleur correspond à une fonction JavaScript présente dans le fichier «ex1.js» (d'où l intérêt de la ligne «<script src="javascript/ex1.js"></script>»). Analysons cette fonction : La fonction «moncontrol» possède un argument : «$scope». Cet argument est fondamental. Un des principes de base (et une des forces) d'angularjs se nomme le data-binding, qu'est-ce que le data-binding? C'est la capacité à échanger des informations (des données) entre la partie HTML et la partie JavaScript. Cet échange de données peut se faire dans les 2 sens : du HTML vers le JavaScript et du JavaScript vers le HTML. Pour «transporter» ces données, AngularJS utilise un objet (au sens informatique du terme, si nécessaire revoir l'activité 14). Cet objet est l'argument de la fonction «moncontrol», c'est-à-dire «$scope». Analysons maintenant l'unique ligne qui compose notre fonction «moncontrol» (notre contrôleur) : $scope.mavariable="hello World!"; Nous avons {{mavariable du côté HTML et $scope.mavariable du côté JavaScript, nous pourrons considérer ces 2 entités comme identiques. Comme dit plus haut, l'objet $scope n'arrête pas de faire des «aller-retour» entre le HTML et le JavaScript. Comme tous les objets, il possède des propriétés, mavariable est une de ses propriétés d'où la notation pointée : «$scope.mavariable». Si vous avez un peu de mal avec tout cela, pour simplifier les choses, dites-vous que si l'on a {{mavariable du côté HTML on devra avoir $scope.mavariable du côté JavaScript et que tout changement au niveau $scope.mavariable entraînera un changement au niveau de {{mavariable (et vis versa dans d'autres situations). En vous aidant des explications qui viennent d'être fournies, décrire le résultat attendu si vous ouvrez le fichier ex1.html avec un navigateur internet (Firefox, Chrome...)... Vérifiez votre hypothèse Manipulons des objets Il est possible de manipuler des objets avec AngularJS code HTML ex 2.html <!doctype html> <html lang="fr"> <head> <meta Charest="UTF-8"> <title>test AngularJS</title> <script src="lib/angular.min.js"></script> <script src="javascript/ex2.js"></script> </head> <body ng-app ng-controller="moncontrol"> <h1>fiche d'identité n {{infoperso.id</h1> <p>nom : {{infoperso.nom</p> <p>prénom : {{infoperso.prenom</p> <p>date de Naissance : {{infoperso.datenaissance</p> </body> </html> code JavaScript ex 2.js mafiche={ id : "7845", nom :"Durand", prenom :"Jean-Pierre", datenaissance :"17/08/1967" function moncontrol($scope){ $scope.infoperso=mafiche;

7 Cet exemple ne devrait vous poser de difficulté. Au lieu d'une «simple» variable, nous manipulons ici un objet (infoperso côté HTML et $scope.infoperso côté serveur). Ici aussi, le contrôleur (la fonction moncontrol) ne comporte qu'une ligne : «$scope.infoperso=mafiche;» Pour comprendre l'utilité de cette ligne, vous avez juste à savoir que «objet1=objet2» permet d'attribuer à objet1 toutes les propriétés d'objet2 (méthodes et attributs). Après l'exécution de la ligne «$scope.infoperso=mafiche;», infoperso se retrouve avec les attributs suivants : id, nom, prenom et date de naissance (les attributs de l'objet mafiche). Ceci explique donc les {{infoperso.id, {{infoperso.nom, {{infoperso.prenom ou encore {{infoperso.datenaissance du code HTML. En cas de difficulté, n'hésitez pas à vous replonger dans l'activité 14. Décrire le résultat attendu en cas «d'ouverture» du fichier ex2.html avec un navigateur internet (Firefox, Chrome...)... Vérifiez votre hypothèse utilisation ng-repeat ng-repeat est une directive AngularJS qui va nous permettre de dupliquer du code HTML automatiquement et surtout intelligemment. Imaginer que vous voulez afficher une liste de fruit à l'aide des balises HTML <ul> et <li> (si vous ne connaissez pas ces balises recherchez sur internet des informations à leur sujet). Nous aurions ce genre de code : <ul> <li>banane</li> <li>pomme</li> <li>ananas</li> <li>pêche</li> <li>fraise</li> </ul> Cela peut vite devenir rébarbatif... Grâce à la directive ng-repeat et à un tableau JavaScript contenant cette liste de fruits (mesfruitstab=[''banane'', ''pomme'', ''ananas'','' pêche'',''fraise'']), il va être possible d'écrire beaucoup moins de code HTML. code HTML ex 3.html <!doctype html> <html lang="fr"> <head> <meta Charest="UTF-8"> <title>test AngularJS</title> <script src="lib/angular.min.js"></script> <script src="javascript/ex3.js"></script> </head> <body ng-app ng-controller="moncontrol"> <h1>voici ma liste de fruits</h1> <ul> <li ng-repeat="fruit in mesfruits">{{fruit</li> </ul> </body> </html> code JavaScript ex 3.js var mesfruitstab=["banane","pomme", "ananas","pêche","fraise"] ; function moncontrol($scope){ $scope.mesfruits=mesfruitstab;

8 NB : il aurait été possible d'écrire directement : «$scope.mesfruits=["banane","pomme", "ananas","pêche","fraise"] ;» sans passer par l'intermédiaire de «mesfruitstab» ng-repeat va permettre de répéter la balise <li> autant de fois nécessaire pour que tous les éléments du tableau «mesfruits» soit traités. {{fruit sera successivement remplacé par banane, pomme, ananas, pêche et fraise. Si l'on a : <mabalise ng-repeat="mavariable in montableau">{{mavariable</mabalise> avec montableau=[element1,element2,element3] Le code HTML généré par AngularJS sera : <mabalise>element1</mabalise> <mabalise>element2</mabalise> <mabalise>element3</mabalise> Décrire le résultat attendu en cas «d'ouverture» du fichier ex3.html avec un navigateur internet (Firefox, Chrome...)... : mini-projet 1 Il est possible d'avoir un tableau contenant des objets : montableau=[ {id : "7845", nom :"Durand", prenom :"Jean-Pierre", datenaissance :"17/08/1967", {id : "6578", nom :"Dupond", prenom :"Gérard", datenaissance :"23/04/1984", {id : "9876", nom :"Robert", prenom :"Gabriel", datenaissance :"21/02/1991" ] Reprenez l'exemple traité dans l'exemple 2 (affichage d'une fiche de renseignements personnels). Sauf que cette fois ci, vous devrez produire du code permettant d'afficher les 3 fiches de renseignements les unes sous les autres :

9 Des images avec ng-src Les objets peuvent aussi contenir des URL, notamment des URL d'images. Voici un autre exemple illustrant la directive ng-src : Testez et étudiez attentivement cet exemple code HTML ex4.html <!doctype html> <html lang="fr" ng-app> <head> <meta Charest="UTF-8"> <title>ex4 AngularJS</title> <script src="lib/angular.min.js"></script> <script src="javascript/ex4.js"></script> <link rel="stylesheet" href="css/ex4.css"> </head> <body ng-controller="moncontroleur"> <h1 id="montitre">séries en série</h1> <div class="row" id="messeries" ng-repeat="serie in tabserie"> <div class="offset5 span2"><img ng-src="{{serie.urlimage"/></div> <div class="span5"> <h2>{{serie.titre</h2> <p>titre original : {{serie.titreor</p> <p>créateur(s) : {{serie.createur</p> <p>etat : {{serie.etat </div> </div> </body> </html> code JavaScript ex4.js moncontroleur=function($scope){ $scope.tabserie=[ { titre:"le Trône de fer", titreor:"game of Thrones", createur:" David Benioff et D. B. Weiss", urlimage:"image/got.jpg", etat:"en cours saison 04 diffusée au printemps 2014", { titre:"lost : Les Disparus", titreor:"lost", createur:"j. J. Abrams, Damon Lindelof et Jeffrey Lieber", urlimage:"image/lost.jpg", etat:"terminée", { titre:"homeland", titreor:"homeland", createur:"howard Gordon et Alex Gansa", urlimage:"image/homeland.jpg", etat:"en cours, saison 03 diffusée en septembre 2013" ] code CSS ex4.css bootstrap twitter + /*Ajout pour ex4*/ body{ background-color:grey; #montitre{

10 text-align:center; margin: 30px; font-size: 60px; #messeries{ margin-bottom:20px; Attention : le fichier ex4.css est composé du bootstrap twitter et du code ci-dessus. J'attire votre attention sur la balise image «<img ng-src="{{serie.urlimage"/>», l'attribut classique src ne fonctionnera pas ici (faites l'essai), il faudra donc systématiquement utiliser ng-src en lieu et place de src. Autre élément important, l'utilisation du css est quasi indispensable, ne négligez pas cet aspect des choses. Un peu d'interaction avec ng-click Grâce à ng-click il est possible de «réagir» au clic de l'utilisateur en appelant la fonction de votre choix. La balise qui aura pour attribut ng-click deviendra donc «cliquable» : soit <balise ng-click= "mafonction()">...</balise>, un clic sur le contenu de cette balise entraînera l exécution de la fonction mafonction(). code HTML ex 5.html <!doctype html> <html lang="fr"> <head> <meta Charest="UTF-8"> <title>test AngularJS</title> <script src="lib/angular.min.js"></script> <script src="javascript/ex5.js"></script> </head> <body ng-app ng-controller="moncontrol"> <button ng-click="affichage()">afficher la liste</button> <ul> <li ng-repeat="fruit in mesfruits">{{fruit</li> </ul> </body> </html> code JavaScript ex 5.js var mesfruitstab=["banane","pomme", "ananas","pêche","fraise"] ; function moncontrol($scope){ $scope.affichage=function(){ $scope.mesfruits=mesfruitstab; Décrire le résultat attendu en cas «d'ouverture» du fichier ex5.html avec un navigateur internet (Firefox, Chrome...)... Vérifiez votre hypothèse Plusieurs remarques sur cet exemple : les fonctions qui seront exécutées en cas de clic devront être des méthodes de l'objet $scope d'où le «$scope.affichage» nous verrons juste après une autre méthode pour faire apparaître et disparaître des éléments d'une page. Nous avons choisi un bouton comme élément «cliquable», toute autre balise peut convenir (div, a, img...) ng-show et ng-hide Il est possible de masquer le contenu d'une balise en utilisant la directive ng-show dans ladite balise :

11 <balise ng-show="isvisible">...</balise> Si dans le contrôleur (fichier JavaScript) la variable «$scope.isvisible» est égale à true, le contenu de la balise sera visible, si «$scope.isvisible» est égale à false, le contenu de la balise sera invisible. La directive ng-hide fonctionne exactement de la même façon, mais «à l'envers» (visible si false et invisible si true). Je précise que le nom choisi «isvisible» est arbitraire, vous pouvez choisir le nom qui vous convient. code HTML ex6.html <!doctype html> <html lang="fr"> <head> <meta Charest="UTF-8"> <title>test AngularJS</title> <script src="lib/angular.min.js"></script> <script src="javascript/ex6.js"></script> </head> <body ng-app ng-controller="moncontrol"> <button ng-click="affichage()">cliquez ici</button> <ul ng-show="visible"> <li ng-repeat="fruit in mesfruits">{{fruit</li> </ul> </body> </html> code JavaScript ex6.js var mesfruitstab=["banane","pomme", "ananas","pêche","fraise"] ; function moncontrol($scope){ $scope.visible=false; $scope.mesfruits=mesfruitstab; $scope.affichage=function(){ if ($scope.visible==false){ $scope.visible=true; else{ $scope.visible=false; Décrire le résultat attendu en cas «d'ouverture» du fichier ex6.html avec un navigateur internet (Firefox, Chrome...)... la balise input et la directive ng-model Les sites n'utilisant pas, à un moment ou à un autre, la balise input sont très rares. AngularJS va énormément simplifier la gestion des données entrées par le visiteur du site. La directive ng-model pourra être associé à une balise input : <input type="text" ng-model="mavaleur"> Les données entrées par l'utilisateur du site pourront être récupérées dans un contrôleur JavaScript ($scope.mavaleur). code HTML ex 7.html <!doctype html> <html lang="fr"> <head> <meta Charest="UTF-8"> <title>test AngularJS</title> <script src="lib/angular.min.js"></script>

12 <script src="javascript/ex7.js"></script> </head> <body ng-app ng-controller="moncontrol"> <h1>ma liste de fruits</h1> <form> <p>ajouter un fruit: <input type="text" ng-model="monfruit"/></p> <button ng-click="ajout()">valider</button> </form> <ul> <li ng-repeat="fruit in mesfruits">{{fruit</li> </ul> </body> </html> code JavaScript ex 7.js var mesfruitstab=[] ; function moncontrol($scope){ $scope.mesfruits=mesfruitstab; $scope.ajout=function(){ if ($scope.monfruit!=""){ $scope.mesfruits.push($scope.monfruit) ; $scope.monfruit=""; Décrire le résultat attendu en cas «d'ouverture» du fichier ex6.html avec un navigateur internet (Firefox, Chrome...)... : miniprojet 2 Vous êtes chargé de mettre en place une application de saisie des nouveaux élèves dans un lycée. Votre application devra proposée un formulaire de saisi avec : le nom le prénom la date de naissance la classe (choisir une classe parmi une liste : utilisation de la balise select) La validation du formulaire devra se faire par l'intermédiaire d'un bouton. Les élèves nouvellement saisis devront apparaître sur la page au fur et à mesure de la saisie. Checkbox Il est possible d'utiliser une checkbox (balise input avec un «type="checkbox"») <input type="checkbox" ng-model="checked"/> Si la checkbox est cochée, on aura alors checked=true si elle est décochée on aura checked=false (vous pouvez utiliser un autre nom que «checked» pour la variable. Inventez un exemple utilisant le type «checkbox» et la directive ng-model qui va avec. Vous êtes bien sûr autorisé à utiliser d'autres éléments de votre choix. Les filtres AngularJS prévoit l'application de filtres qui permet de sélectionner ou de mettre en forme l'information. Nous allons ici voir un exemple de l'utilisation des filtres. En ajoutant un filtre à une directive ng-repeat, seuls les éléments correspondant au filtre seront affichés.

13 Voici la façon de procéder : ng-repeat="x in tab filter:mavariable" sans le filtre toutes les valeurs contenues dans la tableau tab seront affichées. Avec le filtre seule la valeur correspondant à mavariable sera affichée (à condition bien sûr que cette valeur se trouve dans le tableau) code HTML ex 8.html <!doctype html> <html lang="fr"> <head> <meta Charest="UTF-8"> <title>test AngularJS</title> <script src="lib/angular.min.js"></script> <script src="javascript/ex8.js"></script> </head> <body ng-app ng-controller="moncontrol"> <h1>ma liste de fruits</h1> <form> <p>rechercher un fruit <input type="text" ng-model="recherche"/></p> </form> <ul> <li ng-repeat="fruit in mesfruits filter:recherche">{{fruit</li> </ul> </body> </html> code JavaScript ex 8.js var mesfruitstab=["banane","pomme","fraise","kiwi","pêche","cerise","nectarine", "noix","framboise","noisette","raisin"]; function moncontrol($scope){ $scope.mesfruits=mesfruitstab; Décrire le résultat attendu en cas «d'ouverture» du fichier ex6.html avec un navigateur internet (Firefox, Chrome...)... Il existe d'autres filtres, je vous invite à consulter la documentation officielle :

14 2 e partie : nodejs et AngularJS notion de client-serveur

15 Notion de client-serveur Que se passe-t-il lorsque vous tapez dans la barre d'adresse de votre navigateur «http://www.google.fr»? Votre ordinateur (que l'on appellera le client) va chercher à entrer en communication avec un autre ordinateur (que l'on appellera le serveur) se trouvant probablement à des milliers de kilomètres de chez vous. Pour pouvoir établir cette communication, il faut bien sûr que les 2 ordinateurs : le client et le serveur soient «reliés», on dira que nos 2 ordinateurs sont en réseau. Il existe énormément de réseaux, certains réseaux sont reliés à d'autres réseaux qui sont eux-mêmes reliés à d'autres réseaux...ce qui forme «des réseaux de réseaux de réseaux...». Savez-vous comment on appelle cet assemblage multiple de réseaux? Internet! Mon but ici n'est pas de vous expliquez comment font les ordinateurs pour se trouver dans cet «amas de réseaux», si ce sujet vous intéresse, vous rencontrerez certains termes, comme : «serveur DNS», «routeur», «adresse IP», «routage»... En tapant «http://www.google.fr», votre machine va chercher à entrer en communication avec le serveur portant le nom «www.google.fr» (en faite c'est plus compliqué, pour les puristes nous dirons donc que la communication va être établie avec le serveur www du domaine google.fr, mais bon, pour la suite nous pourrons nous contenter de l'explication «simplifiée»). Une fois la liaison établie, le client et le serveur vont échanger des informations en dialoguant : client : bonjour (ou bonjour www se trouvant dans le domaine google.fr), pourrait tu m'envoyer le code html contenu dans le fichier index.html serveur : OK, voici le code html demandé client : je constate que des images, du code css et du code JavaScript sont utilisés, peux-tu me les envoyer serveur : OK, les voici Évidemment ce dialogue est très imagé, mais il porte tout de même une part de «vérité». J'espère que vous commencez à comprendre les termes client (celui qui demande quelque chose) et serveur (celui qui fournit ce qui a été demandé). et le HTTP? Nous venons de voir que les ordinateurs communiquent entre eux. Pour ce faire, ils utilisent ce que l'on appelle des protocoles. Selon Wikipedia, dans le cas général, protocole : On nomme protocole les conventions qui facilitent une communication sans faire directement partie du sujet de la communication elle-même. En électronique et en informatique (toujours selon Wikipedia) : un protocole de communication est un ensemble de contraintes permettant d'établir une communication entre deux entités (dans le cas qui nous intéresse 2 ordinateurs) Pour que la communication soit possible, le client et le serveur doivent avoir des règles communes, ces règles sont définies dans un protocole. Comme vous l'avez sans doute deviné, le protocole de communication employé ici se nomme HTTP. Le protocole HTTP (HyperText Transfer Protocol) a été inventé par Tim Berners-Lee ( ) au début des années Tim Berners-Lee est aussi à l'origine du langage HTML et des «adresses web». C'est la combinaison de ces 3 éléments (HTTP, HTML, «adresse web») que l'on nomme aujourd'hui le «web» («web» qu'il ne faut pas confondre avec l'internet, même si le web utilise l'internet). Le HTTP va permettre au client d'effectuer des requêtes à destination d'un serveur. En retour, le serveur va envoyer une réponse. Voici une version simplifiée de la composition d'une requête : la méthode employée pour effectuer la requête l'url de la ressource la version du protocole utilisé par le client (souvent HTTP 1.1) le navigateur employé (Firefox, Chrome) et sa version le type du document demandé (par exemple HTML)

16 .. Certaines de ces lignes sont optionnelles. Voici un exemple de requête HTTP (la méthode, l'url et la version du protocole se trouvent sur la première ligne) : GET /mondossier/monfichier.html HTTP/1.1 User-Agent : Mozilla/5.0 Accept : text/html Revenons uniquement sur 2 aspects (si nécessaire nous reviendrons sur les autres plus tard) : la méthode employée et l'url. Les méthodes des requêtes HTTP Une requête HTTP utilise une méthode (c'est une commande qui demande au serveur d'effectuer une certaine action). Voici la liste des méthodes disponibles : GET, HEAD, POST, OPTIONS, CONNECT, TRACE, PUT, PATCH, DELETE Détaillons 4 de ces méthodes : GET : C'est la méthode la plus courante pour demander une ressource. Elle est sans effet sur la ressource. POST : Cette méthode est utilisée pour soumettre des données en vue d'un traitement (côté serveur). Typiquement c'est la méthode employée lorsque l'on envoie au serveur les données issues d'un formulaire (balise <form>, nous aurons l'occasion de voir des exemples plus tard). DELETE : Cette méthode permet de supprimer une ressource sur le serveur. PUT : Cette méthode permet de modifier une ressource sur le serveur L'URL (et l'uri) Une URI (Uniform Ressource Identifier) permet d'identifier une ressource sur un réseau, une URL est un cas particulier d'uri. Nous ne nous attarderons pas sur les subtiles différences entre une URI et une URL et à partir de maintenant je parlerai exclusivement d'url (par souci de simplification). L'URL indique «l'endroit» où se trouve une ressource sur le serveur. Un fichier peut se trouver dans un dossier qui peut lui-même se trouver dans un autre dossier...on parle d'une structure en arborescence, car elle ressemble à un arbre à l'envers : Comme vous pouvez le constater, la base de l'arbre s'appelle la racine de l'arborescence et se représente par un / Chemin absolu ou chemin relatif? Pour indiquer la position d'un fichier (ou d'un dossier) dans l'arborescence, il existe 2 méthodes : indiquer un chemin absolu ou indiquer un chemin relatif. Le chemin absolu doit indiquer «le chemin» depuis la racine. Par exemple l'url du fichier fichier3.txt sera : /dossier2/dossier3/fichier3.jpg

17 Remarquez que nous démarrons bien de la racine / (attention les symboles de séparation sont aussi des /) Imaginons maintenant que le fichier fichier1.css fasse appel au fichier fichier3.jpg (comme un fichier HTML peut faire appel à un fichier CSS ou JavaScript). Il est possible d'indiquer le chemin non pas depuis la racine, mais depuis le dossier (dossier2) qui accueille le fichier1.css, nous parlerons alors de chemin relatif : dossier3/fichier3.jpg Remarquez l absence du / au début du chemin (c'est cela qui nous permettra de distinguer un chemin relatif et un chemin absolu). Imaginons maintenant que nous désirions indiquer le chemin relatif du fichier fichier1.txt depuis le dossier dossier4. Comment faire? Il faut «reculer» d'1 «cran» dans l'arborescence (pour se retrouver dans le dossier dossier2 et ainsi pouvoir repartir vers la bonne «branche». Pour ce faire il faut utiliser 2 points :..../dossier2/fichier3.jpg Il est tout à fait possible de remonter de plusieurs «crans» :../../ depuis le dossier dossier4 permet de «retourner» à la racine. Remarque : la façon d'écrire les chemins (avec des slash (/) comme séparateurs) est propre aux systèmes dits «UNIX», par exemple GNU/Linux ou encore Mac OS. Sous Windows, ce n'est pas le slash qui est utilisé, mais l'antislash (\). Pour ce qui nous concerne ici : les chemins réseau (et donc le web), pas de problème, c'est le slash qui est utilisé. Réponse du serveur à une requête HTTP Une fois la requête reçue, le serveur va renvoyer une réponse, voici un exemple de réponse du serveur : HTTP/ OK Date: Thu, 15 feb :02:32 GMT Server: Apache/ (Debian GNU/Linux) DAV/2 SVN/1.1.4 Connection: close Transfer-Encoding: chunked Content-Type: text/html; charset=iso <!doctype html> <html lang="fr"> <head> <meta Charest="utf-8"> <title>voici mon site</title> </head> <body> <h1>hello World! Ceci est un titre</h1> <p>ceci est un <strong>paragraphe</strong>. Avez-vous bien compris?</p> </body> </html> Nous n'allons pas détailler cette réponse, voici quelques explications sur les éléments qui nous seront indispensables par la suite : Commençons par la fin : le serveur renvoie du code HTML, une fois ce code reçu par le client, il est interprété par le navigateur qui affiche le résultat à l'écran. Cette partie correspond au corps de la réponse. La 1re ligne se nomme la ligne de statut : HTTP/1.1 : version de HTTP utilisé par le serveur 200 : code indiquant que le document recherché par le client a bien été trouvé par le serveur. Il existe d'autres codes dont un que vous connaissez peut-être déjà : le code 404 qui signifie : «Le document recherché n'a pu être trouvé». Les 5 lignes suivantes constituent l'en-tête de la réponse, une ligne nous intéresse plus particulièrement : «Server: Apache/ (Debian GNU/Linux)». Les serveurs HTTP Il existe différents types de serveur capable de répondre à des requêtes HTTP (on les appelle serveurs HTTP ou encore serveur web). Que faut-il pour constituer un serveur web? un ordinateur (souvent ce sont des machines spécialisées : elles sont conçues pour fonctionner 24h/24h..., mais il est possible d'utiliser un ordinateur «classique» (surtout si votre but est uniquement de faire des tests).

18 un système d'exploitation : Les distributions GNU/Linux sont, pour différentes raisons, à privilégier. Dans la réponse HTTP que nous avons étudiée ci-dessus, le serveur fonctionne sous une distribution GNU/Linux dénommée Debian (mais ici aussi, si vous êtes sous Windows, il est tout de même possible de mettre en place un serveur web). Un logiciel destiné à recevoir les requêtes HTTP et à fournir des réponses. Un des logiciels les plus «populaires» se nomme Apache (il équipe plus de la moitié de serveur web en activité dans le monde!), mais il en existe d'autres : nginx, lighttpd...(j'ai volontairement choisi d'évoquer uniquement les solutions «libres», mais vous devez savoir qu'il existe aussi des solutions «propriétaires», si c'est 2 termes vous sont inconnus, il serait bon de rechercher leur signification). Les langages côté serveur Il y a quelques années, le web était dit «statique» : le concepteur de site web écrivait son code HTML et ce code était simplement envoyé par le serveur au client. Les personnes qui consultaient le site avaient toutes le droit à la même page, le web était purement «consultatif» (nous étions encore très loin des «single page application» que nous verrons plus tard). Les choses ont ensuite évolué : les serveurs sont aujourd'hui capables de générer eux même du code HTML. Les résultats qui s'afficheront à l'écran dépendront donc des demandes effectuées par l'utilisateur du site : le web est devenu dynamique. Différents langages de programmation peuvent être utilisés «côté serveur» afin de permettre au serveur de générer lui même le code HTML à envoyer. Le plus utilisé encore aujourd'hui se nomme PHP (PHP Hypertext Preprocessor : c'est un acronyme récursif comme GNU qui signifie GNU's Not Unix). Nous n'utiliserons pas PHP, je n'insisterai donc pas sur ce sujet. D'autres langages sont utilisables côté serveur (pour permettre la génération dynamique de code HTML), voici un liste non exhaustive : Java, Python, ASP... J'ai volontairement omis un langage : le JavaScript. L'utilisation du JavaScript côté serveur est relativement récente, mais se développe à vitesse grand V. Pour ne pas partir avec de fausses idées en tête, vous devez bien comprendre que nous allons parler de JavaScript qui s exécute sur le serveur. Quand vous associez une page HTML avec un script JavaScript (à l'aide de la balise <script>), ce script est bien stocké sur le serveur, mais il est envoyé au client (par l'intermédiaire d'une requête HTTP) afin d'être exécuté. Attention à ne pas confondre le JavaScript exécuté côté client (par le navigateur) et le JavaScript exécuté côté serveur. Et nodejs fût... Comme je viens de vous le rappeler, jusqu'à une époque récente, le JavaScript était uniquement destiné à être exécuté sur le client. Pour être plus précis, tous les navigateurs web (Firefox, Chrome, Opéra...) sont «équipés» d'un moteur JavaScript. Ce moteur JavaScript a pour but d'interpréter le code et d'afficher le résultat dans le navigateur. Le moteur du navigateur made in Google, Chrome, se nomme V8. Ryan Dahl a décidé, en 2009, d'utiliser le moteur V8 afin de permettre l'exécution de JavaScript côté serveur (c'est à dire sans utiliser de navigateur web) : nodejs était né! Je précise que nodejs n'est ni le premier, ni le seul à proposer du JavaScript côté serveur, mais force et de constater qu'aujourd'hui c'est lui qui à le vent en poupe. Précisons une chose : nodejs n'est pas un serveur web (comme Apache par exemple), c'est juste une plateforme permettant d exécuter du JavaScript. Avec nodejs nous allons devoir programmer notre serveur web! Installation de nodejs et programmation d'un serveur web Il existe beaucoup de tutoriaux qui décrivent l'installation de nodejs sur les plateformes «classiques» (GNU/linux, windows ou encore Mac OS). Je vous propose le tutoriel de Mathieu Nebra sur le site du zéro : Une fois l'installation terminée, ouvrez une console (aussi appelé terminal) et tapez «node -v». Si votre installation s est bien passée, vous devriez voir la version de nodejs s'afficher dans la console. Quelle est la version de nodejs que vous allez utiliser?... Nous allons écrire notre premier programme avec nodejs. Vous allez créer un dossier dans l'endroit de votre choix et créer un fichier JavaScript vierge. Il existe de nombreux modules «livrés» d'office avec nodejs, parmi ceci nous allons utiliser le module http.

19 Saisissez le code suivant dans le fichier que vous venez de créer et enregistrez-le (vous nommerez ce fichier ex9.js) code JavaScript (nodejs) ex9.js var http = require('http'); var serveur = http.createserver(function(req, res) { res.writehead(200, {"Content-Type": "text/html"); res.write('<!doctype html>' +'<html lang="fr">' +'<head>' +'<meta Charest="utf-8">' +'<title>nodejs</title>' +'</head>' +'<body>' +'<h1>hello World! Ceci est un titre</h1>' +'<p>ceci est un <strong>paragraphe</strong>.</p>' +'</body>' +'</html>'); res.end(); ); serveur.listen(8080); En utilisant la console, placez-vous dans le dossier qui accueille le fichier ex9.js (n'oubliez pas les antislashs si vous êtes sous Windows). Entrez dans la console : «node ex9.js» Sans fermer la console, ouvrez un navigateur web, dans la barre d'adresse, tapez : «localhost:8080» Normalement notre page web devrait s'afficher. Quelques explications s'imposent : Depuis le début de la deuxième partie, j'insiste sur le fait que la consultation d'un site internet est un échange de données entre 2 ordinateurs distants (un client et un serveur), or, ici, nous n'utilisons qu'un ordinateur? Dans toute la phase de développement, il est tout à fait possible de n'utiliser qu'un seul ordinateur qui jouera à la fois (et en même temps) le rôle du client et le rôle serveur. L'exécution, dans la console, de la commande node ex9.js «démarre» le serveur, une fois le serveur démarré il «attend» les requêtes HTTP en provenance d'un client. Le navigateur web va envoyer ces requêtes au serveur. Mais comment entrer en communication avec le serveur? Il suffit d'utiliser une adresse un peu spéciale : localhost (localhost indique au navigateur web que le serveur se trouve sur la même machine que lui). Le : 8080 définie le port utilisé par le serveur. Plusieurs applications peuvent utiliser la même connexion réseau à condition de ne pas utiliser le même port (on parle aussi de socket). Ici notre serveur «écoute» et «attend» une requête HTTP sur le port 8080( nous aurions pu en choisir un autre). Passons maintenant à l'étude du code : «var http = require('http');» : nodejs possède de nombreux modules afin d'étendre ces possibilités de bases. Nous utilisons ici le module http qui permet de traiter des requêtes HTTP (et donc de développer un serveur web). Nous créons un objet (au sens programmation orientée objet, avec donc des attributs et des méthodes) que l'on nomme tout simplement http (nous aurions pu prendre un autre nom) à l'aide de l'instruction «require». La deuxième ligne est très longue, nous allons la décortiquer : «var serveur = http.createserver(...» : nous créons un objet dénommé «serveur». Pour créer cet objet, nous utilisons une méthode de l'objet http : createserver. La méthode createserver accepte un paramètre : une fonction anonyme (en JavaScript, une fonction anonyme est une fonction qui ne porte pas de nom). Quel est le rôle de cette fonction anonyme? Nous rentrons ici dans le cœur de ce qui fait nodejs : les callbacks La programmation sous nodejs est un peu particulière, tout est une question d événement. La fonction anonyme passée en paramètre de la méthode createserver sera exécutée à chaque fois que le serveur recevra une requête HTTP venant de l'extérieur, le reste du temps, notre programme passera son temps à attendre. Cette fonction anonyme est appelée «callback» de l'événement requête HTTP (je vous donne le terme, car vous le rencontrerez sans doute si vous étudiez nodejs à l'aide de ressources trouvées sur internet). Étudions maintenant cette fonction de callback : «function(req, res) { res.writehead(200, {"Content-Type": "text/html"); res.write('<!doctype html>' +'<html lang="fr">'

20 +'<head>' +'<meta Charest="utf-8">' +'<title>nodejs</title>' +'</head>' +'<body>' +'<h1>hello World! Ceci est un titre</h1>' +'<p>ceci est un <strong>paragraphe</strong>.</p>' +'</body>' +'</html>'); res.end() ;» La fonction de callback prend deux paramètres : req (pour request) et res (pour response (réponse en anglais)). req et res sont tous les deux des objets, req va nous permettre de manipuler tout ce qui touche à la requête HTTP reçue par le serveur alors que res permettra de manipuler tout ce qui touche à la réponse du serveur (il est tout à fait possible de choisir d'autres noms : le premier paramètre concernera la requête et le second la réponse). «res.writehead(200, {"Content-Type": "text/html");» : permet de «remplir» l'en tête de la réponse HTTP avec le code de retour 200 («Tout c'est bien passé») et avec le type de document renvoyé (du HTML). «res.write('<!doctype html>' +'<html lang="fr">' +'<head>' +'<meta Charest="utf-8">' +'<title>nodejs</title>' +'</head>' +'<body>' +'<h1>hello World! Ceci est un titre</h1>' +'<p>ceci est un <strong>paragraphe</strong>.</p>' +'</body>' +'</html>');» res.write permet de remplir le corps de la réponse HTTP : nous renvoyons une chaine de caractère (concaténation de plusieurs chaines de caractères) correspondant à du code HTML (j'ai placé les différentes balises les unes sous les autres afin de faciliter la lecture, sachez qu'il aurait été possible d'avoir : '<!doctype html><html lang="fr"><head>...</html>'. C'est moins lisible, mais cela évite les concaténations). «res.end() ;» : permet de terminer notre réponse HTTP avant son envoi vers le client. Cette notion de fonction de callback est fondamentale pour la suite, si vous avez du mal, n'hésitez pas à poser des questions avant d'aller plus loin. Il nous reste une dernière ligne à étudier : «serveur.listen(8080);». On applique la méthode listen à l'objet «serveur» (objet qui a été créé à l'aide de la méthode createserver), cette méthode «met en route le serveur» et lui indique le port sur lequel il doit «écouter» afin de recevoir les requêtes HTTP. Cet exemple fonctionne, mais il peut satisfaisant! Allons-nous nous amuser à mettre du code HTML dans notre fichier JavaScript? Bien sûr que non, pour faciliter les choses nous allons utiliser un framework de nodejs : express. expressjs ExpressJS (http://expressjs.com/) est un module pour nodejs développé, entre autres, par Tj Holowaychuk. Nous n'allons utiliser qu'une petite partie des possibilités de ce framework. ExpressJS n'est pas intégré par défaut à nodejs, il faut l'installer à l'aide de l'outil npm «node packaged modules». À l'aide de la console, placez-vous dans le dossier qui va accueillir votre fichier JavaScript (côté serveur), puis tapez : npm install express Cela devrait créer un nouveau dossier (node_modules). Si vous changez de dossier de travail, il faudra réinstaller express (chaque dossier contient sa propre installation d'express). Passons au premier exemple : Coder les 2 fichiers suivants (ex10.html devra se trouver dans un sous-dossier app) code JavaScript (nodejs) ex10.js var express = require('express'); var app = express();

Activité sur Meteor. Annexe 1 : notion de client-serveur et notion de base de données

Activité sur Meteor. Annexe 1 : notion de client-serveur et notion de base de données Activité sur Meteor Annexe 1 : notion de client-serveur et notion de base de données Notion de client-serveur Que se passe-t-il lorsque vous tapez dans la barre d'adresse de votre navigateur «http://www.google.fr»?

Plus en détail

Symfony 2. 1.Définition de symfony 2. 2.Installation. 3.Structure. 4.Symfony et les commandes

Symfony 2. 1.Définition de symfony 2. 2.Installation. 3.Structure. 4.Symfony et les commandes Symfony 2 Sommaire : 1.Définition de symfony 2 2.Installation 3.Structure 4.Symfony et les commandes 5.Le fonctionnement : le routeur (les url), les bundles, twig(templates) 6.L architecture de symfony2

Plus en détail

Le langage PHP permet donc de construire des sites web dynamiques, contrairement au langage HTML, qui donnera toujours la même page web.

Le langage PHP permet donc de construire des sites web dynamiques, contrairement au langage HTML, qui donnera toujours la même page web. Document 1 : client et serveur Les ordinateurs sur lesquels sont stockés les sites web sont appelés des serveurs. Ce sont des machines qui sont dédiées à cet effet : elles sont souvent sans écran et sans

Plus en détail

Création d un catalogue en ligne

Création d un catalogue en ligne 5 Création d un catalogue en ligne Au sommaire de ce chapitre Fonctionnement théorique Définition de jeux d enregistrements Insertion de contenu dynamique Aperçu des données Finalisation de la page de

Plus en détail

INTERNET est un RESEAU D ORDINATEURS RELIES ENTRE EUX A L ECHELLE PLANETAIRE. Internet : interconnexion de réseaux (anglais : net = réseau)

INTERNET est un RESEAU D ORDINATEURS RELIES ENTRE EUX A L ECHELLE PLANETAIRE. Internet : interconnexion de réseaux (anglais : net = réseau) CS WEB Ch 1 Introduction I. INTRODUCTION... 1 A. INTERNET INTERCONNEXION DE RESEAUX... 1 B. LE «WEB» LA TOILE, INTERCONNEXION DE SITES WEB... 2 C. L URL : LOCALISER DES RESSOURCES SUR L INTERNET... 2 D.

Plus en détail

Création d'un site dynamique en PHP avec Dreamweaver et MySQL

Création d'un site dynamique en PHP avec Dreamweaver et MySQL Création d'un site dynamique en PHP avec Dreamweaver et MySQL 1. Création et configuration du site 1.1. Configuration de Dreamweaver Avant de commencer, il est nécessaire de connaître l'emplacement du

Plus en détail

Personnaliser et adapter SPIP Développeur SPIP

Personnaliser et adapter SPIP Développeur SPIP Personnaliser et adapter SPIP Développeur SPIP En Théorie Le fonctionnement de SPIP Qu est ce que SPIP? SPIP (Système de Publication pour l Internet Partagé) est un logiciel libre destiné à la production

Plus en détail

Crédit : Joyent, Inc. Cécile HARDEBOLLE cecile.hardebolle@supelec.fr

Crédit : Joyent, Inc. Cécile HARDEBOLLE cecile.hardebolle@supelec.fr Crédit : Joyent, Inc. Cécile HARDEBOLLE cecile.hardebolle@supelec.fr Prérequis PraDque de JavaScript Compréhension de l'architecture client- serveur web rôle du client vs. rôle du serveur protocole HTTP

Plus en détail

25 mars. Tutoriel sur Laravel. Préparé par : Lydiane Beaulne-Bélisle. Ceci est un tutorial qui montre comment débuter avec le Framework PHP Laravel.

25 mars. Tutoriel sur Laravel. Préparé par : Lydiane Beaulne-Bélisle. Ceci est un tutorial qui montre comment débuter avec le Framework PHP Laravel. 25 mars Tutoriel sur Laravel Préparé par : Lydiane Beaulne-Bélisle Ceci est un tutorial qui montre comment débuter avec le Framework PHP Laravel. Créé pour le cours de Projet de fin d étude Collège de

Plus en détail

WINDOWS SERVER 2003 ADMINISTRATION A DISTANCE

WINDOWS SERVER 2003 ADMINISTRATION A DISTANCE 1. Introduction WINDOWS SERVER 2003 ADMINISTRATION A DISTANCE En règle générale, les administrateurs ne travaillent pas en salle serveurs. Et cette dernière peut se trouver n'importe où dans le bâtiment.

Plus en détail

1 sur 5 10/06/14 13:10

1 sur 5 10/06/14 13:10 Time Machine est un outil proposé par Mac OS depuis sa version 10.5 (Leopard) et qui permet d'effectuer des sauvegardes de votre disque dur de manière régulière. Mais au-delà de la simple sauvegarde périodique,

Plus en détail

Plan du travail. 2014/2015 Cours TIC - 1ère année MI 86

Plan du travail. 2014/2015 Cours TIC - 1ère année MI 86 Plan du travail Chapitre 1: Internet et le Web Chapitre 2: Principes d Internet Chapitre 3 : Principaux services d Internet Chapitre 4 : Introduction au langage HTML 2014/2015 Cours TIC - 1ère année MI

Plus en détail

Pré-requis pour une utilisation efficace et sécurisée du web

Pré-requis pour une utilisation efficace et sécurisée du web Pré-requis pour une utilisation efficace et sécurisée du web Dominique Lachiver Paternité - Pas d'utilisation Commerciale - Partage des Conditions Initiales à l'identique : http://creativecommons.org/licenses/by-nc-sa/4.0/fr/

Plus en détail

I - à la découverte de php

I - à la découverte de php Cours PHP, By TR@PC0D13N Site Web : http://trapcodien.free.fr E-Mail : trapcodien@hotmail.fr Bonjour à tous, aujourd'hui j'ai décidé de commencer à rédiger un tutoriel sur le langage web PHP. Dans cette

Plus en détail

Installation locale de JOOMLA SEPIA

Installation locale de JOOMLA SEPIA FOAD TICE Installation locale de JOOMLA SEPIA Académie de Reims FRANÇOIS PALLUT Paternité - Pas d'utilisation Commerciale - Partage des Conditions Initiales à l'identique : http://creativecommons.org/licenses/by-nc-sa/2.0/fr/

Plus en détail

Tutoriel. ThunderBird. Page 1 / 10

Tutoriel. ThunderBird. Page 1 / 10 Tutoriel ThunderBird Page 1 / 10 1. Les Préalables Munissez-vous de vos paramètres de compte mail (L'adresse email, l'identifiant de connexion, le mot de passe, serveur POP, serveur SMTP ). Vous les trouverez

Plus en détail

Naviguer CHARGER ET QUITTER INTERNET EXPLORER

Naviguer CHARGER ET QUITTER INTERNET EXPLORER Naviguer UTILISER UN NAVIGATEUR CHARGER ET QUITTER INTERNET EXPLORER Pour pouvoir travailler avec votre application Internet Explorer il est indispensable de l'ouvrir. Pour réaliser cette opération plusieurs

Plus en détail

jquery Mobile La bibliothèque JavaScript pour le Web mobile Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2

jquery Mobile La bibliothèque JavaScript pour le Web mobile Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2 jquery Mobile La bibliothèque JavaScript pour le Web mobile É r i c S a r r i o n Avec la contribution de Thomas Ber tet Groupe Eyrolles, 2012, ISBN : 978-2-212-13388-2 1 Installation de jquery Mobile

Plus en détail

Administration du site (Back Office)

Administration du site (Back Office) Administration du site (Back Office) A quoi sert une interface d'administration? Une interface d'administration est une composante essentielle de l'infrastructure d'un site internet. Il s'agit d'une interface

Plus en détail

Programmation WEB. Introduction à Node.js. Programmation licence. IUT de Fontainebleau

Programmation WEB. Introduction à Node.js. Programmation licence. IUT de Fontainebleau Introduction à Node.js IUT de Fontainebleau 4 juin 2015 1 Introduction 2 3 4 5 Sommaire Introduction 1 Introduction 2 3 4 5 Nodejs? Introduction Ce n est pas un framework! Programme (environnement) créé

Plus en détail

DÉMARRAGE RAPIDE. Présentation et installation de NetStorage

DÉMARRAGE RAPIDE. Présentation et installation de NetStorage Novell NetStorage www.novell.com DÉMARRAGE RAPIDE Présentation et installation de NetStorage Novell NetStorage est une fonction de NetWare 6 qui permet d'accéder facilement, via Internet, au système de

Plus en détail

Gérer des sites avec Dreamweaver

Gérer des sites avec Dreamweaver Gérer des sites avec Dreamweaver La boîte de dialogue Gérer les sites a pour fonction de vous permettre de créer un nouveau site, de modifier, de dupliquer, de supprimer un site, d'importer ou d'exporter

Plus en détail

WEBMESTRE : CONCEPTION DE SITES ET ADMINISTRATION DE SERVEURS WEB

WEBMESTRE : CONCEPTION DE SITES ET ADMINISTRATION DE SERVEURS WEB WEBMESTRE : CONCEPTION DE SITES ET ADMINISTRATION DE SERVEURS WEB Installation et administration d un serveur web Module 25793 TP A5 (1/2 valeur) Chapitre 1 Fonctionnalités d un serveur web, le protocole

Plus en détail

ESPACE PRIVÉ POUR LE STOCKAGE TEMPORAIRE ET LE TRANSFERT DE FICHIERS COMMENT TÉLÉCHARGER UN FICHIER VERS VOTRE ORDINATEUR EN UTILISANT UN

ESPACE PRIVÉ POUR LE STOCKAGE TEMPORAIRE ET LE TRANSFERT DE FICHIERS COMMENT TÉLÉCHARGER UN FICHIER VERS VOTRE ORDINATEUR EN UTILISANT UN TABLE DES MATIERES : Comment télécharger un fichier vers votre ordinateur en utilisant un navigateur...1 Comment déposer de 1 à 3 fichiers sur l'espace privé en utilisant un navigateur...2 Comment transférer

Plus en détail

INSTALLATION D'UN SERVEUR FTP, DEFINITION D'UN NOM DE DOMAINE

INSTALLATION D'UN SERVEUR FTP, DEFINITION D'UN NOM DE DOMAINE INSTALLATION D'UN SERVEUR FTP, DEFINITION D'UN NOM DE DOMAINE Table des matières i Objetcif :...2 ii Ma configuration :... 2 iii Méthodologie... 2 1 Votre mode de connexion à internet...3 1.1 Vous ne savez

Plus en détail

Je communique par email

Je communique par email Je communique par email Support de formation des Médiathèques du Pays de Romans Site Internet : Twitter : MediaTechRomans Table des matières Mes cordonnées électroniques...3 Les emails...3 Comment ça marche...3

Plus en détail

Je communique avec Skype

Je communique avec Skype Je communique avec Skype Support de formation des Médiathèques du Pays de Romans Site Internet Twitter MediaTechRomans Table des matières Présentation de Skype...2 Un logiciel pour être plus proche...

Plus en détail

Programmation Web. Madalina Croitoru IUT Montpellier

Programmation Web. Madalina Croitoru IUT Montpellier Programmation Web Madalina Croitoru IUT Montpellier Organisation du cours 4 semaines 4 ½ h / semaine: 2heures cours 3 ½ heures TP Notation: continue interrogation cours + rendu à la fin de chaque séance

Plus en détail

Module Com231A - Web et Bases de Données Notion 5 : Formulaires et utilisation des Bases de Données avec PHP

Module Com231A - Web et Bases de Données Notion 5 : Formulaires et utilisation des Bases de Données avec PHP Module Com231A - Web et Bases de Données Notion 5 : Formulaires et utilisation des Bases de Données avec PHP Au cours de ce TP, vous allez voir comment PHP permet aux utilisateurs, une interaction avec

Plus en détail

Cours WinDev Numéro 5

Cours WinDev Numéro 5 Cours WinDev Numéro 5 Objectifs : Études des Sockets, communication répartie Rappels de notions réseaux, Tcp/ip, Ports. Grâce à ce nouveau Tp nous allons rentrer dans le monde merveilleux de la communication

Plus en détail

Langages du Web. Que savez vous???

Langages du Web. Que savez vous??? Langages du Web Que savez vous??? Le WEB World Wide Web ouwww ouweb Toile d'araignée mondiale ou la toile Le Web utilise le réseau Internet pour relier des serveurs qui, grâce aux protocoles HTTP, HTTPS,

Plus en détail

CRÉATION DE SITE INTERNET TD 1

CRÉATION DE SITE INTERNET TD 1 Création de pages Internet avec le logiciel libre Nvu - 1/7 CRÉATION DE SITE INTERNET TD 1 I LANCEMENT DE NVU ET CRÉATION DU SITE. 1) Liminaire : Créez en premier, un sous-dossier consacré au travail avec

Plus en détail

Je veux un site Web. 1 : L'hébergement et la mise en ligne de pages web

Je veux un site Web. 1 : L'hébergement et la mise en ligne de pages web Je veux un site Web 1 : L'hébergement et la mise en ligne de pages web L'hébergement Pour créer un site web, il me faut un serveur, c'est à dire un ordinateur connecté en permanence à l'internet L'hébergeur

Plus en détail

Systèmes d'informations

Systèmes d'informations Systèmes d'informations C'est un ensemble d'outils pour stocker / gérer / diffuser des informations / des données Le stockage : Bases de données + SGDBR La gestion : Saisie, Mise à jour, Contrôle La diffusion

Plus en détail

ASP. Etape par étape. 1ère partie : Introduction à asp.net. (Révision : 2 du 05/11/2004 13 pages) Avertissement :

ASP. Etape par étape. 1ère partie : Introduction à asp.net. (Révision : 2 du 05/11/2004 13 pages) Avertissement : ASP Etape par étape 1ère partie : Introduction à asp.net (Révision : 2 du 05/11/2004 13 pages) Avertissement : Ce document peut comporter des erreurs. Cependant, tout a été mis en œuvre afin de ne pas

Plus en détail

Premières applications. Web 2.0. avec Ajax et PHP. J e a n - M a r i e D e f r a n c e. Groupe Eyrolles, 2008, ISBN : 978-2-212-12090-5

Premières applications. Web 2.0. avec Ajax et PHP. J e a n - M a r i e D e f r a n c e. Groupe Eyrolles, 2008, ISBN : 978-2-212-12090-5 Premières applications Web 2.0 avec Ajax et PHP J e a n - M a r i e D e f r a n c e Groupe Eyrolles, 2008, ISBN : 978-2-212-12090-5 8 Applications Ajax-PHP synchrones Pour commencer simplement, je vous

Plus en détail

Créer un site à l aide de Google Site

Créer un site à l aide de Google Site Créer un site à l aide de Google Site N Vanassche www.nathalievanassche.be Ifosupwavre Mise en contexte www.nathalievanassche.be Blog ou Google Site? La réalisation d un blog à l aide de Blogger (non traité

Plus en détail

TD n 1 : Architecture 3 tiers

TD n 1 : Architecture 3 tiers 2008 TD n 1 : Architecture 3 tiers Franck.gil@free.fr 27/10/2008 1 TD n 1 : Architecture 3 tiers 1 INTRODUCTION Ce TD, se propose de vous accompagner durant l installation d un environnement de développement

Plus en détail

Installation de Windows 2000 Serveur

Installation de Windows 2000 Serveur Installation de Windows 2000 Serveur Introduction Ce document n'explique pas les concepts, il se contente de décrire, avec copies d'écran, la méthode que j'utilise habituellement pour installer un Windows

Plus en détail

WWW.MELDANINFORMATIQUE.COM

WWW.MELDANINFORMATIQUE.COM Solutions informatiques Procédure Sur Comment installer et configurer Filezilla FTP Client Solutions informatiques Historique du document Revision Date Modification Autor 3 2013-04-29 Creation Daniel Roy

Plus en détail

Installation et utilisation de SSH. .et

Installation et utilisation de SSH. .et Installation et utilisation de SSH.et.soumission de travail SSH est un protocole de communication qui permet de communiquer à distance entre deux ordinateurs. Pour cela, il faut qu un des deux ordinateurs

Plus en détail

ultisites S.A. module «services»

ultisites S.A. module «services» M ultisites S.A. module «services» TP N 3 : Installation du serveur WEB Nom : Prénom : Classe : Date : Appréciation : Note : Objectif : Être capable d'installer le serveur WEB, et de créer une page HTML

Plus en détail

Alfresco Mobile pour Android

Alfresco Mobile pour Android Alfresco Mobile pour Android Guide d'utilisation de l'application Android version 1.1 Commencer avec Alfresco Mobile Ce guide offre une présentation rapide vous permettant de configurer Alfresco Mobile

Plus en détail

Relever ses messages avec Thunderbird portable

Relever ses messages avec Thunderbird portable 1. Les Préalables Vous pouvez installer cette version portable sur votre ordinateur ou sur une clef usb. Munissez-vous de vos paramètres de compte mail (L'adresse email, l'identifiant de connexion, le

Plus en détail

UltraVNC, UltraVNC SC réglages et configurations

UltraVNC, UltraVNC SC réglages et configurations UltraVNC, UltraVNC SC réglages et configurations UltraVNC Serveur (réglages des paramètres d administration du module Serveur) L option «Accepte les connexions» est validée par défaut et toutes les autres

Plus en détail

Application Web et J2EE

Application Web et J2EE Application Web et J2EE Servlet, JSP, Persistence, Méthodologie Pierre Gambarotto Département Informatique et Math appli ENSEEIHT Plan Introduction 1 Introduction Objectfis

Plus en détail

Philosophie des extensions WordPress

Philosophie des extensions WordPress 8 Philosophie des extensions WordPress Le concept L une des forces de WordPress dans la jungle CMS, c est la simplicité de création d extensions. Il y a plusieurs raisons à cela. Des raisons techniques

Plus en détail

Guillaume LHOMEL Laboratoire Supinfo des Technologies Microsoft Très Bien. Tous les articles de cet auteur 40007 47/227

Guillaume LHOMEL Laboratoire Supinfo des Technologies Microsoft Très Bien. Tous les articles de cet auteur 40007 47/227 Auteur Serveur Windows 2000 dans un Réseau Macintosh Accueil > Articles > Réseau Guillaume LHOMEL Laboratoire Supinfo des Technologies Microsoft Très Bien Tous les articles de cet auteur 40007 47/227 Présentation

Plus en détail

BEP Systèmes Electroniques Industriels et Domestiques

BEP Systèmes Electroniques Industriels et Domestiques Fiche de procédure : Créer un réseau domestique sous Windows XP I) Préambule Cette fiche méthode a été créée avec l'objectif de donner aux débutants la possibilité de créer un réseau domestique sous Windows

Plus en détail

TP JAVASCRIPT OMI4 TP5 SRC1 2011-2012

TP JAVASCRIPT OMI4 TP5 SRC1 2011-2012 TP JAVASCRIPT OMI4 TP5 SRC1 2011-2012 FORMULAIRE DE CONTACT POUR PORTFOLIO PRINCIPE GENERAL Nous souhaitons réaliser un formulaire de contact comprenant les champs suivants : NOM PRENOM ADRESSE MAIL MESSAGE

Plus en détail

Architecture client/serveur

Architecture client/serveur Architecture client/serveur Table des matières 1. Principe du client/serveur...2 2. Communication client/serveur...3 2.1. Avantages...3 2.2. Inconvénients...3 3. HTTP (HyperText Transfer Protocol)...3

Plus en détail

Installation de Windows 2000 Serveur

Installation de Windows 2000 Serveur Installation de Windows 2000 Serveur Introduction Ce document n'explique pas les concepts, il se contente de décrire, avec copies d'écran, la méthode que j'utilise habituellement pour installer un Windows

Plus en détail

AJAX est l'acronyme d'asynchronous JavaScript And XML, autrement dit JavaScript Et XML Asynchrones.

AJAX est l'acronyme d'asynchronous JavaScript And XML, autrement dit JavaScript Et XML Asynchrones. Le concept d'ajax Introduction AJAX est l'acronyme d'asynchronous JavaScript And XML, autrement dit JavaScript Et XML Asynchrones. AJAX n'est ni une technologie ni un langage de programmation ; AJAX est

Plus en détail

Créer un réseau peer to peer avec windows xp

Créer un réseau peer to peer avec windows xp Créer un réseau peer to peer avec windows xp Tout d'abord avant de créer un réseau peer to peer il serait bien de connaitre son utilité: Un réseau peer to peer permet de partager des fichiers, musiques,

Plus en détail

de survie du chef de projet

de survie du chef de projet KIT de survie du chef de projet 01 1 2 3 4 5 6 04 03 07 07 03 03 LE SERVEUR LE CLIENT TECHNOLOGIE WEB CLIENT LE SERVEUR WEB TECHNIQUES & CADRE DE TRAVAIL APPLICATIONS 101 LE SERVEUR Un serveur informatique

Plus en détail

Gérer un site internet simple

Gérer un site internet simple TUTORIEL Gérer un site internet simple Pourquoi avoir un site internet? Table of Contents Table of Contents... 2 Étape 1 : créer un compte Google (Gmail)... 3 Etape 2 : créer un site internet Google...

Plus en détail

Procédure Sur Installer et configurer Filezilla-Client FTP.

Procédure Sur Installer et configurer Filezilla-Client FTP. Procédure Sur Installer et configurer Filezilla-Client FTP. Historique du document Révision Date Modification Auteur 1 2009-03-16 Création Daniel Roy INSTALLER ET CONFIGURER FILEZILLA-CLIENT FTP... 3 2

Plus en détail

INTRODUCTION CHAPITRE 1

INTRODUCTION CHAPITRE 1 CHAPITRE 1 INTRODUCTION Query, qu est-ce que c est?... 11 HTML, CSS, JavaScript, PHP : qui fait quoi?... 16 Un environnement de développement simple et gratuit... 19 Ce que vous allez apprendre... 20 9

Plus en détail

L3 informatique TP n o 2 : Les applications réseau

L3 informatique TP n o 2 : Les applications réseau L3 informatique TP n o 2 : Les applications réseau Sovanna Tan Septembre 2009 1/20 Sovanna Tan L3 informatique TP n o 2 : Les applications réseau Plan 1 Transfert de fichiers 2 Le Courrier électronique

Plus en détail

Internet statique et dynamique Programmation côté Serveur. Programmation de sites web statiques et dynamiques. Programmation côté serveur

Internet statique et dynamique Programmation côté Serveur. Programmation de sites web statiques et dynamiques. Programmation côté serveur Programmation de sites web statiques et dynamiques Programmation côté serveur Jean CARTIER MASTER INI jcartier@laposte.net 1 SOMMAIRE Internet statique et dynamique Côté Client Le HTML : Principe de fonctionnement

Plus en détail

Développement de l interface Web du projet Hôpital

Développement de l interface Web du projet Hôpital Pôle informatique 2013/2014 École Nationale Supérieure des Mines de Saint-Étienne Développement de l interface Web du projet Hôpital Antoine Zimmermann antoine.zimmermann@emse.fr Le cahier des charges

Plus en détail

Fonctionnement du Site Web Dynamique:

Fonctionnement du Site Web Dynamique: Fonctionnement du Site Web Dynamique: Site Web Dynamique: Un site Web dynamique est en faite un site Web dont les pages qu'il contient peuvent être générées dynamiquement, c'est à dire à la demande de

Plus en détail

IIS (Internet Information Services) est le serveur Web de Microsoft. Il assure les mêmes fonctions qu'un serveur Web tel qu Apache.

IIS (Internet Information Services) est le serveur Web de Microsoft. Il assure les mêmes fonctions qu'un serveur Web tel qu Apache. Projet Serveur Web I. Contexte II. Définitions On appelle serveur Web aussi bien le matériel informatique que le logiciel, qui joue le rôle de serveur informatique sur un réseau local ou sur le World Wide

Plus en détail

SQL Server 2008 Report Builder 2.0

SQL Server 2008 Report Builder 2.0 SQL Server 2008 Report Builder 2.0 Installation et utilisation de Report Builder 2.0 Dans le cadre de la création de rapports pour SQL Server Reporting Services 2008, un outil est disponible, Report Builder

Plus en détail

TP HTML n 3 : Les formulaires et le PHP

TP HTML n 3 : Les formulaires et le PHP TP HTML n 3 : Les formulaires et le PHP 1 ) Qu'est-ce qu'un formulaire? En HTML, un formulaire est un espace de saisie dans une page web, pouvant comporter plusieurs zones, ou champs : on peut y saisir

Plus en détail

À la découverte de jquery Mobile

À la découverte de jquery Mobile 1 À la découverte de jquery Mobile jquery Mobile est un ensemble de plug-ins et de widgets de jquery visant à déployer une API multiplates-formes capable de développer des applications Web mobiles. Au

Plus en détail

BTS SIO option SISR Lycée Godefroy de Bouillon Clermont-Ferrand

BTS SIO option SISR Lycée Godefroy de Bouillon Clermont-Ferrand Active Directory sous Windows Server SAHIN Ibrahim BTS SIO option SISR Lycée Godefroy de Bouillon Clermont-Ferrand Sommaire I - Introduction... 3 1) Systèmes d exploitation utilisés... 3 2) Objectifs...

Plus en détail

Installation d'un serveur DHCP sous Windows 2000 Serveur

Installation d'un serveur DHCP sous Windows 2000 Serveur Installation d'un serveur DHCP sous Windows 2000 Serveur Un serveur DHCP permet d'assigner des adresses IP à des ordinateurs clients du réseau. Grâce à un protocole DHCP (Dynamic Host Configuration Protocol),

Plus en détail

Applications orientées données (NSY135)

Applications orientées données (NSY135) Applications orientées données (NSY135) 2 Applications Web Dynamiques Auteurs: Raphaël Fournier-S niehotta et Philippe Rigaux (philippe.rigaux@cnam.fr,fournier@cnam.fr) Département d informatique Conservatoire

Plus en détail

Dropbox vous permettra de sauvegarder, partager et synchroniser vos fichiers et dossiers, extrêmement facilement et rapidement.

Dropbox vous permettra de sauvegarder, partager et synchroniser vos fichiers et dossiers, extrêmement facilement et rapidement. Définition : Dropbox vous permettra de sauvegarder, partager et synchroniser vos fichiers et dossiers, extrêmement facilement et rapidement. Le service se compose d'une application gratuite et d'une interface

Plus en détail

Ce code peut s insérer à plusieurs endroits entre les balises head (le plus souvent) ou directement à l intérieur des balises body.

Ce code peut s insérer à plusieurs endroits entre les balises head (le plus souvent) ou directement à l intérieur des balises body. A/ Utilisation de Javascript UE Libre : Internet et composition de pages Web TP n 3 Le Javascript est un langage de script incorporé dans un document HTML. Historiquement il s'agit même du premier langage

Plus en détail

Installation de Windows 2000 Serveur

Installation de Windows 2000 Serveur Installation de Windows 2000 Serveur Introduction Ce document n'explique pas les concepts, il se contente de décrire, avec copies d'écran, la méthode que j'utilise habituellement pour installer un Windows

Plus en détail

Documentation utilisateur de la plate-forme administrateur

Documentation utilisateur de la plate-forme administrateur Documentation utilisateur de la plate-forme administrateur Introduction... 2 1. Accès à la plate-forme... 2 2. Création d une barre de navigation... 3 3. Créer un nouveau menu... 4 Créer le nom d un nouveau

Plus en détail

AP4.1 : découverte de la programmation d'une application Android à l'aide du logiciel "App Inventor" Informatique

AP4.1 : découverte de la programmation d'une application Android à l'aide du logiciel App Inventor Informatique STI2D Option SIN Terminale AP4.1 : découverte de la programmation d'une application Android à l'aide du logiciel "App Inventor" Informatique Durée prévue : 6h. Problématique : réalisation d'une application

Plus en détail

Séances 4a/4b Technologies du Web

Séances 4a/4b Technologies du Web Formations en Informatique de Lille 2012/2013 Séances 4a/4b Technologies du Web février 2013 Javascript Exercice 1 : Préalable : mise en place des outils Pour ce premier exercice, nous allons utiliser

Plus en détail

Installation de Windows 2012 Serveur

Installation de Windows 2012 Serveur Installation de Windows 2012 Serveur Introduction Ce document n'explique pas les concepts, il se contente de décrire, avec copies d'écran, la méthode que j'utilise habituellement pour installer un Windows

Plus en détail

Installation des caméras IP

Installation des caméras IP Installation des caméras IP 1 Configurer la caméra La première étape consiste à connecter votre caméra sur votre réseau local. Branchez l'alimentation sur le secteur, puis branchez le connecteur sur la

Plus en détail

Tutoriel Le Web et la conception de sites

Tutoriel Le Web et la conception de sites Tutoriel Le Web et la conception de sites Éléments du Web Internet Internet est un réseau de plusieurs réseaux informatiques. L information stockée sur les ordinateurs devient accessible par les autres

Plus en détail

SPECIFICATIONS TECHNIQUES POUR LE DEVELOPPEMENT DES PLUGINS TOURISM SYSTEM CLIENT. V 1.0 27 janvier 2011

SPECIFICATIONS TECHNIQUES POUR LE DEVELOPPEMENT DES PLUGINS TOURISM SYSTEM CLIENT. V 1.0 27 janvier 2011 SPECIFICATIONS TECHNIQUES POUR LE DEVELOPPEMENT DES PLUGINS TOURISM SYSTEM CLIENT V 1.0 27 janvier 2011 Ce document présente l'utilisation des plugins dans Tourism System Client. Dans le Client, un plugin

Plus en détail

Tutoriel Drupal version 7 :

Tutoriel Drupal version 7 : Tutoriel Drupal 7: Installation en local sous Windows 1 Tutoriel Drupal version 7 : Installation en local Sous Windows Tutoriel Drupal 7: Installation en local sous Windows 2 1. Logiciels nécessaires Drupal

Plus en détail

Leçon 0 : Introduction au développement web

Leçon 0 : Introduction au développement web Module : Atelier programmation n- tiers Atelier de TP : N 0 Durée : 6h Groupes : M31- M32 Leçon 0 : Introduction au développement web NB : Ce document est un support de cours (notes de cours) : ce n'est

Plus en détail

Initiation au mail. Sommaire : 1. Qu'est-ce qu'un mail?...3 2. Deux types d'outils pour consulter ses mails...4

Initiation au mail. Sommaire : 1. Qu'est-ce qu'un mail?...3 2. Deux types d'outils pour consulter ses mails...4 Initiation au mail Sommaire : 1. Qu'est-ce qu'un mail?...3 2. Deux types d'outils pour consulter ses mails...4 2.1. Les logiciels de gestion de mail...4 2.2. Les webmails...5 3. Se connecter au webmail...6

Plus en détail

Dom, XML, Lecture de fichiers

Dom, XML, Lecture de fichiers Projet de développement web : Développement côté client Chapitre 4 Dom, XML, Lecture de fichiers Page 1 / 11 Table des matières Table des matières Introduction DOM : Document Object Model Structure habituelle

Plus en détail

TP Initiation au langage HTML

TP Initiation au langage HTML TP Initiation au langage HTML (1) Rappels de quelques généralités Un fichier HTML n'est pas compilé (ce n'est pas un programme) Un fichier HTML est un fichier texte simple, parfaitement lisible, respectant

Plus en détail

Site internet du collège Comment écrire un article?

Site internet du collège Comment écrire un article? Site internet du collège Comment écrire un article? Préambule : les rôles. L administrateur du site vous a attribué des droits. L utilisateur simple peut, par exemple, simplement commenter un article ou

Plus en détail

Tutoriel réalisé par luo. Version 1.0.0 du 22/02/14

Tutoriel réalisé par luo. Version 1.0.0 du 22/02/14 Tutoriel réalisé par luo du 22/02/14 Cette version est temporaire. De nombreuses corrections vont être effectuées dans les prochains jours. Pour toutes informations veuillez adresser un mail à l'auteur

Plus en détail

WordPress : Guide à l édition

WordPress : Guide à l édition WordPress : Guide à l édition WordPress : Guide à l édition... 1 Présentation... 2 1. Accès au site... 2 2. Le tableau de bord... 2 3. Editez les contenus... 4 Quelle est la différence entre les pages

Plus en détail

Utilisation du client de messagerie Thunderbird

Utilisation du client de messagerie Thunderbird Outlook express n existant plus sur les systèmes d exploitation sortis après Windows XP, nous préconisons désormais l utilisation du client de messagerie libre distribué gratuitement par la Fondation Mozilla.

Plus en détail

Formation PHP débutant

Formation PHP débutant Formation PHP débutant Table des matières 1 Le principe de PHP 3 1.1 Langage côté serveur.................................. 3 1.2 Pour travailler..................................... 3 1.3 Langage de pré-processing...............................

Plus en détail

B2i. LE B2i Brevet Informatique et Internet. Niveau : tous. 1 S'approprier un environnement informatique de travail. b2ico1.odt.

B2i. LE B2i Brevet Informatique et Internet. Niveau : tous. 1 S'approprier un environnement informatique de travail. b2ico1.odt. 1 S'approprier un environnement informatique de travail 1.1) Je sais m'identifier sur un réseau ou un site et mettre fin à cette identification. 1.2) Je sais accéder aux logiciels et aux documents disponibles

Plus en détail

Indications TD ENT. http://www.passwordmeter.com ou http://www.howsecureismypassword.net/ testent la résistance de votre mot de passe.

Indications TD ENT. http://www.passwordmeter.com ou http://www.howsecureismypassword.net/ testent la résistance de votre mot de passe. Ind-ENT.1 Indications TD ENT 0. Consignes Lisez la version PDF du TD et repérez les parties surlignées. Ce sont des éléments qui sont importants ou qui ont été modifiés. À vous de transcrire tout cela

Plus en détail

Configuration d'une imprimante dans le réseau EOLE +:

Configuration d'une imprimante dans le réseau EOLE +: MODULE Mise en oeuvre du serveur d'impression Préambule Vous êtes à présent en mesure d'adapter le bureau de vos utilisateurs, et de régler un certain nombre de paramètres a l'aide d'esu. Votre réseau

Plus en détail

Sujet Projets 2 nd Semestre

Sujet Projets 2 nd Semestre Sujet Projets 2 nd Semestre Seuls les appels systèmes vus en cours sont autorisés. L usage d autres fonctions doit impérativement être validé par l enseignant. La date d ouverture pour l assignation de

Plus en détail

Indicateur de stockage

Indicateur de stockage Introduction Memeo Instant Backup est une solution de sauvegarde facile pour un monde numérique compliqué. En sauvegardant automatiquement et en continu vos précieux fichiers sur votre disque C, Memeo

Plus en détail

10. Envoyer, recevoir des mails

10. Envoyer, recevoir des mails 10. Envoyer, recevoir des mails Passons maintenant à la pratique! Nous allons voir comment envoyer votre premier mail à vos contacts et en recevoir. 1. Présentation d'une messagerie de mail 1.1 vue d'ensemble

Plus en détail

Les sites Internet dynamiques. contact : Patrick VINCENT pvincent@erasme.org

Les sites Internet dynamiques. contact : Patrick VINCENT pvincent@erasme.org Les sites Internet dynamiques contact : Patrick VINCENT pvincent@erasme.org Qu est-ce qu un site Web? ensemble de pages multimédia (texte, images, son, vidéo, ) organisées autour d une page d accueil et

Plus en détail

Web et présentation d information spatiale

Web et présentation d information spatiale Université de La Rochelle LUP-SIG 2004-2005 Programmation SIG et Internet Cartographique Web et présentation d information spatiale Moteurs de recherche et formulaires HTML Jean-Michel FOLLIN jmfollin@univ-lr.fr

Plus en détail

Sommaire CONNEXION WEBMAIL... 2 1. Comment se connecter au Webmail?... 2

Sommaire CONNEXION WEBMAIL... 2 1. Comment se connecter au Webmail?... 2 Sommaire CONNEXION WEBMAIL... 2 1. Comment se connecter au Webmail?... 2 LE COURRIER... 4 CREER UN NOUVEAU MESSAGE... 4 1. Comment envoyer un mail?... 4 2. Envoi avec une pièce jointe?... 7 REPONDRE A

Plus en détail

Compte rendu de PHP MySQL : création d un formulaire de base de données

Compte rendu de PHP MySQL : création d un formulaire de base de données REVILLION Joris Décembre 2009 3EI Compte rendu de PHP MySQL : création d un formulaire de base de données Objectifs : Le principal objectif de ce cours est de découvrir et de nous familiariser avec le

Plus en détail