Introduction Web. 1ère année, cours - 5/5. Marcel Bosc 2011-2012



Documents pareils
Programmation Web. Madalina Croitoru IUT Montpellier

NFA016 : Introduction. Pour naviguer sur le Web, il faut : Naviguer: dialoguer avec un serveur web

Devenez un véritable développeur web en 3 mois!

les techniques d'extraction, les formulaires et intégration dans un site WEB

Les grandes facettes du développement Web Nicolas Thouvenin - Stéphane Gully

INTRODUCTION A JAVA. Fichier en langage machine Exécutable

TP JAVASCRIPT OMI4 TP5 SRC

WEB & DÉVELOPPEMENT LES BASES DU WEB LE LANGAGE HTML FEUILLES DE STYLES CSS HISTORIQUE D INTERNET ET DU WEB LES DIFFÉRENTS LANGAGES

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

3W Academy Programme de Formation Développeur Intégrateur web Total : 400 heures

Hébergement de site web Damien Nouvel

HTML, CSS, JS et CGI. Elanore Elessar Dimar

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

CATALOGUE DES FORMATIONS LANGUES

Modélisation PHP Orientée Objet pour les Projets Modèle MVC (Modèle Vue Contrôleur) Mini Framework

CRÉER, ROUTER ET GÉRER UNE NEWSLETTER, UN ING

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

HTML. Notions générales

PHP 5.4 Développez un site web dynamique et interactif

Développeur - Conseiller - Formateur web

Introduction. PHP = Personal Home Pages ou PHP Hypertext Preprocessor. Langage de script interprété (non compilé)

Technologies Web. Ludovic Denoyer Sylvain Lamprier Mohamed Amine Baazizi Gabriella Contardo Narcisse Nya. Université Pierre et Marie Curie

S7 Le top 10 des raisons d utiliser PHP pour moderniser votre existant IBM i

Formation : WEbMaster

Projet 2. Gestion des services enseignants CENTRE D ENSEIGNEMENT ET DE RECHERCHE EN INFORMATIQUE. G r o u p e :

Un site web collaboratif avec Drupal. Judith Hannoun - Journées INSHS 16 Octobre 2012

Projet en nouvelles technologies de l information et de la communication

SYSTÈMES D INFORMATIONS

RESUME DE CARRIERE. Alice JULIENNE. 23 ans Nationalité Française Développeur Web Front-End. Compétences

CATALOGUE FORMATION 2015

Paul FLYE SAINTE MARIE

Dans nos locaux au 98 Route de Sauve NÎMES. Un ordinateur PC par stagiaire, scanner, imprimante/copieur laser couleur

Attaques applicatives

L envoi d un formulaire par courriel. Configuration requise Mail Texte Mail HTML Check-list

Serveur d'application Client HTML/JS. Apache Thrift Bootcamp

Info0101 Intro. à l'algorithmique et à la programmation. Cours 3. Le langage Java

Failles XSS : Principes, Catégories Démonstrations, Contre mesures

HTTP. Technologies du Web. Programmation Web côté serveur. Mastère spécialisé Management et nouvelles technologies, 16 novembre 2009

Panel des technologies Web

Licence Bio Informatique Année Premiers pas. Exercice 1 Hello World parce qu il faut bien commencer par quelque chose...

Stockage du fichier dans une table mysql:

Document Object Model (DOM)

Principales failles de sécurité des applications Web Principes, parades et bonnes pratiques de développement

Les différents parcours en S4

Catalogue des formations

PLUGINS Guide du Développeur STEPHANE FERRARI. P l u X m l 5.4

Diffuser un contenu sur Internet : notions de base... 13

Fingerprinting d'applications Web

Léa Dumas Développeuse front-end Intégratrice //

Présentation du Framework BootstrapTwitter

Bonnes pratiques de développement JavaScript

Attaques de type. Brandon Petty

Sécurité des sites Web Pas un cours un recueil du net. INF340 Jean-François Berdjugin

Web & Libre. Outils pour être présent sur le net librement

Module BD et sites WEB

Tour d horizon des CMS. Content Management System

