Designed by Maunakea !
41 en ligne   Boutique | Sites | Bar | Forum | PhpBB | Actu | Glossaire | Codes | Tips | Liens | Livres | Lettre  


 Recherche

 NewsLetter






   

Introduction à la programmation web (1/3)

et l'art de bien utiliser ce site





Ludo
Votre site jojolafripouille.free.fr est en HTML made in FrontPage. Vous voudriez bien le dynamiser un peu : ajouter des news, un forum etc, mais vous n'y comprenez rien, çà n'est pas votre métier. Qu'est ce qu'un langage dynamique, à quoi celà sert-il, par où commencer?

A la vue des questions (répétitives) des nouveaux arrivants sur le site, il est temps de faire le point et de vous montrer qu'ici vous avez tout pour faire des merveilles!

Alors on relève ses manches, et on se dit qu'on peut y arriver, tout le monde a bien dû commencer un jour, avec de la volonté, un peu de temps, vous y arriverez!


Introduction à la programmation web - Aller, je me lance! - Ok! Mon site marche!



Langages dynamiques - Lesquels? - Pourquoi?

Qu'est ce qu'un langage statique ou côté client?

C'est un langage qui n'utilise pas de serveur pour éxecuter son code, ex : HTML, Javascript, pour éxecuter une page en HTML simple qui est sur votre bureau, il vous suffit de double-cliquer dessus pour voir le résultat.

Qu'est ce qu'un langage dynamique ou côté serveur?

C'est un langage qui DOIT utiliser un serveur pour éxecuter son code, ex : ASP, PHP, CGI, ASP.net, JSP, CFM etc, pour éxecuter une page dans un de ces langages, vous DEVEZ avoir un serveur web (IIS, Apache, etc) PLUS un module qui retranscrira les commandes du langage en actions que vous ne verrez pas (ex : envoi de mail, ajout dans une base) et en code HTML que vous renverra le serveur web à l'écran.

Qu'est ce qu'une page dynamique?

C'est une page qui utilise les langages statiques : HTML/CSS pour la mise en page, Javascript pour vérifier un formulaire avant envoi par ex, et un langage dynamique, par ex PHP qui vient se connecter à une base de données pour lister les inscrits d'une newsletter.
La page affichée à l'écran est donc renvoyée par le serveur, après passage à la moulinette, sous forme HTML simple. Pour preuve cette page-ci, les titres, contenus, liens, pubs, tout est orchestré dynamiquement en PHP, mais si vous faîte un clic-droit puis afficher la source, vous ne verrez que du code HTML!

Les différents langages dont traite ce site sont :
- en statique : HTML, JavaScript, VBScript, VML
- en dynamique : ASP, PHP, ASP.net

Point important : dans une page homogène comprenant HTML, Javascript et un langage côté serveur, (ex : PHP), le code PHP sera toujours éxecuté AVANT tout autre code et de haut en bas, ex : le serveur analyse la page, trouve des instructions PHP en haut et en bas de page, il les éxecute, et renvoit une page HTML contenant en haut le résultat HTML des instructions, le milieu de la page qui était du code HTML, donc renvoyé tel quel, on n'y touche pas, puis le bas de page, éxecuté et renvoyé également en HTML.

Que peut on faire avec ces langages?

Un livre d'or, un forum, redimensionner des images (créer des vignettes), envoyer des fichiers, des mails, gérer un panier d'achat pour un site ecommerce, créer des compteurs en utilisant des cookies, interagir avec des animations en Flash, récupérer les informations postées à partir d'un formulaire, faire une zone 'membre' protégée etc...

Les bases de données

Mais c'est vraiment en couplant ces langages avec une base de données que l'on en tire la quintessence et que les choses deviennent vraiment intéressantes!

A quoi ca sert?

A regrouper des données ayant des points communs sous forme d'enregistrements contenant des champs, regroupés en collections (tables), collections qui peuvent avoir des relations avec une ou plusieurs autres collections.

Exemples :

- un livre d'or; il contient des messages de sympathie ou non :), tous ces messages sont de même forme : le nom de l'auteur, son email, et son message.
- un annuaire de membres; à l'identique tous les membres seront caractérisés par leur nom, prénom, email, âge, et photo.
- les articles d'une boutique; tous ont une désignation, une référence, une description, un prix, une photo etc...

