bump

Author: LoicGrobol

_pages/archives/2023/projects.md

@@ -1,7 +1,7 @@
 ---
 title: Projets Interfaces web pour le TAL 2023
 layout: default
-permalink: /projects/
+permalink: /2023/projects/
 ---
 
 [comment]: <> "LTeX: language=fr"

_pages/archives/2024/projects.md

@@ -0,0 +1,103 @@
+---
+title: Projets Interfaces web pour le TAL 2023
+layout: default
+permalink: /2024/projects/
+---
+
+[comment]: <> "LTeX: language=fr"
+
+Projets
+========
+
+Votre travail sera de réaliser une interface web en Python pour un système de TAL, de traitement ou
+d'accès à des données. Elle devra au moins comprendre une interface programmatique sous la forme
+d'une API REST utilisable par un serveur ASGI (c'est par exemple le cas de celles réalisée en
+FastAPI que vous avez vues en cours) et une interface utilisateur qui pourra prendre la forme d'un
+script ou très, très préférablement d'une interface web HTML + CSS [+ js]
+
+Ce projet peut évidemment être en lien avec d'autres cours, d'autres projets ou votre travail en
+entreprise (mais assurez-vous avant que ce soit OK de partager votre code avec moi dans ce cas).
+
+On peut éventuellement relaxer ces exigences si vous avez une idée spécifique, mais commencez par
+m'en parler avant.
+
+## Consignes
+
+- Projet à rendre le 1er mars 2023 *au plus tard*
+- Projet de préférence collectif, par groupe de 2 ou 3
+  - Si c'est un problème pour vous, venez me voir, tout est négociable
+  - S'il y a un problème — quel qu'il soit — dans votre groupe, n'hésitez pas à m'en parler
+
+Le rendu devra comporter :
+
+1. Une documentation du projet traitant les points suivants :
+
+   - Les objectifs du projet
+   - Une description du système ou des données auxquelles l'interface permet d'accéder
+   - La méthodologie (comment vous vous êtes répartis le travail, comment vous avez identifié les
+     problèmes et les avez résolus, différentes étapes du projet…)
+   - L'implémentation ou les implémentations (modélisation le cas échéant, modules et/ou API
+     utilisés, différents langages le cas échéant)
+   - Les résultats (fichiers output, visualisations…) et une discussion sur ces résultats (ce que
+     vous auriez aimé faire et ce que vous avez pu faire par exemple)
+
+   On attend de la documentation technique, pas une dissertation. Elle pourra prendre le format d'un
+   ou plusieurs fichiers, d'un site web, d'un notebook de démonstration, à votre convenance
+
+   **La documentation ne doit pas, jamais, sous aucun prétexte, comporter de capture d'écran de
+   code.**
+
+2. Le code Python et les codes annexes (JS par ex.) que vous avez produit. Le code *doit* être
+   commenté. **Évitez les notebooks** (de toute façon ce n'est pas idéal pour des interfaces web).
+
+3. Les éventuelles données en input et en output (ou un échantillon si le volume est important)
+
+N'hésitez pas à vous servir de git pour versionner vos projets !
+
+## Conseils
+
+Écrivez ! Tenez un carnet : vos questions, un compte-rendu de vos discussions,
+les problèmes rencontrés, tout est bon à prendre et cela vous aidera à rédiger
+la documentation finale.
+
+## Ressources
+
+### Hébergement
+
+- [Python Anywhere](https://help.pythonanywhere.com/pages/Education)
+
+### Données géo-localisées
+
+Il existe beaucoup de choses pour travailler avec des données géo-localisées. Allez voir en vrac :
+[Geo-JSON](http://geojson.org/), [uMap](http://umap.openstreetmap.fr/fr/) pour créer facilement des
+cartes en utilisant les fonds de carte d'OpenStreetMap, [leaflet](http://leafletjs.com/) une lib JS
+pour les cartes interactives, [overpass turbo](http://overpass-turbo.eu/) pour interroger facilement
+les données d'OpenStreetMap (il y a une [api !](http://www.overpass-api.de/)).
+
+### Ressources linguistiques
+
+N'hésitez pas à aller fouiller dans [Ortolang](https://www.ortolang.fr/) ou
+[Clarin](https://lindat.mff.cuni.cz/repository/xmlui/) des ressources linguistiques exploitables
+librement et facilement. Vous pouvez aussi aller voir du côté de l'API twitter pour récupérer des
+données (qui ne sont pas nécessairement uniquement linguistiques)
+
+### Open Data
+
+Quelques sources : [Paris Open Data](https://opendata.paris.fr),
+[data.gouv.fr](https://data.gouv.fr), [Google dataset
+search](https://toolbox.google.com/datasetsearch)
+
+## Idées
+
+### Accès aux données
+
+Réaliser une interface pour exploiter une ressource (linguistique ou autre).
+
+- Soit en rendant lisible des données massives en faisant des stats
+- Soit en faisant apparaître des représentations pertinentes de données
+  individuelles complexes (syntaxe, entités nommées, sentiment…)
+
+### Interfaces systèmes
+
+Réaliser une interface permettant d'accéder facilement à un système de TAL, dans l'esprit de
+[UDPipe](https://lindat.mff.cuni.cz/services/udpipe/) par exemple.

_pages/projects.md

@@ -1,5 +1,5 @@
 ---
-title: Projets Interfaces web pour le TAL 2024
+title: Projets Interfaces web pour le TAL 2025
 layout: default
 permalink: /projects/
 ---
@@ -21,12 +21,26 @@ entreprise (mais assurez-vous avant que ce soit OK de partager votre code avec m
 On peut éventuellement relaxer ces exigences si vous avez une idée spécifique, mais commencez par
 m'en parler avant.
 
+Contrainte spécifique pour 2025 : pas de chatbot ou d'interface pour LLM. Vous en voyez déjà bien
+assez par ailleurs, ça vous changera les idées.
+
 ## Consignes
 
-- Projet à rendre le 8 mars 2024 *au plus tard*
+- Composition des groupes et sujets des projets à envoyer avant le 20 janvier 2025 (envoyer un mail
+  par groupe avec vos noms, prénoms et établissements et une description concise, mais précise du
+  projet). Si vous avez un doute sur la pertinence ou la faisabilité du projet, venez m'en parler
+  avant.
+- Projet à rendre le 8 mars 2025 *au plus tard*
 - Projet de préférence collectif, par groupe de 2 ou 3
   - Si c'est un problème pour vous, venez me voir, tout est négociable
   - S'il y a un problème — quel qu'il soit — dans votre groupe, n'hésitez pas à m'en parler
+- Rendus par mail à `lgrobol@parisnanterre.fr` avec en objet `[web2025] Projet final` et les noms,
+  prénoms et établissements de tous les membres du groupe dans le corps du mail.
+  - **Si l'objet est différent, je ne verrai pas votre rendu**. Et si un nom manque, vous risquez de
+    ne pas avoir de note.
+  - J'accuserai réception sous trois jours ouvrés dans la mesure du possible, relancez-moi si ce
+    n'est pas le cas.
+
 
 Le rendu devra comporter :
 

index.md

@@ -8,6 +8,8 @@ layout: default
 
 ## News
 
+- **2024-12-17** Les [consignes pour les projets]({{site.url}}{{site.baseurl}}/projects) sont en
+  ligne.
 - **2024-11-19** Premier cours du semestre le 28/11/2023.
 
 ## Infos pratiques
@@ -84,6 +86,20 @@ nom de fichier devra être de la forme `prénom_nom-établissment.zip`, `établi
   - {% notebook_badges slides/07-fastapi/solutions.py.md %}
     [Solutions]({{site.url}}{{site.baseurl}}/slides/07-fastapi/solutions.py.ipynb)
 
+### 2024-12-17 — Outils de debug et HTML
+
+- {% notebook_badges slides/08-html/html-slides.py.md %} [Slides
+  HTML]({{site.url}}{{site.baseurl}}/slides/08-html/html-slides.py.ipynb)
+  - [Exemples](https://github.com/{{site.repository}}/tree/main/slides/08-html/examples)
+  - {% notebook_badges slides/08-html/solutions.py.md %}
+    [Solutions]({{site.url}}{{site.baseurl}}/slides/08-html/solutions.py.ipynb)
+- {% notebook_badges slides/09-debug/debug-slides.py.md %} [Slides
+  Debug]({{site.url}}{{site.baseurl}}/slides/09-debug/debug-slides.py.ipynb)
+  - [`factorial.py`]({{site.url}}{{site.baseurl}}/slides/09-debug/factorial.py).
+  - [`lintme.py`]({{site.url}}{{site.baseurl}}/slides/09-debug/lintme.py).
+  - [`debugme.py`]({{site.url}}{{site.baseurl}}/slides/09-debug/debugme.py).
+    - [`ancor.txt`]({{site.url}}{{site.baseurl}}/slides/09-debug/ancor.txt).
+
 ## Utilisation en local
 
 Les supports de ce cours sont écrits en Markdown, convertis en notebooks avec

slides/06-functions++/functions++.py.md

@@ -1310,8 +1310,6 @@ temps ajouté (avec `time.sleep`) à chaque appel de fonction.
 <!-- #endregion -->
 
 <!-- #region slideshow={"slide_type": "slide"} -->
-## ⏳ Exo ⏳
-
 ## Et après
 
 Allez lire [le tuto de Real

slides/08-html/html-slides.py.md

@@ -144,7 +144,8 @@ def make_ul(elems: List[str], path: str):
 
 # Pour tester
 make_ul(["The Beths", "Beirut", "Death Cab for Cutie"], "local/moody_bands.html")
-print(open("local/moody_bands.html").read())
+with open("local/moody_bands.html") as in_stream:
+    print(in_stream.read())
 ```
 
 <!-- #region slideshow={"slide_type": "fragment"} -->
@@ -184,7 +185,12 @@ HTML(lxml.html.tostring(html, encoding=str))
 ## Avec FastAPI
 
 Pour afficher du HTML quand on accède à votre point d'accès FastAPI, vous pouvez utiliser
-`fastapi.responses.HTMLResponse`, ce qui indique par exemple au navigateur qu'il faut interpréter les données reçues comme une page web.
+[`fastapi.responses.HTMLResponse`](https://fastapi.tiangolo.com/reference/responses/?h=html#fastapi.responses.HTMLResponse)
+(qui n'est en fait rien de plus qu'un wrapper de
+[`starlette.responses.HTMLResponses](https://www.starlette.io/responses/#htmlresponse)).
+Fondamentalement, ça ne fait que mettre vos données dans une réponse générique avec un header
+`media_type = "text/html"`, mais c'est plus lisible comme ça
+
 <!-- #endregion -->
 
 ```python slideshow={"slide_type": "subslide"}
@@ -227,9 +233,9 @@ Et allez voir <http://localhost:8000>
 <!-- #endregion -->
 
 <!-- #region -->
-1\. Concevoir une API avec FastAPI qui reçoit des requêtes de type POST contenant une liste de
-chaînes de caractère et répond avec une page HTML qui contient une liste ordonnée dont les
-éléments sont les chaînes de caractères reçus.
+1\. Concevoir une API qui reçoit des requêtes de type POST contenant une liste de chaînes de
+caractère et répond avec une page HTML qui contient une liste ordonnée dont les éléments sont les
+chaînes de caractères reçus.
 
 Bien entendu, vérifiez que votre HTML passe au [valideur du W3C](https://validator.w3.org).
 
@@ -270,12 +276,9 @@ Ce qui serait **bien** ça serait de pouvoir écrire du HTML normalement et en P
 Jinja.
 <!-- #endregion -->
 
-```python slideshow={"slide_type": "fragment"}
-%pip install -U Jinja2
-```
-
 <!-- #region slideshow={"slide_type": "subslide"} -->
-Jinja est un « moteur de templates » (*template engine*), c'est un genre de `str.format` ou de *f-string*. Voyez plutôt :
+Jinja est un « moteur de templates » (*template engine*), c'est un genre de `str.format` ou de
+*f-string*. Voyez plutôt :
 <!-- #endregion -->
 
 ```python
@@ -285,12 +288,17 @@ t.render(something="World")
 ```
 
 <!-- #region slideshow={"slide_type": "subslide"} -->
-OK, super mais ça on sait déjà faire
+OK, super, mais ça on sait déjà faire
 <!-- #endregion -->
 
 ```python slideshow={"slide_type": "fragment"}
 s = "Hello {something}"
-s.format(something="World")
+print(s.format(something="World"))
+```
+
+```python slideshow={"slide_type": "fragment"}
+something="World"
+print(f"Hello {something}")
 ```
 
 <!-- #region slideshow={"slide_type": "fragment"} -->
@@ -419,8 +427,9 @@ En plus, les bons IDE supportent la syntaxe de Jinja, vous devriez donc au moins
 
 <!-- #region slideshow={"slide_type": "subslide"} -->
 Parmi les autres fonctions intéressantes, Jinja permet d'échapper automatiquement le HTML, afin de
-se prémunir des injections de code. Par exemple si on reprend l'environnement précédent mais qu'on
-change un peu les données (ce qui peut arriver si les données en question ne sont pas gérées directement par vous, mais sont issues des utilisateurs de votre application).
+se prémunir des injections de code. Par exemple si on reprend l'environnement précédent, mais qu'on
+change un peu les données (ce qui peut arriver si les données en question ne sont pas gérées
+directement par vous, mais sont issues des utilisateurices de votre application).
 <!-- #endregion -->
 
 ```python
@@ -436,7 +445,9 @@ display(HTML(lst))
 ```
 
 <!-- #region slideshow={"slide_type": "subslide"} -->
-Évidemment ici ce n'est pas très grave, `<strong>` n'est pas un tag très dangereux. En revanche on peut faire beaucoup de choses avec `<script>`. Pour un exemple, décommentez la dernière ligne de la cellule suivante, puis exécutez la.
+Évidemment ici ce n'est pas très grave, `<strong>` n'est pas un tag très dangereux. En revanche on
+peut faire beaucoup de choses avec `<script>`. Pour un exemple, décommentez la dernière ligne de la
+cellule suivante, puis exécutez-la.
 <!-- #endregion -->
 
 ```python
@@ -451,7 +462,7 @@ print(lst)
 # display(HTML(lst)) 
 ```
 
- Pour éviter ça :
+Pour éviter ça :
 
 
 ```python
@@ -488,7 +499,7 @@ Voici le contenu de [`examples/templates/hello.html.jinja`](examples/templates/j
 </head>
 <body>
     <h1>Hello, {{name}}</h1>
-    <p>How do you do, fellow nerd?</p>
+    <p>How do you do, fellow kids?</p>
 </body>
 </html>
 ```
@@ -523,5 +534,5 @@ Lancez cette API avec `uvicorn jinja_api:app` et allez à <http://localhost:8000
 <!-- #region slideshow={"slide_type": "slide"} -->
 ## 🙄 Exo 🙄
 
-Reprenez les APIs de 🧊 et réécrivez-les en Jinja. Si, si, c'est pour votre bien.
+Reprenez les APIs de 🧊 et réécrivez-les en Jinja. C'est pour votre bien.
 <!-- #endregion -->