Séminaire de rentrée cours de programmation web & Wordpress

Présentation au sujet: "Séminaire de rentrée cours de programmation web & Wordpress"— Transcription de la présentation:

1 Séminaire de rentrée cours de programmation web & Wordpress
Se familiariser avec le fonctionnement d’un serveur et les principaux langages web Installer Wordpress sur un serveur local Maîtriser les outils permettant d’analyser les pages web

2 Sitographie & bibliographie
Intégration web, Corinne Schillinger, Edition Eyrolles, 2012 Réalisez votre site web avec HTML5 et CSS3, Mathieu Nebra, Le livre du Zéro, 2011 CSS3 pour les Web Designers, Dan Cederholm, Editions Eyrolles, 2011 HTML & CSS, design et création web, John Duckett, Editions Pearson Campuspress, 2012

3 supdepub.avelook.fr/crea
Accès aux documents supdepub.avelook.fr/crea

4 Du clic à l’affichage de la page : comment le « client » dialogue avec le « serveur »

5 Mettre en place un serveur local avec XAMPP en 3 étapes
1/ téléchargez Xampp 2/ installez le logiciel 3/ démarrez Xampp et tapez dans votre navigateur. Xampp est constitué entre autres des services suivants : un serveur http (« apache ») Un système de base de données (« mysql ») Un utilitaire de gestion de base de données (« phpmyadmin »)

6 Les langages de programmation web côté « serveur » et côté « client »
HTML JAVASCRIPT CSS PHP python SQL asp

7 Une base de données, c’est quoi ?
Sur la page une fois Xampp démarré, ouvrez l’utilitaire de gestion de base de données « phpmyadmin » Créez une nouvelle base de données que vous appellerez « dev » Cliquez sur l’onglet « sql » et copiez/collez le code situé dans le fichier « dev.sql ». Ce code génèrera 2 tables (famille et courses) dans votre base de données

8 Php, sql, html, css, javascript
Ouvrez le fichier base.php avec un éditeur de code testez différentes requêtes de sélection (commentez toutes celles que vous n’utilisez pas avec des « // » en début de ligne) Testez la requête d’update et la requête d’insert (attention à commenter le code que vous ne voulez pas déclencher). Regardez le résultat dans votre base de données ! Ouvrez le fichier base.html avec un éditeur de code et familiarisez-vous avec les balises html. Ajoutez/modifiez/copiez/collez du code Ouvrez le fichier « styles.css » et testez d’autres valeurs. Affichez la page base.html pour voir le résultat Ouvrez le fichier « scripts.js » et tapez « alert(‘mon texte’) à l’endroit indiqué dans le fichier. Affichez la page base.html et cliquez sur le dernier lien tout en bas pour voir le résultat

9 Installer Wordpress sur un serveur local (1ère partie)
téléchargez wordpress : dans le dossier htdocs créé par xampp, créez un dossier « wordpress » décompressez les fichiers de Wordpress dans le dossier « wordpress »

10 Installer Wordpress sur un serveur local (2e partie)
Sur la page ouvrez l’utilitaire de gestion de base de données « phpmyadmin » Créez une nouvelle base de données, que vous appellerez par exemple « wordpress » tapez l’adresse « localhost/wordpress » dans votre navigateur pour lancez l’installation Renseignez « root » comme identifiant et laissez le champ « mot de passe » vide