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

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

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

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

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

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

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

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

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

KompoZer. Td3. M r Castanet - Année scolaire 2007/2008 - page 1

KompoZer. Td3. M r Castanet - Année scolaire 2007/2008 - page 1 KompoZer Td3 M r Castanet - Année scolaire 2007/2008 - page 1 Exercice 1 Dans cet exercice, nous allons appréhender les méthodes pour transférer notre site chez un hébergeur. Mais nous déplacerons notre

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

Technologies Internet

Technologies Internet Technologies Internet Jean-François Ramiara FAD Réseau Pyramide 17/10/2012 Toulouse 1 Sommaire Internet Les origines d'internet Caractéristiques d'internet Les protocoles Les adresses IP Les noms de domaine

Plus en détail

Activité - Serveur sous Linux Suse

Activité - Serveur sous Linux Suse Activité - Serveur sous Linux Suse Configuration de services réseaux Problématique : Configurer les services réseaux (DHCP, SAMBA, APACHE2) sur un serveur afin de répondre au besoin des postes clients

Plus en détail

La Programmation Web avec PHP

La Programmation Web avec PHP Nouvelle page 1 La Programmation Web avec PHP Qu'est-ce que php? Menu Qu'est ce que php? Les scripts PHP Installation de PHP Configuration d'un serveur IIS Mohamed SIDIR PHP est un langage de script HTML,

Plus en détail

Le site engarde-service.com pour publier des résultats de compétitions Service proposé par la société ANPV-log

Le site engarde-service.com pour publier des résultats de compétitions Service proposé par la société ANPV-log Le site engarde-service.com pour publier des résultats de compétitions Service proposé par la société ANPV-log 1. introduction 2. Création d'un compte sur engarde-service.com 2.1. Inscription 2.2 Gestion

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

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

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

Le stockage local de données en HTML5

Le stockage local de données en HTML5 Le stockage local HTML5, pourquoi faire? Dans une optique de réduction des couts de maintenance, de déploiement, beaucoup d'entreprises ont fait le choix de migrer leurs applicatifs (comptables, commerciales,

Plus en détail

Créer une «application web» avec Meteor v230714 Brouillon David Roche, lycée G Fichet Bonneville

Créer une «application web» avec Meteor v230714 Brouillon David Roche, lycée G Fichet Bonneville Créer une «application web» avec Meteor v230714 Brouillon David Roche, lycée G Fichet Bonneville 1 Ce texte est sous licence Creative Commons Attribution - Partage dans les Mêmes Conditions 4.0 International.

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

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

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

L3 - Sites Web dynamiques : Mini-Wall MINI-WALL

L3 - Sites Web dynamiques : Mini-Wall MINI-WALL L3 - SITES WEB DYNAMIQUES MINI-WALL 1 Introduction L'objectif de ce TD est de mettre en place un mini "livre d'or", permettant à vos visiteurs de vous laisser des messages sur votre site. Une page affiche

Plus en détail

Auteur LARDOUX Guillaume Contact guillaume.lardoux@epitech.eu Année 2014 DEVELOPPEMENT MOBILE AVEC CORDOVA

Auteur LARDOUX Guillaume Contact guillaume.lardoux@epitech.eu Année 2014 DEVELOPPEMENT MOBILE AVEC CORDOVA Auteur LARDOUX Guillaume Contact guillaume.lardoux@epitech.eu Année 2014 DEVELOPPEMENT MOBILE AVEC CORDOVA Sommaire 1. Introduction 2. Installation 3. Fonctionnement 4. Développement 5. Démonstration 2

Plus en détail

09/11/2011 COURS PROGRAMMATION WEB HTML CSS PHP - MYSQL

09/11/2011 COURS PROGRAMMATION WEB HTML CSS PHP - MYSQL COURS PROGRAMMATION WEB HTML CSS PHP - MYSQL Responsable : Niveau : 3 ème ESSAI Année Universitaire : 2011/2012 OBJECTIFS DU COURS Objectifs généraux : Ce cours est destiné aux étudiants disposant de quelques

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

Le WEB: présentation

Le WEB: présentation Le WEB: présentation Introduction: définition(s), historique... Principes d'utilisation:. le système Hypertexte. le fonctionnement pratique Naviguer sur le Web, les bases. les principales fonctions d'un

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

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

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

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

Redécouvrir JavaScript avec Node.js

Redécouvrir JavaScript avec Node.js Redécouvrir JavaScript avec Node.js Sébastien Castiel Licence Le contenu de ce livre est distribué sous licence Creative Commons Attribution - Pas d Utilisation Commerciale - Partage dans les Mêmes Conditions

Plus en détail

Bases de données et Sites Web. Li345