Ces points communs sont matérialisés sous forme de champs.

En pratique : pour ma boutique en ligne, je vais avoir une base de données, appelée 'boutique', qui contiendra plusieurs collections ou tables : une appelée 'clients' qui contient la liste de mes clients qui lors de leurs inscriptions ont rempli plusieurs champs : nom, prenom, adresse etc, une autre appelée 'articles' qui liste mes articles comme vu ci-dessus, et une dernière nommée 'commandes' : un client passe commande d'articles, vous voyez la relation entre les 3 : client, commande, article? :) Réfléchir au regroupement des données, aux différentes relations, aux types de champs enregistrables c'est de la conception de BD.

Pour créer ces exemples, on utilisera l'HTML pour la mise en forme de notre page, ASP ou PHP pour gérer un formulaire d'envoi dans lequel l'internaute remplira des champs, et des requêtes SQL pour insérer ce nouvel enregistrement dans notre base de données. On utilisera à nouveau une requête SQL conjointement à du code ASP ou PHP pour lister tous nos messages du livre d'or.

Qu'est ce que SQL?

Structured Query Language : c'est un langage (encore!) d'interrogation (requête) de bases de données. Il ne sert qu'à çà. A partir d'un langage comme ASP ou PHP on se connecte à notre base de données, on effectue un lien, on demande ensuite grâce à une requête SQL de sélectionner des résultats, d'en ajouter, d'en modifier ou d'en effacer, suivant des critères sur les champs ou non, de les classer, de les ordonner.
Si je reprend mon exemple d'annuaire, je vais construire (pour rester simple) 2 pages : une qui permet d'ajouter des données grâce à un formulaire qui demandera à la personne d'entrer son nom, prénom, email, âge, et photo; et une autre page qui listera tous les membres.
Dans la 1ere page j'utiliserais donc une requête d'insertion : on ajoute un enregistrement.
Dans la seconde page j'utiliserais une requête de sélection : on veut lister tous les enregistrements.

Les requêtes peuvent devenir tres complexes : demander la liste des clients dont le nom commence par la lettre "J", qui habitent à Paris, qui ont commandé l'article référencé "512GH" entre le 1er Juillet et le 1er Septembre, et dont le prix total de la commande se situe entre 100 et 200 euros, puis les classer par montant de la commande, dans l'exemple de la boutique.


Questions fréquentes :

- Comment écrire une page dynamique, avec quel outil? quel éditeur?
Comme une page HTML, c'est un fichier qui ne comprend que du texte, des balises et des commandes. Le notepad peut donc suffir, mais il existen bien entendu des outils plus avancés qui peuvent vous aider à programmer de manière visuelle vos pages avec des drag'n'drop, vous en trouverez une liste ici mais également Dreamweaver pour ASP ou PHP ou encore WebMatrix pour .Net.

- Je voudrais essayer chez moi tranquillement sans acheter d'hébergement?
C'est bien évidemment possible. Il faut installer un serveur web ainsi que les modules : IIS pour programmer en ASP, ASP.net ou PHP, ou Apache pour faire du PHP.

- Où écrire mon code ASP ou PHP et HTML,à quel endroit?
Le code ASP ou PHP s'écrit à l'endroit précis où l'action doit s'effectuer. Celà peut être au milieu d'un tableau, d'un texte, au début, à la fin de lapage, n'importe où, là où vous en avez besoin.

- Avant d'insérer des commandes ASP ou PHP, mon code HTML marchait bien sur Netscape et là plus rien?
L'éxecution des commandes ASP ou PHP ne fait rien d'autre que de produire et renvoyer du code HTML comme VOUS le lui demandez. C'est à vous de rendre compatible votre code, le serveur ne renvoit que ce qu'on lui demande renvoyer.


