1. Environnement
de travail
11/2006
Fayçal TIRICH

2. Serveur de déploiement

3. Serveur de déploiement
• OS: Debian Server
• Serveur Web: Apache 2
o Principaux modules: mod_alias, mod_ssl, mod_php5, mod_rewrite...
• Base de données: MySQL 5
o Moteur de table: InnoDB, MyISAM
• Utilitaires: Shell, Shorewall, OpenSSH, SSMTP, phpMyAdmin...

4. Poste de développement

5. Poste de développement
• OS: Debian + bureau Gnome
• Editeur: Eclipse
• Principal plugin:
o PHP
Development
Tools

6. Poste de développement
o Plugin
complémentaire
 Aptana
Development Tools

7. Poste de développement
• Principaux avantages du
plugin Aptana:
o Editeur HTML,CSS,
JavaScript...
o Synchronisation
FTP/SFTP

8. Poste de développement
• Administration de la
base de données :
o MySQL Admin

9. PHP

10. PHP
• Programmation Orientée Objet

11. PHP
• Gestion d'erreurs par Exception

12. Outils de débugage

13. Outils de débugage
• PHP Debug: Classe pratique pour analyser les variables échangées
o Alternatif : Xdebug

14. Outils de débugage
• Pour Javascript/CSS/HTML : Console d'erreurs du navigateur Firefox

15. Outils de débugage
• L'extension Firebug de
Firefox

16. Outils de débugage
• Exemple de debugage Pas-
à-pas d'un code Javascript
via l'extension Firebug

17. PHP – Accès aux bases de données

18. PHP – Accès aux bases de données
• Librairie: PHP ADOdb
o Avantages :
 Abstraction des bases de données : Changer la base sans changer le code
 Codage en POO et support du PHP5
 Support des Exceptions
 Rapidité
 Gratuité
 ...

19. PHP – Accès aux bases de données
• Autres avantages de PHP ADOdb
o Méthodes pratiques de manipulation d'ordres SQL

20. PHP – Accès aux bases de données
• Autres avantages de PHP ADOdb
o Méthodes pratiques de génération d'ordres SQL

21. PHP – Accès aux bases de données
• Autres avantages de PHP ADOdb
o Mise en cache des requêtes SQL: Soulager le serveur de la base de données en
« cachant » les requêtes dans des fichiers avec une date d'expiration personnalisée
selon le cas

22. PHP – Accès aux bases de données
• Autres avantages de PHP ADOdb
o ADOdb Active Record :
 Librairie Object-Relational Mapping
implémentant les bases de données
relationnelles
 Comporte un grand nombre de fonctions
pratiques : save(), replace(), delete(),
load(), find()...
 Supporte les transactions et le caching
 Supporte la connexion multiples aux bases
de données
 Modèle objet flexible offrant la possibilité
de surcharger les méthodes de base
 ....

23. PHP – Couche présentation

24. PHP – Couche présentation
• Moteur de template Smarty :
o Séparation entre la logique applicative et la présentation:
• Par exemple pour générer
la page à gauche, on
mélange jamais le code
PHP avec le code HTML.
Cela permet de :
o Gagner du temps vu
que le codeur PHP et
le designer HTML
peuvent travailler en
parallèle.
o faciliter la
maintenance
o mieux s'organiser dans
les grands projets

25. PHP – Couche présentation
• Ainsi la page précédente est organisée comment suivant:
o Un premier fichier template ne contenant que du HTML et du code Smarty mais jamais du code
PHP ou de requêtes SQL...

26. PHP – Couche présentation
• Un deuxième fichier PHP contenant la
classe implémentant les différentes
méthodes définissant la logique
applicative

27. PHP – Couche présentation
• Un troisième fichier PHP faisant la
relation entre le premier fichier
template et le deuxième fichier PHP
contenant la bonne classe avec les
bonnes méthodes à appeler

28. PHP – Couche présentation
• Autre point fort de Smarty :
o Gestion du cache : Permet de mettre en cache des pages entières ou seulement des parties
ayant des données qui ne changent pas fréquemment afin d'éviter une re-compilation inutile
pouvant ralentir le serveur web.

29. Applications Web... lourdes

30. Applications Web... lourdes
• Toute en gardant la même logique applicative concernant la couche métier et la couche d'accès aux
données, la tendance pour la couche présentation va de plus en plus vers de nouvelles plateformes
basées sur la technique Ajax (Asynchronous JavaScript and XML) qui offrent des composants aussi
performant que les composants des bibliothèques telles que Qt , wxWidget, Swing ou celles de la
plateforme .Net

31. Applications Web... lourdes
• Plateforme Ajax adoptée : ExtJS
• Avantages :
o Compatibilité avec la majorité des navigateurs
o Peut être adaptée avec plusieurs librairies surtout Yahoo! User Interface, l'une des plus mûres
librairies Ajax
o La partie présentation est totalement indépendante du langage utilisé dans la partie backend:
On peut donc migrer de PHP à Pyton, JSP ou RubyOnRails par exemple sans changer le code
Javascript des interfaces
o Une sélection de composants complète : DataGrid, TreeView, TabPanel, ToolBar, Calendar,
Menu, Layout, ModalBox, WYSIWYG....
o Gratuite
o Support de la communauté
o ...

32. Applications Web... lourdes
• ExtJS en action

33. Exemples d'application

34. Installation et configuration du serveur