SHERLOCK 7. Version du 01/09/09 JAVASCRIPT 1.5

novatis Agence Web innovatrice

Formulaires et Compteurs

Drupal (V7) : principes et petite expérience

Prise en main de Moodle

Utiliser un CMS: Wordpress

Loïc Rossignol Ingénieur Consultant

Panorama des CMS open sources. Sylvain Ferrand, CMAP École Polytechnique Journées Mathrice, Poitiers, 19 mars 2008

Séance d ED n 5 : HTML et JavaScript

Karim EL KHALIFA Web developer

DOM - Document Object Model

Armand PY-PATINEC 2010

Classe ClInfoCGI. Fonctions membres principales. Gestion des erreurs

Formulaire pour envoyer un mail

Programme de formation

PHP et mysql. Code: php_mysql. Olivier Clavel - Daniel K. Schneider - Patrick Jermann - Vivian Synteta Version: 0.9 (modifié le 13/3/01 par VS)

Drupal un CMS orienté mé2er. Romain JARRAUD Mathieu GROS

COMPÉTENCES TECHNIQUES

INGÉNIEUR - DÉVELOPPEUR EXPÉRIMENT É PHP - MAGENT O. 30 ans - 6 ans d'expérience

Documentation de conception

Démonstration de la mise en cache via HTML 5 sur iphone

SYSTÈMES DE PUBLICATION POUR L INTERNET. Beatep Marie-France Landréa - Observatoire de Paris

Comparatif CMS. Laurent BAUREN S Bérenger VIDAL Julie NOVI Tautu IENFA

Bureautique Initiation Excel-Powerpoint

Gestion du parc informatique matériel et logiciel de l Ensicaen. Rapport de projet. Spécialité Informatique 2 e année. SAKHI Taoufik SIFAOUI Mohammed

Construction d un Site Internet Dynamique avec Joomla René-Yves Hervé, Ph.D.

Mise en place d un serveur Proxy sous Ubuntu / Debian

PHP et les Bases de données - Généralités

Joomla! Création et administration d'un site web - Version numérique

Rapport de Stage Christopher Chedeau 2 au 26 Juin 2009

Catalogue des formations : Utilisation d outils Open Source

<Insert Picture Here>ApExposé. Cédric MYLLE 05 Février Exposé Système et Réseaux : ApEx, Application Express d Oracle

Comment créer son propre monitoring. (Version simple PHP)

Informations générales. Technologies. css3-html5-php-ajax-j-query-mootools-action-script3

Pierre Racine Professionnel de recherche Centre d étude de la forêt Département des sciences du bois et de la forêt, Université Laval, Québec

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

Webinar. Découvrez Rubedo, la première solution CMS open-source tirant profit des atouts de Zend Framework et du NoSQL. avec la participation de

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.

Rapport de stage Clément MOYSAN

Transcription:

Introduction Web 1ère année, cours - 5/5 Marcel Bosc 2011-2012 Département informatique IUT de Villetaneuse Université Paris-13

table des matières Types en PHP Classes et objets Organisation code PHP CMS / Frameworks Programmation coté client Bilan

1ère partie Types en PHP

Types en PHP $a = 5; // entier var_dump($a); // affiche int(5) $b = 'bonjour'; // chaine var_dump($b); // affiche string(7) "bonjour" $b = $a; var_dump($b); // affiche int(5) $a = 123; // entier $a = '123'; // chaine $a = true; // bool $a = 3.141; // float $a = array('a','b','c'); // array

Conversion de type cast // à la main $a = 123; // entier $b=(string) $a; var_dump($b); // affiche string(3) "123" $a = '123'; // chaine $b=(int) $a; var_dump($b); // affiche int(123) $a = '123'; $b = intval($a); var_dump($b); // affiche int(123) // aussi: $a = (bool) $b; $a = (float) $b;

Conversion automatique // exemple chaine -> int $a = 5; // entier $b = '10'; // chaine $c = $a + $b ; // résultat = 15 // exemple int -> chaine // 1) $a est converti en chaine : '5' // 2) concaténation de deux chaines $r = 'abc'.$a; // Conversion automatique avec == $a = 5; $b = '5'; if($a == $b){ echo "oui!"; } // exemple pratique: formulaire multiplication // $_GET['...'] est une chaine $resultat= $_GET['nombre1'] * $_GET['nombre2']