Ludo le 15/10/2003 (73 526 hits)
Didier Testez gratuitement la plateforme web de Windows Server 2008 !
Gagnez un voyage aux Etats-Unis pour la MS Project Conference !
Au fil des news  
Adobe - Adobe annonce MAX 2009 !
[MAJ] Dreamweaver MX + Php + MySql - Les formulaires - partie 3
Mise à jour du code, par DB 77, affichage du code erreur, dans la page erreur.php, traduction des ...
PHP - News avec photo - Système de gestion - affichage
Gestion - Administration - Affichage d'une "News", "Actualité", "Info", ... avec : - mise en forme ...
Dreamweaver Php Mysql - Région répétée imbriquée
Je rebondis, sur un post du forum, pour vous montrer comment obtenir grâce à l'extension Simulated ...
Gérer les bases de contenu SharePoint - Gérer la croissance du volume des données
Dans le cadre de la gestion quotidienne de ferme SharePoint, il existe une partie qu'il faut ...
PHP - Le Coach PHP sur Visual Studio
.NET - Ecrire une application .NET utilisant MySQL
PHP - Utilisation de PHP dans le monde Microsoft
Magazines - Le n° 119 de Programmez est disponible
Adobe - Adobe annonce Photoshop Marketplace
[MAJ] Tutoriel AJAX simple - En avant vers le WEB2.0
Mis à jour le 20/04/2009
Captcha «maison» sans extension - Et en plus, c'est gratuit ;)
Un ami m'a demandé de l'aide ce matin pour insérer un captcha dans un formulaire pour son site ...
Dreamweaver CS4 - Photoshop CS4 - Alliance parfaite pour la gestion des images
Pour changer un peu des pages de code, je vous propose de voir ensemble, la fonctionnalité très ...
JavaScript - Calcul automatique d'une facture
Amélioration du Search MOSS: Manipulation XSL - Utilisation du XSL dans l'affichage des résultats
Parmi tous les articles sur l'amélioration du moteur de recherche de Microsoft Office SharePoint ...
Outils - Editeur d'icônes IcoFX
Magazines - Le n°118 de Programmez est disponible
JavaScript - Imprimer une autre page que celle en cours
CSS - div pour imiter frame (Bandeau/Menu FIXES)
[MAJ] [PHP] Un calendrier très complet -
ajout des événements au calendrier
PowerShell - Winforms pour l'aide des commandes GET PowerShell
Adobe - Adobe Photoshop Lightroom 2 est offert ....
Amélioration du Search MOSS: synonyme et Best Bet - La gestion des synonymes dans MOSS Search
Le moteur de recherche de MOSS permet la configuration d'une liste de synonymes. Nous verrons donc ...
AJAX - récup champs formulaires pour POST en AJAX
PowerShell - Un windows Forms pour SharePoint en PowerShell
Sondage associatif (compatibilité) - Qui va bien avec qui ?
Cette fois, c'est un petit sondage que je vous propose. Il pourra bien sûr être adaptée à vos ...
ASP - Hashage MD5 (cryptage irréversible)
Adobe - 80% de réduction sur les versions Adobe Creative
CSharp - Interroger un serveur Whois
CSharp - Equivalent de la fonction PHP htmlentities()
CSharp - Somme de contrôle CRC32
Magazines - Le n°117 de Programmez est disponible
Hebergement - Hébergement ASP et ASP.Net
MOSS - Mon Profil - Personnalisation des profils utilisateurs de MOSS
La gestion des profils utilisateurs de SharePoint fait partie des fonctionnalités de base de ...
Dreamweaver CS3 + Php + Mysql - Le Jeu d'Enregistrements - Les fondamentaux Part-3
La 3ème partie des fondamentaux, traitera essentiellement du jeu d'enregistrements ou Recordset. ...
Mon mini-site @ Home - avec Windows, Free, Wamp & DynDNS
Envie d'héberger votre petit site chez vous, sur votre ordinateur ? de partager des fichiers avec ...
Magazines - Le n°116 de Programmez est disponible
Recevoir ses identifiants par mél - Bien pratique pour les petites têtes
Encore une question posée sur le forum et zou... Le problème est simple : On a oublié ses ...
ASP.NET - code pour le bouton enregistrer
Microsoft - Grand jeu-concours MSDN : l'indice d'ASP-PHP.net !
Tutorial : HTML | Scripting | ASP-PHP | ASP.net | SQL Server | XML
Sharepoint | XAML | Pocket | Dreamweaver | VML | Divers
  Scripts : Scripting | ASP-PHP | ASP.net | Divers
  Boutique | Annuaire | Bannières | Météo | Tribune | Partenariats
v3b © Didier 2003   
 

Corpo Sciences de Reims Partitions gratuites Carte, météo, annonces
 Codes Sources El Roubio MVP The Inquirer FR Wygwam ASP-magazine CodePPC Groupes Utilisateurs Microsoft DotNet Project TechNet