cours/applications_internet_2APP/projet_wiki

Ajouter

  • utilisation d’Axios
  • gestion du déploiement
  • attendu : REDAME avec instruction d’installation

Projet wiki

Ce projet vise à créer un wiki simple. Les pages du wiki sont identifiées par la partie pathname de l’url, par exemple /my/page dans l’url http://localhost:8080/my/page.

Lorsque l’utilisateur tente d’ouvrir avec son navigateur une page du wiki telle que /my/page, celle-ci est affichée si elle existe déjà, sinon il est proposé à l’utilisateur de la créer.

Le contenu d’une page est codé avec la syntaxe markdown. À l’ouverture une page est en mode ‘visualisation’, c’est à dire que son contenu est non éditable et présenté sous sa forme stylisée ; l’appui sur un contrôle ‘éditer’ fait passer la page en mode ‘édition’, l’affichage stylisé étant alors remplacé par une zone de texte éditable contenant le texte source markdown, qui peut être modifié et sauvegardé.

Back-end

Le back-end de cette application fournit une API pour créer, modifier, accéder et détruire les pages. Express sera utilisé pour créer cette API et accéder aux pages statiques. PouchDB sera utilisé comme base de données ; les identifiants des documents PouchDB seront les chemins d’accès aux pages, par exemple /my/page.

Les routes à implémenter sont :

  • GET /api/pages?path=<pathname>

Renvoie le texte markdown de la page si elle existe ; si elle n’existe pas, renvoie “”. Par exemple :

$ curl http://localhost:8000/api/pages?path=/my/page
  • POST /api/pages?path=<pathname>

Créé une nouvelle page, dont le contenu initial est fourni dans les données du POST. Par exemple :

$ curl -X POST -d "# Titre" -H "Content-Type: text/plain" http://localhost:8000/api/pages?path=/my/page
  • PUT /api/pages?path=<pathname>

Modifie le contenu d’une page existante, avec le contenu fourni dans les données du PUT. Par exemple :

$ curl -X PUT -d "# Titre2" -H "Content-Type: text/plain" http://localhost:8000/api/pages?path=/my/page
  • DELETE /api/pages?path=<pathname>

Supprime une page existante. Par exemple :

$ curl -X DELETE http://localhost:8000/api/pages?path=/my/page

Front-end

Créer avec VueJS le front-end pour la mise en oeuvre des différents modes ‘création’, ‘visualisation’ et ‘édition’ du wiki.

vue-router ne doit pas être utilisé, car il interfèrerait avec la gestion dynamique des chemins d’accès.

vue-cli sera utilisé pour mettre en place le tooling nécessaire à la partie front-end.

Références