Comparaison avec type $a = 5; $b = '5'; // vrai if( $a == $b ) {... } // faux : pas le même type if( $a === $b ) {... } // Exemple pratique $pos = strpos('abcdef','cd' ); // $pos -> 2 $pos = strpos('abcdef','ab' ); // $pos -> 0 $pos = strpos('abcdef','xy' ); // $pos -> false // Pas bon: 0 == false if( strpos('abcdef','ab' ) == false ) {... } // Ok 0!== false if( strpos('abcdef','ab' ) === false ) {... }

Divers Manipulation de types // fonctions is_int, is_array... if(is_int($a)){echo "a est un entier";} echo gettype($a); // affiche "int" Fonction unset unset($a); unset($t['xyz']); Opérateur "ternaire" // Si $b est vrai : $a=$c sinon $a=$d $a = $b? $c : $d; // exemple : $ligne=0,1,2,3,4... echo '<tr class="'.($ligne%2? 'impair' :'pair').'">';

2e partie Classes et objets

Classes et objets // définition d'une classe class Exemple { // déclaration des propriétés public $propex = 'bonjour'; } // déclaration des méthodes public function afficher() { echo $this->propex; } // création d'un objet $e = new Exemple(); // appel d'une méthode $e->afficher(); // accès à une proprieté echo $e->propex;

Constructeur, héritage class Exemple extends Parent { public $xyz; } // déclaration des méthodes function construct($a) { $xyz= $a + 10; } // Création d'un objet avec argument $e = new Exemple(123);

3e partie Formulaire

Étapes problème affichage formulaire validation ok traitement / enregistrement

Affichage... $age=''; if(isset($_post['age'])) { $age=... }... $age=htmlspecialchars($age,...);... <form method="post" action="formulaire.php"> <p> 2 cas: Première fois (vide) Re-affichage (erreur) <input type="text" name="nom" value="<?php echo $nom;?>"/> <input type="text" name="age" value="<?php echo $age;?>"/> <input type="submit"/> </p> </form> problème affichage formulaire validation ok traitement / enregistrement

