STIC:STIC I - exercice 3 (Nestor-Pixel)

Cette page fait partie des archives des cours Cours STIC (STIC I, STIC II,STIC III,STIC IV)

Enoncé de l'exercice 3

Cet exercice du cours STIC I vous permet:

• d'apprendre à éditer une page XML avec un éditeur XML
• d'apprendre un peu de XSLT
• de perfectionner vos connaissances en CSS

Tâche

• Faites votre page travaux en suivant les Instructions ci-dessous. (Notamment: Ne modifiez pas la DTD qu'on vous impose. L'exercice consiste principalement à améliorer une XSLT et à styler la sortie HTML !!)

• La page sera accessible par l’URL

  http://tecfaetu.unige.ch/etu-maltt/pixel/votre login/welcome.xml

Par exemple:

  http://tecfa.unige.ch/etu-maltt/maya/wipfli/

• Une page d'accueil/rapport pour l'exercice est à placer ici:

  /etu-maltt/pixel/login/stic/ex3/

Exemple:

 http://tecfaetu.unige.ch/etu-maltt/oda/dupont/ex3

Note: N'oubliez pas de copier aussi la DTD et la XSLT. Donc dans le répetoire etu-maltt/oda/votre login/ il faut avoir les fichiers suivants:

  /etu-maltt/oda/login/welcome.xml
  /etu-maltt/oda/login/travaux.dtd
  /etu-maltt/oda/login/travaux.xsl
  /etu-maltt/oda/login/travaux.css

Contraintes

• Cette page indexera tous vos travaux
• Il faut utiliser la DTD XML telle quelle (!) mise à votre disposition
• Vous devez adapter la feuille XSLT (PAS la DTD !)
• Le HTML généré doit être valide
• Une fois éditée votre page travail, je vous conseille de finir d'abord l'exercice 2. Votre DTD à vous sera sans doute plus simple, c.a.d. mieux adapté pour faire les premiers pas avec XSLT.
• Le HTML généré doit être stylé avec CSS

Il vous faut donc produire 4 fichiers:

• la page travail en XML
• un fichier XSLT qui va avec
• un fichier CSS importé par le XSLT
• un rapport.

Le rapport:

• Titre, auteur et date
• Le résulat: Lien vers la page travail, lien vers le fichier *.xsl utilisé
• Objectifs XSLT: Comment avez-vous pensé la mise en page ?
• La production: bref résumé de la démarche
• Difficultés, auto-évaluation, remarques
• Ressources utilisées, bibliographie.

Evaluation

• Respect des contraintes + emplacement de fichiers
• Qualité du rapport
• Style, mais créez d'abord juste le contenu. Revenez plus tard une fois que vous avez compris un peu de XSLT.

Instructions

Vous avez besoin de: Un client SFTP ou l'explorateur Windows, XEmacs et les 4 fichiers "travaux.dtd", "welcome.xml", "travaux.xsl" et "example.xml" d'être présents dans la racine de votre espace Travaux.

Etapes à suivre:

1. Copiez les 5 fichiers "travaux.dtd", "travaux.xsl", "ENLEVERwelcome.xml", "travauxdoc.txt" et "example.xml" depuis http://tecfa.unige.ch/tecfa/teaching/staf14/files/workpage/
   • Dans Firefox: "save link as" ("sauver lien sous")
   • Ne faites pas "SAVE AS" d'une page XML déjà affichée dans le navigateur Web. Vous pouvez perdre de l'information ou encore vous retrouver avec du simple HTML !
2. Renommez le fichier ENLEVERwelcome.xml en welcome.xml
3. Lancez un éditeur XML et ouvrez ce fichier "welcome.xml"
4. Remplissez les balises xml d'une façon logique qui puissent décrire votre page Travaux MALTT / STAF et n'oubliez pas de sauver de temps en temps! Vous allez trouver tous les explications que vous aurez besoin dans le fichier travauxdoc.txt.
5. Si vous travaillez en local (par ex chez vous), une fois terminé, il faut transférer tous les fichiers avec FTP dans votre espace Travaux.
6. Vérifiez les changements que vous avez fait de temps en temps avec votre browser préféré soit en local soit à l'URL suivant: http://tecfaetu.unige.ch/etu-maltt/pixel/votre login/
7. Félicitations!!! Vous avez votre première page en XML! Et si vous la trouvez pas très jolie c'est à vous maintenant de changer sa mise en forme en apprennant XSLT :) (fichier travaux.xsl)

Autres exercices de la même période

• Exercice 1
• Exercice 2

Ressources

Attention: Certains tutoriels que vous pouvez trouver sur le web ne sont pas à jour. D'autres vous engagent dans des mauvaises pistes. Essayez de tout faire avec des simples templates (pas de "if", "for" etc !).

C.f. STIC:STIC_I_-_exercice_2

Exemples

Exemples étudiants (Maya, Linus, etc.).