« STIC:STIC II - exercice 10 (Volt) » : différence entre les versions

Dernière version du 20 février 2017 à 16:40

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

STIC

Enoncé de l'exercice 10

Cours Bases: répondre au questionnaire SVP

Objectifs de cet exercice STIC II:

Construire des DTDs pour XML
Faire des transformation simples avec XSLT (affichage et filtrage de données XML)
Mise en page du résultat HTML

.... oui on compte à partir de 10 :)

Tâche

Créer une DTD simple sur un sujet de votre choix, mais en rapport avec une thématique "MALTT"
La DTD doit aider un auteur à rédiger un type de texte pour un public cible (apprenant, enseignant, concepteur, etc.). Ne faites pas une spécification pour un fichier d'échange de données (genre SVG, DocX, etc.) et ne faites pas une application administrative SVP.
Afficher avec une feuille de style XSLT un contenu XML valide crée avec cette DTD
Bonus:
- associer une CSS au résultat HTML
- créer des graphiques SVG
- Créer 2 variantes du XSLT (utiliser le même fichier XML et afficher autre chose)
Ecrire un rapport
Participer au Wiki (en rapport avec la thématique de l'exercice ou du cours)

Emplacement de la page d'accueil / rapport:

 /etu-maltt/<promo>/<login>/stic-2/ex10/

par exemple:

 /etu-maltt/qwerty/user1/stic-2/ex10/

Donc ex10 et ne pas exercice 10 etc. !!

Contraintes

Contenu selon vos envies et possibilités, mais en rapport avec les thématiques de MALTT
Vous pouvez soit définir une nouvelle DTD, soit adapter une DTD existante (que vous devez citer)
La DTD doit être correcte et vos contenus doivent être valides (respecter la DTD)

Il faut donc produire au moins 4 fichiers:

Une DTD,
un fichier *.xml
un fichier *.xsl associés à ce fichier xml
un rapport
En option: Fichiers CSS, images, 2ème XSLT, etc.

Le rapport doit inclure:

Titre, auteur et date
Le résultat:
- Lien vers la DTD
- Lien vers le fichier XML
- Lien vers le *.XSLT qui va avec (et la CSS si vous en utilisez)
Objectifs DTD: Elle sert à quoi ?
Documentation de la DTD (peut aussi être faite dans la DTD)
Objectifs XSLT: Comment avez-vous pensé la mise en page ?
La production: bref résumé de la démarche
Contribution Wiki
Difficultés, auto-évaluation, remarques
Ressources utilisées, bibliographie.

Evaluation

Voici la liste des critères d'évaluation. Chaque donne entre 0 et 0.6 points.

Qualité du rapport Y compris discussion des besoins et du vocabulaire, références, réflexions.
Qualité technique: Validité des fichiers XML, XSLT et de la DTD
Respect des contraintes: Y compris noms de répertoires, etc.
Documentation technique: Interne (notamment dans la DTD) et/ou externe
Respect de délais
Thématique et formulation d'objectifs en rapport avec vos études: Soyez créatifs, faites plus qu’une simple structure tabulaire ! Evitez donc les DTD pour gérér vos CD et vos livres ....
User experience: Ergonomie et qualité de la présentation (X)HTML
Richesse: Complexité, difficulté, originalité. etc.
Volume: Fichier XML qui permet de tester la DTD pour de vrai
Participation au wiki: (en dehors de la page discussion !)

Propositions wiki-writing

A vous de choisir, mais on suggère de choisir un sujet en rapport étroit avec une des tâches.

Compléter XML
Compléter/améliorer Tutoriel XSLT débutant
Traduire (au moins une partie de) en:XSLT to generate SVG tutorial. Déjà traduit => Tutoriel pour générer du SVG avec du XSLT
Compléter/améliorer Tutoriel DTD
XML dans l'éducation
Documenter un éditeur XML, ou améliorer Exchanger_XML_Editor
Faire un article en rapport avec un autre exercice, par exemple eXe
Décrire un vocabulaire XML qui vous intéresse (regardez ce que publie W3C,, OASIS,....)
Voir aussi la catégorie en:XML (possibilité de faire un bout de traduction par exemple)

Activités en classe

Tour de logiciels

Java SDK si ce n'est pas déjà fait. Il faut installer cet environnement, car plusieurs programmes que nous allons utiliser en ont besoin.

Ensuite, installer / utiliser un éditeur XML si c'est pas déjà fait. Voici quelques choix:

Editeur XML - Choix 1

Exchanger_XML_Editor
Exchanger XML Editor lite (PC/Mac/Unix). Donwload chez Google code. Vérifiez que c'est au moins la version 3.3 (pas prendre chez xchanger.com (site abandonné).

Editeur XML - Choix 2

epcEdit (Linux, Windows)
Le plus convivial à utiliser (mais pas à installer)

XML Copy editor - Choix 3

XML Copy Editor
Download: XML Copy editor (Linux, windows)
Le plus facile à installer ! Assez facile à utiliser, mais moins puissant !.
Peut valider toutes sortes de schémas.

Editeur XML - autres choix

C.f. XML editor

Introduction à XML

Déjà faite dans le séminaire d'initiation. Pour rappel:

XML
Introduction à XML et DOM (slides)
Introduction technique à XML (HTML) - PDF, (transparents)

Warm-up - éditer une DTD de cuisine (pour ceux/celles qui veulent s'exercer un peu ...)

Copiez ces fichiers:

ATTENTION: il faut "sauver les lien sous" / "save link as" ! Pas afficher dans le navigateur et sauver ensuite ...

Avec votre éditeur XML, ouvrez le document cuisine-template.xml

Entrez une recette ...

Créer une DTD

Tutoriel DTD (exposé)
Démo XML Exchanger lite: en:Exchanger XML Editor
- Il faut fermer/ouvrir le fichier XML après avoir introduit le doctype plus l'élément racine (c'est un petit bug)

Créez une DTD
1. Imaginez un domaine à modéliser
2. Esquissez ses éléments sur papier
3. Créez le fichier DocType.

Exemple que vous pouvez copier/coller si vous sentez le besoin de vous exercer avec qc. qui a déjà été fait.

 <!ELEMENT addressBook (person)+>
 <!ELEMENT person (name,email*)>
 <!ELEMENT name (family,given)>
 <!ELEMENT family (#PCDATA)>
 <!ELEMENT given (#PCDATA)>
 <!ELEMENT email (#PCDATA)>

Enregistrez la DTD dans un fichier qui s'appelle addressBook.dtd ou un autre nom de votre choix.

Faites un fichier XML avec cette DTD en partant du patron suivant:

<?xml version="1.0"?>
<!DOCTYPE addressBook SYSTEM "addressBook.dtd">

<addressBook>

</addressBook>

Explications:

"addressBook" est le nom de l'élément racine. La DTD ne l'indique pas, il faut donc l'indiquer à XML dans la ligne qui définit le Doctype. C'est pareil pour XHTML ou SVG ...
Remplacez "addressBook" et "addressBook.dtd" avec votre élément racine et votre nom de fichier.

Introduction à XSLT (exposé)

Tutoriel XSLT débutant
en:XSLT to generate SVG tutorial
Introduction technique à XSLT - PDF file , (transparents)

Activité XSLT

(1) Regardez d'abord des examples, notamment la recette de cuisine ci-dessus !

Sinon, fouillez par exemple les exemples très simples: http://tecfa.unige.ch/guides/xml/examples/xsl-simple/

(2) Pour votre XML/DTD faites une simple feuille de style XSLT

Copiez/collez le chablon ci-dessous si vous voulez et remplacez "VOTRE_RACINE, "UN_ELEMENT" par vos éléments. Sinon, la plupart des éditeurs XML offrent une assistance XSLT.

Chablon XSLT à copier dans un nouveau fichier *.xsl

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">

  <xsl:output method="html"/>

  <xsl:template match="VOTRE_ELEMENT_RACINE">
    <html>
      <body bgcolor="#FFFFFF">
        <xsl:apply-templates/>
      </body>
    </html>
  </xsl:template>

  <xsl:template match="UN_ELEMENT">
    
  </xsl:template>

  <xsl:template match="UN_ELEMENT">
    
  </xsl:template>
</xsl:stylesheet>

Chablon fichier XML avec XSLT

<?xml version="1.0" ?>
<!DOCTYPE VOTRE_RACINE SYSTEM "VOTRE_DTD.dtd">
<?xml-stylesheet href="VOTRE_STYLE.xsl" type="text/xsl"?>

<VOTRE_RACINE>

</VOTRE_RACINE>

Utilisation de Exchanger

Lire Exchanger XML Editor ou en:Exchanger XML Editor. Au moins regarder les images dans les sections qui concernent XSLT.
Il est impératif de choisir Saxon (XSLT 2.0) comme engin. Les autres ont disparu dans l'installation ..... (file->Preferences; XML Tab)

Ressources

Transparents: TECFA's XML page; Introduction à XML et DOM - PDF file , (transparents); Introduction technique à XML - PDF file , (transparents); Introduction technique à XSLT - PDF file , (transparents)

Manuels électroniques (PDF et dPUB sur XML): [docs protégés]

Exemples de DTD: http://tecfa.unige.ch/guides/xml/examples/dtd-examples/; http://tecfa.unige.ch/guides/xml/examples/xsl-simple/

Informations sur les DTD: Généralités sur les DTD; Analyse de données préparatoire à la conception d'une DTD. Cette page propose 6 phases bien distinctes pour le développement d'une DTD.

Pages wiki fr: XML (survol conceptuel); Tutoriel DTD (important, comprend les éléments pour réussir l'exercice); Encodage de caractères; Tutoriel XSLT débutant (contenu similaire aux transparents XSLT); XML Schema

Pages wiki en anglais: en:Editing XML tutorial (tutoriel pour utiliser un schéma XML); en:DTD tutorial; XML (en, mini-tutoriel + liens); XML editor (on conseille Exchanger light, si vous n'arrivez pas à l'installer, essayez d'autres comme epcedit); XSLT (en, liens); XSLT Tutorial (en, mini-tutoriel); Character encoding (en, liens encodage); Cours COAP; La catégorie XML; en:Exchanger XML Editor (Important'), la version française n'est qu'une ébauche.

« STIC:STIC II - exercice 10 (Volt) » : différence entre les versions

Dernière version du 20 février 2017 à 16:40

Sommaire

Enoncé de l'exercice 10

Tâche

Contraintes

Evaluation

Propositions wiki-writing

Activités en classe

Tour de logiciels

Introduction à XML

Créer une DTD

Introduction à XSLT (exposé)

Activité XSLT

Ressources

Menu de navigation

« STIC:STIC II - exercice 10 (Volt) » : différence entre les versions

Dernière version du 20 février 2017 à 16:40

Enoncé de l'exercice 10

Tâche

Contraintes

Evaluation

Propositions wiki-writing

Activités en classe

Tour de logiciels

Introduction à XML

Créer une DTD

Introduction à XSLT (exposé)

Activité XSLT

Ressources

Menu de navigation

Rechercher

« STIC:STIC II - exercice 10 (Volt) » : différence entre les versions