Validation... $ok=true; if(isset($_post['age'])) { $age=_post['age']; if(!preg_match('/^[0-9]+$/',$age)){$ok=false;} } if($ok) {... // traitement / enregistrement } else {... // afficher formulaire }... problème affichage formulaire validation ok traitement / enregistrement

Traitement / enregistrement if($ok) { $majeur=($age>=18);... requete_sql("update utilisateurs SET age=%d WHERE...",$age); // redirection header('location: http://exemple.org/...'); exit(); } problème affichage formulaire validation ok traitement / enregistrement

3e partie Organisation code PHP

Le problème http://exemple.org/accueil.php http://exemple.org/page1.php http://exemple.org/page2.php http://exemple.org/page3.php http://exemple.org/plan-du-site.php http://exemple.org/administrer.php http://exemple.org/formulaire-ajout-utilisateur.php Répétition : pour chaque fichier : Initialisation variables Connexion à la BdD Droits d'accès utilisateur connecté? à le droit de voir cette page?... Chaque fichier à sa propre logique Difficile de suivre le déroulement

Une solution http://exemple.org/index.php?action=accueil http://exemple.org/index.php?action=page&n=1 http://exemple.org/index.php?action=page&n=2 http://exemple.org/index.php?action=page&n=3 http://exemple.org/index.php?action=plan-du-site http://exemple.org/index.php?action=administrer http://exemple.org/index.php?action=formulaire-ajout-utilisateur Toute requête passe par index.php index.php : initialisation, connexion BdD, droits d'accès... "contrôleur" : "aiguillage" Quels fichiers inclure / fonctions appeler

Exemple function exemple() { connexion_bdd(); $user=utilisateur_connecte(); $action=$_get['action']; verifier_acces($user,$action); } require_once 'entetes.inc'; switch($action) { case 'accueil': require_once 'accueil.inc'; accueil(); break; case 'page': require_once 'page.inc'; page(intval($_get['n'])); break;... } require_once 'fin-de-page.inc';

(rappel) séparation HTML / PHP <?php $total=0; foreach($joueurs as $joueur) { $total+=$joueur['score']; } require_once 'page-score.php',?> page-score.php <!DOCTYPE...> <html> <head> <title>...</title> </head> <body> <p>le score total est de <?php echo $total;?> points</p> </body> </html> PHP, très peu de HTML HTML, PHP très simple: (afficher variables) séparation des métiers

Template <!DOCTYPE...> page-score.php <html> <head> <title>...</title> </head> <body> <p>le score total est de <?php echo $total;?> points</p> </body> </html> template PHP <!DOCTYPE...> <html> <head> <title>...</title> </head> <body> <p>le score total est de {$total} points</p> </body> </html> page-score.tpl Langage template Smarty, CMS / Framework Symfony (Twig)...

5e partie CMS / Frameworks

CMS CMS: Content Management System Création / gestion site web par non-informaticien Gestion d'articles, contenu, utilisateurs,... Extensible: ajouter / personnaliser fonctionnalités Templates Droits d'accès Ne pas ré-inventer la roue... Temps d'apprentissage contraignant complexité Exemples: Drupal Wordpress Joomla Spip

Framework PHP Framework PHP: collection de fonctions et/ou classes facilitant l'écriture de logiciels web fonctionnalités similaires aux CMS vous écrivez le programme : liberté, souplesse Ne pas ré-inventer la roue... Temps d'apprentissage pour informaticiens uniquement Exemples: Zend Symfony CakePHP

6e partie Programmation coté client

client (navigateur) interactivité - lenteurs serveur site.org votre adresse: toto@site.o envoyer http://site.org/saisie.php 1 apache 2 saisie.php adresse non valide! toto@site.o envoyer 4 3 lenteur réseau exécution PHP - serveur chargé lenteur réseau lenteur affichage internet

interactivité - programme client client (navigateur) serveur site.org votre adresse: toto@site.o envoyer script client adresse non valide! toto@site.o pas d'interaction client / serveur lente envoyer internet

programmes client - exemples popup interactif aide contextuelle popups validation de formulaires menus déroulants éditeurs wysiwyg cartes interactives...

programmes client - langages javascript langage de programmation standard - ECMAScript exécuté par le navigateur! aucun lien avec le Java! incompatibilités entre navigateurs adobe - flash vidéo sites entiers propriétaire navigation

javascript et DOM p a img a DOM Document Object Model représentation objet des éléments HTML du document strong img id=photo img est un objet! On peut le manipuler en javascript i=document.getelementbyid("photo"); i.style.border="1px solid red"; http://developer.mozilla.org/en/docs/gecko_dom_reference

principaux objets DOM Window Document Un titre un paragraphe Element http://developer.mozilla.org/en/docs/gecko_dom_reference

objets DOM : Element <p id="ex" style="color: red">un exemple</p> var ceparagraphe=document.getelementbyid("ex") ceparagraphe.style.color="green"; élément

Element : propriétés <p id="ex" class="toto">un exemple</p> var ceparagraphe=document.getelementbyid("ex") ceparagraphe.classname="titi"; ceparagraphe.textcontent="nouveau texte";

événements Javascript interaction boutton souris boutton souris (double) mouvement souris touche clavier onclick ondblclick onmousemove onkeypress on peut ajouter des gestionnaires d'événement à tous les éléments exemple: <p onclick="ma_fonction()">...</p>

7e partie Bilan

Technologies : client / serveur client (navigateur) serveur HTML CSS Javascript Flash DOM JQuery PHP, Java, Perl, Python, ASP BdD: SQL CMS Framework Ajax (Ahah)

Au 3e semestre Programmation client: Javascript, DOM, Jquery PHP + BdD Ajax (Ahah) CMS / Frameworks

ce document est distribué librement : sous licence GNU FDL : http://www.gnu.org/copyleft/fdl.html les originaux sont disponibles aux formats OpenOffice et powerpoint http://www-info.iutv.univ-paris13.fr/~bosc