35. Préparation du serveur de
déploiement
•
Partie installation et configuration :
o Mise en place de la version Server du dernier Debian (Version 4.0 Etch au moment du
déploiement)
o Y installer et configurer OpenSSH Server (changer le port et interdire au root de se connecter à
distant)
o Installer MySQL et sécuriser le compte root
o Installer PHP5 ainsi que ses principaux modules : php5-mysql, php5-gd...
o Installer Apache2 et et ses principaux modules et surtout activer le mode rewrite et le https en
utilisant une clé auto-générée (pour le moment)
o Installer et configurer PhpMyAdmin
o Installer le firewall Shorewall et fermer tous les ports à l'exception des ports, 80, 443 et le port
de l'OpenSSH server
o Installer le package SSMTP pour pouvoir envoyer des mails depuis des commandes Shell à
l'extérieur
o Réaliser des petits scripts Shell faisant une sauvegarde compressée journalière de la base
données MySQL et une autre hebdomadaire des codes sources des sites. Ces points de sauvegarde
sont envoyés après à un compte GMAIL créé spécialement pour cette tâche de sauvegarde.

36. Partie développement

37. www.iavcha.ac.ma

38. www.iavcha.ac.ma
• Partie développement
o Le cas PHP/Smarty
www.iavcha.ac.ma

39. www.iavcha.ac.ma
• Principales fonctions du cas PHP/Smarty: www.iavcha.ac.ma
• Moteur de recherch
interne

40. www.iavcha.ac.ma
• Principales fonctions du cas PHP/Smarty: www.iavcha.ac.ma
• Compte sécurisé
pour chaque
membre du
personnel: Les
variables échangées
sont protégées
contre les attaques
du type Injection
SQL et les attaques
XSS (Cross-site
scripting)

41. www.iavcha.ac.ma
• Principales fonctions du cas PHP/Smarty: www.iavcha.ac.ma
• Modification
dynamique et
instantanée des
profils par les
membres concernés

42. www.iavcha.ac.ma
• Principales fonctions du cas PHP/Smarty: www.iavcha.ac.ma
• Module de
publication de CV
Online

43. www.iavcha.ac.ma
• Principales fonctions du cas PHP/Smarty: www.iavcha.ac.ma
• Exemple de formulaire
d'ajout/modificationd'
ne section de CV

44. www.iavcha.ac.ma
• Principales fonctions du cas PHP/Smarty: www.iavcha.ac.ma
• Résultat obtenu d'u
page personnelle d'
membre

45. www.iavcha.ac.ma
• Principales fonctions du cas PHP/Smarty: www.iavcha.ac.ma
• Partie administration
o Gestion des
utilisateurs

46. www.iavcha.ac.ma
• Principales fonctions du cas PHP/Smarty: www.iavcha.ac.ma
• Partie administration
o Gestion du
contenu

47. www.iavcha.ac.ma
• Principales fonctions du cas PHP/Smarty: www.iavcha.ac.ma
• Partie administration
o Gestion des
galeries de la
média-thèque

48. www.iavcha.ac.ma
• Principales fonctions du cas PHP/Smarty: www.iavcha.ac.ma
• Exemple du
résultat d'une
galerie Ajax

49. Gestion du Stock

50. Gestion du Stock
• Exemple 2 : Le cas PHP/ExtJs via une application de gestion de stock

51. Gestion du Stock
• Cette application
est installée dans un
serveur sécurisé
(https) pour assurer
une confidentialité
extrême des
données échangées
contre les logiciels
espions de capture
des paquets

52. Gestion du Stock
• Exemples de
composants utilisés
dans cette application:
o ModalBox
o TreeView
personnalisable
o Layout
dimensionable
o DatePicker
o ComboBox avec
auto suggestion
o Data Grid (Triable,
dimensionable,
colonnes cachées,
pagination...)
o ....

53. Gestion du Stock
• Exemple de
personnalisation d
rendu des
composants:
coloration des
cellules d'une
DataGrid selon une
règle spécifique de
gestion

54. Gestion du Stock
• Génération de rapport PDF avec la librairie FPDF

55. Gestion du Stock
• Exemple de graphe synthétique de type « Ligne » créé avec la librairie PlotKit

56. Gestion du Stock
• Un autre exemple de graphe camembert en utilisant la même librairie PlotKit

57. Conclusion

58. Conclusion
• Ces exemples d'applications Web permettent entre autres de:
o Centraliser les applications dans des serveurs et donc éviter toute installation ou mise à jour
dans les postes clients
o Faciliter la maintenance et la sauvegarde des données
o Pratique pour les personnes mobiles qui peuvent consulter, opérer et générer des rapports
depuis n'importe quel ordinateur connecté à internet
o Renaître des vieux ordinateurs clients vu que la majorités des traitements se font du coté
serveur
o Annuler le coût software en utilisant des librairies gratuites
o Minimiser le coût hardware en optant pour Debian/Apache/PHP/MySQL aptes à assurer une
performance extrême même dans des serveurs plutôt modestes
o Dans le coté fonctionnel; offrir des solution informatiques limitant les erreurs et augmentant
l'efficacité dans le travaille quotidien tout en donnant des outils fiables d'aides à la décision
aux responsables
o ...

59. Exemples d'applications en cours de réalisation
• Application de gestion de budgets
• Application de gestion d'ordre de missions
• Site Web référentiel de la collection du jardin botanique du Complexe Horticole d'Agadir
• Application de gestion des notes
• Application de gestion de bibliothèque avec interface Web pour consultation en ligne depuis
internet
• ...

60. Merci pour votre attention