ERG::Code-2020-2

Introduction

Ce cours est destiné aux étudiant.e.s de BAC3. Cette année, nous nous concentrons sur les bases de données, définies comme "une collection structurée d'éléments sur laquelle l'utilisateur.trice peut effectuer une série d'opérations: voir, naviguer, chercher" (Lev Manovich, Le langage des Nouveaux Médias).

Sessions

19 novembre 2020

html et css

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Sélecteurs css</title>
    <link href="styles.css" rel="stylesheet" type="text/css">
  </head>
  <body>
    <section id="actualite">
      <h1>Ma section actualité</h1>
      <article class="breve">
        <header>Chapeau de l'article</header>
        <div>
          Contenu de l'article <a href="http://www.curlybraces.be">Un lien vers un site</a>
          <h3>Sous-titre de l'article</h3>
          <time>13:00</time>
          <time>13:00</time>
          <time data-type="begin-hour">15:00</time>

        </div>
        <footer>Footer de l'article</footer>
      </article>
      <article class="article-full">
        <header>Chapeau de l'article 2</header>
        <div>
          Contenu de l'article 2 <a href="http://www.curlybraces.be">Un lien vers un site</a>

        </div>
        <footer>Footer de l'article 2</footer>
      </article>
      <article class="article-full">
        <header>Chapeau de l'article 3</header>
        <div>
          Contenu de l'article 3 <a href="http://www.curlybraces.be">Un lien vers un site</a>

        </div>
        <footer>Footer de l'article 3</footer>
      </article>
    </section>

    <section id="archives">
      <h1>Ma section Archives</h1>
      <article class="breve">
        <header>Chapeau de l'article</header>
        <div>
          Contenu de l'article <a href="http://www.curlybraces.be">Un lien vers un site</a>

        </div>
        <footer>Footer de l'article</footer>
      </article>
    </section>
  </body>
</html>

/*pointeur css vers balise html*/
html, body{
  margin:0;
  padding:0;
}
h1{
  font-family:Helvetica, Arial, sans-serif;
  font-weight:normal;
  margin:10px;
  padding:10px;
  border:1px solid black;
}
/*pointeur css vers un ID*/
section#archives{
  background-color:gray;
}

article{
  border-bottom:1px solid black;
}
/*pointeur css vers une classe*/
.breve{
  font-size:48pt;
  border-bottom:2px solid black;
}
.article-full{
  font-size:16pt;
}
/* pointeur css avec chemin */
section#actualite a{
  color:green;
}
section#actualite article.article-full a{
  color:red;
}
/* pointeur css avec chemin vers un enfant précis d'une balise */
section#actualite article.article-full:nth-child(3) a{
  color:pink;
}

/*pointeur css avec un chemin vers un élément qui suit directement un autre élément*/
h3+time{
  background:green;
}

time[data-type='begin-hour']{
  background:blue;
}

Librairies Python

pour naviguer:
- pycurl (http://pycurl.io/)
- urllib2 (https://docs.python.org/2/library/urllib2.html)
- requests (https://requests.readthedocs.io/en/master/)
- mechanize (https://mechanize.readthedocs.io/en/latest/index.html)
pour parser:
- beautifulsoup (https://www.crummy.com/software/BeautifulSoup/bs4/doc/)
- lxml (https://lxml.de/xpathxslt.html)
- cssselect (https://cssselect.readthedocs.io/en/latest/)

User agent :
- What is my browser (https://www.whatismybrowser.com/guides/the-latest-user-agent/firefox)

#!/usr/bin/python
# -*- coding: utf-8 -*-

import mechanize
import lxml.html as lh
import cssselect

br = mechanize.Browser()
br.addheaders = [('User-agent', 'Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.9.0.1) Gecko/2008071615 Fedora/3.0.1-1.fc9 Firefox/3.0.1')]
br.set_handle_robots(False)
data = br.open('https://poesie.webnet.fr/lesgrandsclassiques/Authors/B', timeout=10.0)

#br.follow_link(text_regex=r"cheese\s*shop", nr=1)

#data = br.follow_link(url=r"/lesgrandsclassiques/Poemes", nr=0)

rawdata = data.read()
unicode = rawdata.decode('utf-8', 'ignore')
src = lh.fromstring(unicode)

for selector in cssselect.parse('.author-list__link'):
    expression = cssselect.HTMLTranslator().selector_to_xpath(selector, translate_pseudo_elements=True)
    for result in src.xpath(expression):
        print(result.text_content())
        print(result.get('href'))

Pages des étudiant.e.s

Déroulement du cours

Le cours ne nécessite aucun prérequis si ce n'est une capacité d'attention pendant les séances. Cette attention implique qu'à certains moments, par exemple lors des moments de discussions ou de présentations, il sera demandé aux étudiant.e.s de fermer leur ordinateur, que l'usage des smartphones est interdit et que les étudiant.e.s doivent arriver à l'heure au cours (9h, le lundi matin).

Comme il s'agit d'un cours technique, les travaux se feront majoritairement en classe et il n'est pas absolument nécessaire de travailler en dehors du cours, à part pour documenter les travaux ou préparer leurs présentations (les cotations).

Le cours fonctionne en évaluation continue, ce qui signifie que chaque exercice réalisé en atelier aura une note attribuée. Pour réussir le cours, il faut essentiellement être présent.e.

À cette évaluation continue s'ajoute deux notes en décembre et en mai qui correspondent aux moments de cotations. Il est demandé pour ces cotations de présenter une sélection des travaux réalisés jusque là.

La difficulté technique, bien que présente, ne doit pas constituer une barrière pour assister au cours. Il ne sera pas demandé aux étudiant.e.s d'être performant.e.s mais plutôt de ne pas se braquer et d'accepter d'être inefficaces durant des périodes qui semblent parfois longues (voire trouver du plaisir dans ces périodes de recherches). L'entraide et le partage sont encouragés. Tout sera fait pour éviter des comportements de mise à distance du savoir entre celles et ceux "qui savent" et les "newbies".

Chaque étudiant.e a accès à ce wiki, qui servira durant toute l'année à documenter les travaux. La création des comptes pour le wiki se fait au début du deuxième cours (au moment de l'inscription au cours).