Bases de données et Sites Web. Li345 Bases de données et Sites Web. Li345 Remerciements à: Stéphane Gançarski et Philippe Rigaux. Ces transparents sont fortement inspirés du très bon livre : Pratique de MySQL et PHP, troisième édition Philippe

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

HTML et JavaScript. s1 ----------

HTML et JavaScript. s1 ---------- HTML et JavaScript s1 ---------- Dans cette partie, nous allons introduire le langage JavaScript qui permet de manipuler le document HTML : création ou repositionnement d'éléments de structure, modification

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

ISN Premiers pas en php 17/10/2011

ISN Premiers pas en php 17/10/2011 ISN Premiers pas en php 17/10/2011 Qu'est-ce que PHP? PHP est un langage de programmation qui s'intègre dans vos pages HTML. Mais, avant de continuer, il est bon d'expliquer comment se déroule une requête

Plus en détail

Cours de programmation web

Cours de programmation web Cours de programmation web ENSAE 2006-2007 Cours 1 - Introduction 1. Introduction 2. Le principe d Internet 3. Les langages du web 4. Le web 2.0 Introduction : Historique 1967 : Arpanet : réseau militaire

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

Programmation orientée objet et événementielle en JavaScript. Département SRC Pôle Universitaire de Vichy Bruno Bachelet

Programmation orientée objet et événementielle en JavaScript. Département SRC Pôle Universitaire de Vichy Bruno Bachelet Programmation orientée objet et événementielle en JavaScript Département SRC Pôle Universitaire de Vichy Bruno Bachelet PARTIE I JavaScript: script côté client Programmation objet et événementielle en

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

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

Introduction ASP.NET

Introduction ASP.NET 1 Sommaire Introduction... 1 1 Framework... 2 1.1 Général (.NET)... 2 1.2 ASP.NET... 2 2 Prérequis... 2 3 Présentation des bases d un projet ASP.NET... 3 3.1 Création d un projet... 3 3.2 Site Web : Les

Plus en détail

Maison domotique Présentation générale de la maison domotique

Maison domotique Présentation générale de la maison domotique Maison domotique Présentation générale de la maison domotique Les caractéristiques techniques : Maison générale : Les différentes pièces : Le salon La cuisine La chambre La salle de bain Le tableau éléctrique

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

Programmation Web. Thierry Hamon

Programmation Web. Thierry Hamon 1/27 Programmation Web Thierry Hamon Bureau H202 - Institut Galilée Tél. : 33 1.48.38.35.53 Bureau 150 LIM&BIO EA 3969 Université Paris 13 - UFR Léonard de Vinci 74, rue Marcel Cachin, F-93017 Bobigny

Plus en détail

B2 : Rechercher l'information

B2 : Rechercher l'information Domaine B2 B2 : Rechercher l'information KARINE SILINI UNIVERSITÉ DU LITTORAL CÔTE D'OPALE SUPPORT DE COURS EN LIBRE DIFFUSION Version du 11 octobre 2009 Table des matières B2 : Rechercher l'information

Plus en détail

Créer des pages WEB à l aide de KompoZer.

Créer des pages WEB à l aide de KompoZer. Document élève 1/14 Créer des pages WEB à l aide de KompoZer. Document élève 2/14 INTERNET : CREATION D UN SITE PRESENTATION Un site web (aussi appelé site internet par abus de langage) est un ensemble

Plus en détail

Navigation dans Windows

