ERG::Code-2017-1

Introduction

Ce cours est destiné aux étudiants de BAC2. Le but est ici de faire un tour d'horizon de pratiques et de possibilités liées à la programmation et plus généralement à l'algorithmique et au numérique.

Nous commencerons cette année par une introduction aux pages web, avec les langages html et css, pour très vite enchaîner sur le javascript et l'écriture de "programmes". Nous nous attarderons ensuite sur la génération de supports imprimés via ces outils orientés web (html, javascript, css), puis nous nous intéresserons aux machines à imprimer et à tracer (imprimantes, traceurs).

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.
• Le cours se veut à la fois pratique et théorique: les étudiants seront encouragés à se documenter et se positionner par rapport aux questions que posent le code informatique, son écriture et ses applications dans divers domaines.
• La recherche et la documentation font partie du cours. Une attention toute particulière sera apportée au partage d'informations entre nous et vers l'extérieur.

Séances

25/09/2017

• Brève introduction aux langages de programmation : langage machine, langage assembleur, langage évolué, langages de scripts (langages interprétés), langages compilés, langage de balisage (langage de marquage), langage de requête

BINAIRE (langage machine)

0                0
1                1
1 0              2
1 1              3
1 0 0            4
1 0 1            5
1 1 0            6
1 1 1            7
1 0 0 0          8

1 0 0 0 0 0 0 0  128 (1 octet)


ASSEMBLEUR
COBOL
C
C++ 

JAVA > interpreté
Python > idem



HPGL > pour les traceurs
POSTSCRIPT > pour les imprimantes
BASH > pour le terminal
JQUERY > JAVASCRIPT
PROCESSING > JAVA

HTML > côté client, interprété
CSS  > côté client, interprété
JAVASCRIPT > côté client, interprété
PHP > côté serveur, interpreté
SQL > côté serveur, interprété
Ruby on rail > côté serveur, interprété

• Mains dans l'html: créer un labyrinthe de pages web

02/10/2017

• Introduction à Internet et au web
• Mise en ligne du labyrinthe
• Main dans le css: mise en page d'un contenu existant

http://curlybraces.be/erg/2017-2018/lionelmaes/introcss.zip

09/10/2017

• Le positionnement en css : intro

http://curlybraces.be/erg/2017-2018/lionelmaes/20171009positionnement.zip

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

16/10/2017

• Positionnement en css: suite
• Démo js: intro

23/10/2017

• Javascript: introduction et exercice d'écriture de scénario avec prompt et alert

http://curlybraces.be/erg/2017-2018b3/lionelmaes/20171023demo_js.zip