Ergbot le 18 avril 2018 à 13:00

2018-04-18T13:00:41Z

Ergbot le 18 avril 2018 à 12:58

2018-04-18T12:58:59Z

Ergbot : Page créée avec « {{Page web |URL=http://curlybraces.be/wiki/index.php/ERG::Code-2017-2 |Title=ERG::Code-2017-2 |Updated=2018-03-01 07:33:01 |Site=Curlybraces |Thumbnail= }} De {} Aller à... »

2018-04-18T12:58:38Z

Page créée avec « {{Page web |URL=http://curlybraces.be/wiki/index.php/ERG::Code-2017-2 |Title=ERG::Code-2017-2 |Updated=2018-03-01 07:33:01 |Site=Curlybraces |Thumbnail= }} De {} Aller à... »

Nouvelle page

{{Page web
|URL=http://curlybraces.be/wiki/index.php/ERG::Code-2017-2
|Title=ERG::Code-2017-2
|Updated=2018-03-01 07:33:01
|Site=Curlybraces
|Thumbnail=
}}
De {}

Aller à : [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#mw-head navigation], [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#p-search rechercher]

== Sommaire ==

* [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#Introduction 1 Introduction]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#Proposition_1 1.1 Proposition 1]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#Proposition_2:_organisation_du_cours_choisie_pour_cette_ann.C3.A9e 1.2 Proposition 2: organisation du cours choisie pour cette année]
* [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#S.C3.A9ances 2 Séances]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#S.C3.A9ance_du_28.2F09.2F2017 2.1 Séance du 28/09/2017]
*** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#introduction_aux_langages_de_programmation 2.1.1 introduction aux langages de programmation]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#S.C3.A9ance_du_05.2F10.2F2017 2.2 Séance du 05/10/2017]
*** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#Internet_c.27est_quoi.3F 2.2.1 Internet c'est quoi?]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#S.C3.A9ance_du_12.2F10.2F2017 2.3 Séance du 12/10/2017]
*** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#Typographie_et_css 2.3.1 Typographie et css]
*** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#Positionnement_et_css 2.3.2 Positionnement et css]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#S.C3.A9ance_du_26.2F10.2F2017 2.4 Séance du 26/10/2017]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#S.C3.A9ance_du_16.2F11.2F2017 2.5 Séance du 16/11/2017]
*** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#Exercices_Jquery 2.5.1 Exercices Jquery]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#S.C3.A9ance_du_23.2F11.2F2017 2.6 Séance du 23/11/2017]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#S.C3.A9ance_du_08.2F02.2F2018_:_introduction_au_deuxi.C3.A8me_quadrimestre 2.7 Séance du 08/02/2018 : introduction au deuxième quadrimestre]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#15.2F02.2F2018_:_bases_de_donn.C3.A9es:_suite 2.8 15/02/2018 : bases de données: suite]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#22.2F02.2F2018_:_bases_de_donn.C3.A9es:_suite 2.9 22/02/2018 : bases de données: suite]
** [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#01.2F03.2F2018 2.10 01/03/2018]
* [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#Groupes_de_travail 3 Groupes de travail]
* [http://curlybraces.be/wiki/index.php/ERG::Code-2017-2#Agenda_de_pr.C3.A9sentations 4 Agenda de présentations]

== Introduction ==

=== Proposition 1 ===

Ce cours est destiné aux étudiants de BAC3. Il ne nécessite aucun prérequis (il n'est pas nécessaire d'avoir suivi le cours en Bac2 pour pouvoir le suivre en Bac3). Il consiste en la mise en place d'un atelier d'expérimentations autour du code informatique. Il s'organise par groupes de recherche, dont les sujets sont définis dès le premier cours par les étudiants. Les étudiants peuvent changer de groupe de recherche (ou rester au sein du même groupe) tous les deux cours. Chaque groupe se doit de documenter le travail effectué. Tous les deux cours, il est demandé à chaque groupe de présenter les réflexions, découvertes et expérimentations réalisées.

=== Proposition 2: organisation du cours choisie pour cette année ===

Le premier quadri permet d'approcher l'html, le css, le javascript. Le deuxième quadri propose un développement de travail de groupe, en partant des bases de données.

Quelques points importants:

* La plupart des travaux seront réalisés dans le cadre de l'atelier. La présence au cours est donc nécessaire.

<br />

== Séances ==

=== Séance du 28/09/2017 ===

==== introduction aux langages de programmation ====

En bref, on fait la liste des langages dont on a entendu parler, on essaie d'en trouver les particularités et on parle de ce qu'ils partagent tous.

<pre>HTML
manipulable, apprentissage rapide
pour des pages web
structurer du contenu d'une page
balises
<article>le contenu de l'article</article>
langage descriptif

CSS
cascading style sheet
ce qui détermine l'apect, le style
langage descriptif

JAVASCRIPT
c'est des maths
des actions à la suite
s'il y a une erreur, ça s'arrête
langage impératif

-- JQUERY

PHP
langage côté serveur

JAVA
-- PROCESSING

PYTHON
proche du langage naturel
récent
évolue rapidement
à la fois sur le web et pour applications

C
C++
PASCAL
BASIC
nécessité de compiler le code

LIVECODE

LANGAGE BINAIRE

1 0

Si on veut compter jusque 7 en binaire:

0
1
1 0
1 1
1 0 0
1 0 1
1 1 0
1 1 1

Si on estime que a = 0 b = 1 c = 2 etc. et que l'on veut dire bonjour en langage binaire:

0 0 0 0 1 = b
0 1 1 1 1 = o
0 1 1 1 0 = n
0 1 0 1 0 = j
0 1 1 1 1 = o
1 0 1 0 1 = u
1 0 0 1 0 = r

LANGAGE MACHINE
LANGAGE ASSEMBLEUR

POSTSCRIPT
HPGL

OTF
TTF

SVG</pre>
=== Séance du 05/10/2017 ===

==== Internet c'est quoi? ====

<pre>Internet c'est un réseau
-> une connexion
-> interactions entre différentes machines
-> point d'accès
-> ensemble de données
-> gratuit à l'erg
-> c'est pas gratuit (à l'erg)
</pre>
=== Séance du 12/10/2017 ===

==== Typographie et css ====

http://curlybraces.be/erg/2017-2018b3/lionelmaes/20171012typo.zip

==== Positionnement et css ====

<pre>1. réalisez un carré rouge qui prend tout l’écran dans lequel se trouve un carré jaune centré horizontalement et verticalement quelque soit la taille de la fenêtre.👽
2. Réalise un drapeau belge sur toute la page🇧🇪
3. Fais moi un Mario en pixel art (pixel = bloc de 20x20 px)
4. faire un damier de 5 carrés horizontaux et verticaux qui s'adapte à la taille de l'écran
5. créer un motif avec des superpositions de carrés (au moins 5 carrés de couleur différentes avec des positionnements différents).
6.Créez un escalier de 12 rectangles de 100 px par 20 px avec les couleurs de l'arc-en-ciel
7. créer 5 carrés de différentes couleurs qui se superposent avec transparence > opacity:1; opacity:0.5;
8. Réalise une lettre à partir de carrés (avec un positionnement fixe) et une qui s'adapte à la
9. Créer 5 carrés avec 5 bordures de couleurs différentes
10. réaliser un bloc fixe qui change de couleur à un certain niveau de la page par dessus d'autres blocs mobiles
avoir un menu fixe à gauche sur toute la page et faire 4 colonnes de texte qui se placent les une à côté des autres s'il y a de la place, les unes en dessous des autres sinon
12. réaliser un dégradé de blocs
13. réaliser 3 blocs de couleur bleu, les uns à coté des autres, dont celui du milieu est fixé sur la page</pre>
=== Séance du 26/10/2017 ===

Intro js http://curlybraces.be/erg/2017-2018b3/lionelmaes/20171026demojs.zip

=== Séance du 16/11/2017 ===

Suite js + Intro jquery http://curlybraces.be/erg/2017-2018b3/lionelmaes/220171116introjquery.zip

==== Exercices Jquery ====

<pre>1. faire une page avec un carré dans le coin supérieur gauche qui vas dans le coin supérieur droit quand on clic dessus puis en bas a droite puis en bas a gauche puis en haut a gauche puis ainsi de suite...
2. Faire une page avec 3 carrés un à coté des autres avec du texte centré à l'intérieur. Cliquer sur le carré pour faire agrandir le texte
3. Faire une page avec des carres en arc en ciel qui apparait et disparait et changent de taille
4. faire un bloc qui prend tout l'écran, à chaque refresh de la page le bloc doit être d'une nouvelle couleur aléatoire`
5.Faire un carré
6. Construire une page avec un carré dans l'espace. Cliquer sur le carré pour le faire disparaitre puis le faire réapparaitre de façon aléatoire dans la page
8. faire un carré dans l'angle supérieur gauche de la page. Lors du clic, faire répéter le carré horizontalement et de façon continue jusqu'à la fin de cette page.
7. Faire en sorte qu'un bloc se déplace partout ou on clique
9. Créer un gros bloc où quand on clique dessus il rétrécit, encore et encore jusqu'à ce qu'il disparaisse

10.faire deux colonnes de bloc en deux couleurs différentes qui changent de couleur quand on clique dessus

11.faire trois carrés de couleurs differentes superposés, quand on clique dessus le carré disparait pour faire apparaitre celui en dessous</pre>
=== Séance du 23/11/2017 ===

Suite jquery http://curlybraces.be/erg/2017-2018b3/lionelmaes/20171123exo1js.zip

=== Séance du 08/02/2018 : introduction au deuxième quadrimestre ===

* Travailler en groupe
** Mise en place d'un agenda de présentation des sujets liés aux travaux
** Chaque groupe crée la page de documentation de son projet sur le wiki
** Avant une présentation d'un groupe, les étudiants qui n'en font pas partie lisent le projet documenté. La présentation est un moment d'échange et de débat
** Les présentations sont transcrites par un(e) secrétaire
** À l'intérieur des groupes, à chaque fois qu'il y a des moments de mise en commun, ils sont également retranscrits par un(e) secrétaire et mis en ligne sur la page correspondante du wiki

https://www.youtube.com/watch?v=4GXCIbStB5c

* Bases de données
** D'où viennent les données? Choisir une ou plusieurs sources parmi la liste suivante:
*** Les bibliothèques des membres du groupe
*** Un flux twitter d'un politicien au choix
*** Les flux facebook des membres du groupe
*** Un site de recettes de cuisine
*** Les trajets en transports en commun des membres du groupe
*** Un forum thématique (au choix) du site Doctissimo
*** Les commentaires d'un site d'actualités au choix
*** Les discours d'un politicien au choix
*** Les pads créés pour le dernier séminaire de l'ERG
*** Un ensemble de documents provenant de wikileaks.org
** Quel est l'intérêt de les stocker? Formuler une hypothèse.
** Que garder ou ne pas garder?
** Produire un schéma de structure
*** Si la base de données est relationnelle (type tableur), quelles seront les entités, quelles seront les relations?
*** Si la base est navigationnelle (structure de dossiers et de fichiers), quelles règles définiront le chemin?
** À la fin du cours: présenter le projet via la page wiki du groupe

=== 15/02/2018 : bases de données: suite ===

* Création d'un schéma de base de données
** Répondre aux questions suivantes:
*** Quelles sont les entités? Exemples: article, commentaire, utilisateur, livre, etc.
*** Quels sont les champs pour chaque entité? Exemples: corps de texte, chapeau, nom, prénom, date, etc.
*** Quelles sont les relations entre les entités, via quels champs? Exemple: un article est lié à un auteur via le champ id_auteur
** Produire le schéma soit sur papier, soit via http://asciiflow.com/

* Quel médium pour la base de données? Choisir un ou plusieurs médium parmi la liste suivante:
** Des fiches physiques
** Une structure de dossiers et de fichiers sur ordinateur
** Une base de données type SQL

* Quelle méthode pour insérer du contenu dans la base de données?
** Écrire un scénario de remplissage, que la méthode soit numérique ou non. Écrire ce scénario comme une recette de cuisine ou un programme, en étant le plus précis possible. Exemple: Tous les jours à 15h à partir du 12 février 2018 jusqu'au 25 février 2018, scanner la homepage du site lemonde.fr. Pour chaque lien vers un article d'actualité, suivre le lien, scanner la page désignée par le lien. Pour chaque commentaire publié sur cette page, récupérer la date, le nombre de mots. Insérer une nouvelle entrée dans la table "comments" de la base de données en utilisant ces deux informations.
** Créer un schéma correspondant à ce scénario, soit sur papier, soit via http://asciiflow.com/
** Suivant les besoins du scénario, définir si la méthode est numérique, analogique ou les deux.

* À la fin du cours: présenter le projet via la page wiki du groupe

<br />

=== 22/02/2018 : bases de données: suite ===

* MySQL et phpMyAdmin
* Quel médium pour la base de données? Choisir un ou plusieurs médium parmi la liste suivante:
** Des fiches physiques
** Une structure de dossiers et de fichiers sur ordinateur
** Une base de données type SQL

* Quelle méthode pour insérer du contenu dans la base de données?
** Écrire un scénario de remplissage, que la méthode soit numérique ou non. Écrire ce scénario comme une recette de cuisine ou un programme, en étant le plus précis possible. Exemple: Tous les jours à 15h à partir du 12 février 2018 jusqu'au 25 février 2018, scanner la homepage du site lemonde.fr. Pour chaque lien vers un article d'actualité, suivre le lien, scanner la page désignée par le lien. Pour chaque commentaire publié sur cette page, récupérer la date, le nombre de mots. Insérer une nouvelle entrée dans la table "comments" de la base de données en utilisant ces deux informations.
** Créer un schéma correspondant à ce scénario, soit sur papier, soit via http://asciiflow.com/
** Suivant les besoins du scénario, définir si la méthode est numérique, analogique ou les deux.

* Documenter, planifier, démarrer la récolte
* À la fin du cours: présenter le projet via la page wiki du groupe

=== 01/03/2018 ===

* MySQL et phpMyAdmin
* Penser un dispositif pour les portes ouvertes

== Groupes de travail ==

* [http://curlybraces.be/wiki/ERG::2018-TWITTER_TRUMP TWITTER TRUMP]
* [http://curlybraces.be/wiki/ERG::2018-Delphine_et_Enia Delphine et Enia]
* [http://curlybraces.be/wiki/ERG::2018-Doctissimo Doctissimomo]
* [http://curlybraces.be/wiki/ERG::2018-Marmiton Marmiton]

== Agenda de présentations ==

Récupérée de « http://curlybraces.be/wiki/index.php?title=ERG::Code-2017-2&oldid=2224 »

@@ Ligne 2 : / Ligne 2 : @@
 |URL=http://curlybraces.be/wiki/index.php/ERG::Code-2017-2
 |Title=ERG::Code-2017-2
-|Updated=2018-03-01 07:50:32
+|Updated=2018-03-05 09:04:17
 |Site=Curlybraces
 |Thumbnail=

Page web:ERG::Code-2017-2 - Historique des versions

Ergbot le 18 avril 2018 à 13:00

Ergbot le 18 avril 2018 à 12:58

Ergbot : Page créée avec « {{Page web |URL=http://curlybraces.be/wiki/index.php/ERG::Code-2017-2 |Title=ERG::Code-2017-2 |Updated=2018-03-01 07:33:01 |Site=Curlybraces |Thumbnail= }} De {} Aller à... »