Navigation dans Windows Cours 03 Navigation dans Windows Comme je le disais en introduction, notre souris se révèle plus maligne qu'elle n'en a l'air. À tel point qu'il faut apprendre à la dompter (mais c'est très simple, ce

Plus en détail

Un serveur FTP chez soi Tutoriel pour Filezilla FTP server

Un serveur FTP chez soi Tutoriel pour Filezilla FTP server Space-OperaRécitsLogicielsCréationsBlogForum Un serveur FTP chez soi Tutoriel pour Filezilla FTP server DynDNS : Pourquoi et comment? Téléchargement et installation de Filezilla Server Configuration réseau

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

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

STI2D. AP3.1: Découverte de la programmation PHP (sites internet) Option SIN Première. Informatique

STI2D. AP3.1: Découverte de la programmation PHP (sites internet) Option SIN Première. Informatique STI2D Option SIN Première AP3.1: Découverte de la programmation PHP (sites internet) Informatique Durée prévue : 4h. Problématique : découverte de la programmation PHP Compétences visées Être capable de

Plus en détail

Initiation PHP-MySQL : HTML, HTTP, URL, PHP Vocabulaire, principes et premiers pas

Initiation PHP-MySQL : HTML, HTTP, URL, PHP Vocabulaire, principes et premiers pas Initiation PHP-MySQL : HTML, HTTP, URL, PHP Vocabulaire, principes et premiers pas Olivier BOEBION 12/02/2004 1 Le point de départ 1.1 Et la lumière fut... A la fin des années 1980, Tim Berners-Lee travaillant

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

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

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

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

Documentation de CMS-gen

Documentation de CMS-gen Table des matières GÉNÉRALITÉ... 1 LA ZONE D'ADMINISTRATION... 2 LOGIN SUR LA ZONE D ADMINISTRATION... 2 EDITION DU CONTENU EN LIGNE... 3 LE MODE EDITION... 3 PUBLICATION... 3 SUPPRIMER DES MODIFICATIONS...

Plus en détail

Tutoriel de base. Copyleft 2010 réalisé par Roger Star sur Ooo

Tutoriel de base. Copyleft 2010 réalisé par Roger Star sur Ooo Tutoriel de base Table des matières 1Préambule1 2Téléchargement de Joomla1 3Base de données2 4Installation de Joomla2 5Contenu5 6Administration5 7Présentation de la structure de Joomla6 8Structure du site7

Plus en détail

Langages et technologies du Web 1

Langages et technologies du Web 1 Langages et technologies du Web 1 Manuel ATENCIA manuel.atencia-arcas@upmf-grenoble.fr Objectifs Comprendre le fonctionnement du World Wide Web Produire des documents web statiques et dynamiques 1 2 vocabulaire

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

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

Introduction à Dreamweaver CS4

Introduction à Dreamweaver CS4 Introduction à Dreamweaver CS4 Adobe Dreamweaver (anciennement Macromedia Dreamweaver) est un éditeur de site web de type «tel écrit tel écran» (cette formule remplaçant désormais dans la terminologie

Plus en détail

Le client/serveur dans le cas du Web

Le client/serveur dans le cas du Web Le client/serveur dans le cas du Web Olivier Flauzac & Cyril Rabat olivier.flauzac@univ-reims.fr cyril.rabat@univ-reims.fr Licence 3 Info - Info0503 - Introduction à la programmation client/serveur 2015-2016

Plus en détail

NVU, Notepad++ (ou le bloc-note), MySQL, PhpMyAdmin. HTML, PHP, cas d utilisation, maquettage, programmation connaissances en HTML, PHP et SQL

NVU, Notepad++ (ou le bloc-note), MySQL, PhpMyAdmin. HTML, PHP, cas d utilisation, maquettage, programmation connaissances en HTML, PHP et SQL Prise en main de NVU et Notepad++ (conception d application web avec PHP et MySql) Propriétés Intitulé long Formation concernée Matière Présentation Description Conception de pages web dynamiques à l aide

Plus en détail

Documents web dynamiques. 20 novembre 2007 Architecture Multi-Niveaux 54

Documents web dynamiques. 20 novembre 2007 Architecture Multi-Niveaux 54 Documents web dynamiques 20 novembre 2007 Architecture Multi-Niveaux 54 Documents web dynamiques Contenu Statique Le client envoie une requête avec un nom de fichier Le serveur répond en lui retournant

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

AJAX AJAX. Asynchronous JavaScript And XML. Technologie pour créer des pages web interactives Basées sur XML, HTML et JavaScript

AJAX AJAX. Asynchronous JavaScript And XML. Technologie pour créer des pages web interactives Basées sur XML, HTML et JavaScript AJAX Ajax 1 AJAX Asynchronous JavaScript And XML. Technologie pour créer des pages web interactives Basées sur XML, HTML et JavaScript Utilise: HTML pour le marquage XML pour représenter les résultats

Plus en détail

Langage HTML (2 partie) lt La Salle Avignon BTS IRIS

Langage HTML (2 partie) <HyperText Markup Language> <tv>lt La Salle Avignon BTS IRIS</tv> Langage HTML (2 partie) «Je n'ai fait que prendre le principe d - hypertexte et le relier au principe du TCP et du DNS et alors boum! ce fut le World Wide Web!» Tim Berners-Lee

Plus en détail

Création d un WebService. Tp WinDev Numéro 13

Création d un WebService. Tp WinDev Numéro 13 Tp WinDev Numéro 13 Objectifs : Création d un WebService Paramétrage d un serveur Web, Création du Service Web, Création du client consommateur, Approche XML, SOAP Outils : Un serveur d application Ce

Plus en détail

Petite définition : Présentation :

Petite définition : Présentation : Petite définition : Le Web 2.0 est une technologie qui permet la création de réseaux sociaux, de communautés, via divers produits (des sites communautaires, des blogs, des forums, des wiki ), qui vise

Plus en détail

Google Chrome. La barre de favoris: Une petit barre (Ctrl+B) qui fait tout la largeur du navigateur juste en dessous de la barre de recherche.

Google Chrome. La barre de favoris: Une petit barre (Ctrl+B) qui fait tout la largeur du navigateur juste en dessous de la barre de recherche. Google Chrome Résumé rapide: Lien de téléchargement: http://www.google.fr/chrome La barre de favoris: Une petit barre (Ctrl+B) qui fait tout la largeur du navigateur juste en dessous de la barre de recherche.

Plus en détail

Programmation Web IMAC 2015-2016. TD 8 : Formulaires. 2 décembre 2015

Programmation Web IMAC 2015-2016. TD 8 : Formulaires. 2 décembre 2015 Programmation Web IMAC 2015-2016 TD 8 : Formulaires 2 décembre 2015 Objectif: Dans ce TD, nous allons introduire les formulaires en HTML. Pour pouvoir les utiliser on abordera aussi les plug-ins jquery

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

PHP/MYSQL. Web Dynamique

PHP/MYSQL. Web Dynamique PHP/MYSQL Web Dynamique ENSG Juin 2008 Qui suis-je? Guillaume Gautreau Responsable projets Systèmes d information à l ENPC guillaume@ghusse.com http://www.ghusse.com Ces 6 jours de formation Jour 1 : présentations,

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

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

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

CHAPITRE 1 : CONCEPTS DE BASE

CHAPITRE 1 : CONCEPTS DE BASE CHAPITRE 1 : CONCEPTS DE BASE 1.1 C est quoi l INTERNET? C est le plus grand réseau télématique au monde, créé par les Américains et issu du réseau ARPANET (Advanced Research Projects Agency ). Ce dernier

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

Petite histoire d Internet

Petite histoire d Internet À la base, Internet est défini par des ordinateurs qui sont reliés entre eux grâce à des câbles, du WiFi ou encore des satellites, créant ainsi un réseau à échelle mondiale. Les ordinateurs communiquent

Plus en détail

Assistance à distance sous Windows

Assistance à distance sous Windows Bureau à distance Assistance à distance sous Windows Le bureau à distance est la meilleure solution pour prendre le contrôle à distance de son PC à la maison depuis son PC au bureau, ou inversement. Mais

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

Version 1.0 Janvier 2011. Xerox Phaser 3635MFP Plate-forme EIP

Version 1.0 Janvier 2011. Xerox Phaser 3635MFP Plate-forme EIP Version 1.0 Janvier 2011 Xerox Phaser 3635MFP 2011 Xerox Corporation. XEROX et XEROX and Design sont des marques commerciales de Xerox Corporation aux États-Unis et/ou dans d'autres pays. Des modifications

Plus en détail

AC PRO SEN TR Services TCP/IP : SSH

AC PRO SEN TR Services TCP/IP : SSH B AC PRO SEN TR Services TCP/IP : SSH Installation et configuration du service SSH Nom : Appréciation : Note : Prénom : Classe : Date : Objectifs : durée : 2h - S'informer sur les protocoles et paramètres

Plus en détail

Initiation HTML 5 / CSS 3. Clément Bourgoin cb@nokto.net v1.0-17/01/2013

Initiation HTML 5 / CSS 3. Clément Bourgoin cb@nokto.net v1.0-17/01/2013 Initiation HTML 5 / CSS 3 Clément Bourgoin cb@nokto.net v1.0-17/01/2013 1. Les langages du web Pour créer un site web, on utilise au moins deux langages : le HTML et le CSS. Il en existe d'autres mais

Plus en détail

Technologies Web. Farah Benamara Zitoune Maître de conférences IRIT-UPS benamara@irit.fr

Technologies Web. Farah Benamara Zitoune Maître de conférences IRIT-UPS benamara@irit.fr Technologies Web Farah Benamara Zitoune Maître de conférences IRIT-UPS benamara@irit.fr Plan du cours Cours 1 : Introduction HTML/CSS Cours 2 : Introduction programmation web + javascirpt Cours 3 : Introduction

Plus en détail

Programmation Android TP7 - WebServices

Programmation Android TP7 - WebServices 1. WebService Dans le TP6, les avis étaient stockés dans une base SQL. Cette semaine les n-uplets sont stockés sur une base de données externe gérée par un serveur HTTP sur lequel tournent des scripts

Plus en détail

Installation de Windows 2003 Serveur

Installation de Windows 2003 Serveur Installation de Windows 2003 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

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

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

Manuel Utilisateur de l'installation du connecteur Pronote à l'ent

Manuel Utilisateur de l'installation du connecteur Pronote à l'ent de l'installation du connecteur Pronote à l'ent Page : 1/28 SOMMAIRE 1 Introduction...3 1.1 Objectif du manuel...3 1.2 Repères visuels...3 2 Paramétrage de la connexion entre l'ent et Pronote...4 2.1 Informations

Plus en détail