Programmation

novembre

2021

durée estimée : 9h

Formateur: Philippe Vincent

administrateur + développeur + formateur

= artisan numérique

Quelques langages informatiques que j’utilise régulièrement

Ruby, Bash, Typescript, Markdown, Html, Css,

Qui êtes-vous ?

Présentez-vous

  • Prénom – Nom

Avant Créalise, je …

État des connaissances

En toute franchise, ce que vous inspire le mot

PROGRAMMATION

PLAN

Le matin

  • de la théorie

  • quelques exercices théoriques

  • un peu de pratique

L’après-midi

  • un jeu de carte

  • plus de pratique

  • évaluation

LICENCE ART-LIBRE

COPYLEFT

Le copyleft est l’autorisation donnée par l’auteur d’un travail soumis au droit d’auteur d’utiliser, d’étudier, de modifier et de diffuser son œuvre, dans la mesure où cette même autorisation reste préservée.

Autrement dit, les nouvelles créations réalisées à partir d'œuvres sous copyleft héritent de fait de ce statut de copyleft : ainsi, ce type de licence permet un partage de la création ou de la connaissance, comme bien commun, qui permet aux œuvres culturelles d'être développées librement.

Définir la programmation

On va le faire … ensemble

Down arrow

Des synonymes de programmation ?

Savez-vous comment sont réalisés nos programmes ?

Langages informatiques

Vs

Langages de programmation ?

exemple de HTML

    <li>
      <a href='crealise.io'>École Créalise</a>
    </li>
    ...

Rq: langage composée de balises

exemple de CSS

li a { 
  background-color: beige;
  margin: 1.2em;
}

Rq: contient une partie sélecteur + une partie description de style

Le langage Assembleur

instructions pour le processeur

MOV AX, 10    ; stocke la valeur 10 dans le registre AX
MOV BX, 101   ; stocke la valeur 11 dans le registre BX
ADD AX, BX    ; additionne le registre AX et BX

le symbole ; signale le début d’un commentaire !

  • spécifique pour une gamme de processeur
    • 8bits / 16bits / 32bits / 64bits
    • Intel (ordinateur) / ARM (téléphone) / …

Assembleur

Le seul langage compris par la machine

  • Pourquoi ne pas tout faire en assembleur ?

Distinguer langage informatique et programmation

Il existe

  • des langages de description de données
    • HTML, CSS, …
  • des langages de requêtage
    • SQL, Expression Régulière, …
  • de nombreux langages de programmation
    • ASSEMBLEUR, RUST, RUBY, …
Down arrow

Notion d’algorithme

  • métaphore de la recette de cuisine
  • mécanisme de branchement
    • SI <condition> ALORS … SINON …
  • mécanisme de répétition
    • TANT QUE <condition> RÉPÉTER …

Des algorithmes

+ ou -

performants

Exemple : Tri stupide

  fonction tri_stupide (liste)
    tant que la liste n'est pas triée
        mélanger aléatoirement les éléments de la liste

Quelques algorithmes primitifs

  • chercher un mot dans une page

  • chercher un mot dans un livre

    • lent, méthode dîte force brute
  • chercher un mot dans le dictionnaire

    • parce que trié !
    • on peut utiliser la fameuse méthode de la dichotomie

CODE SOURCE

ça veut dire quoi ?

Est-ce qu’on a accès au code source de tous les programmes ?

Différentes protection du code source ?

Existe-t-il des plateformes pour faciliter l’accès au code source dit “ouvert” ?
Down arrow

OPEN SOURCE

exemples de code source

Si j’ai un doute sur une licence

décryptons un programme en Ruby

repl.it

# il faut 10 binomes (1 individu ou un groupe de 2)
binomes = [
  'Nadia+Julien',
  'Aaron+Natasha',
  'Bertrand+Alice',
  'Sandra+Olivier',
  'Jeanne+Tim',
  'Shanad+Saïd',
  'Kevin+Kenza',
  'Armand+Mally',
  'Nelly+Rémy',
  'JMarie+Barbara',
]

index = 1 
binomes.shuffle.each do |binome|
  puts "CARTE n°#{index} pour le binome #{binome}"
  index += 1
end

Code fermé < Open Source < Logiciel libre

  • Pas d’accès au code source = logiciel privateur = boite noire

  • Mise à disposition sous licence libre ou open-source

    • sans Copyleft
      • MIT, APACHE, BSD, …
    • avec Copyleft = Logiciel libre
      • GNU, MPL …

Le logiciel libre est un pot commun auquel chacun peut ajouter quelque chose mais duquel personne ne peut rien retirer.

– Eben Moglen

Compilation Vs Interprétation

Métaphore : traduction d’un roman en anglais vers le français

Le traducteur ou l’interprète ?

Down arrow

Compilation

  • Traduit un langage informatique vers du langage machine
    • plus rapide
    • Difficulté à remonter au code source
      • rétro-ingénierie

Interprétation

  • Interprète ligne par ligne
    • Plus lent
    • Accès facile au code source
      • exemple de page HTML et F12 webdeveloper

La machine de Turing

machineTuring

La base théorique de tout ordinateur

en conclusion, le “code source” d’un programme est

  • écrit et relu par un HUMAIN
  • executé par une “machine de Turing

Un peu de théorie

Le codage binaire

1 0
VRAI FAUX
OUI NON
+ -
O K ANNULER

bg 20%

représentation des nombres

	BASE 10 => BASE 2				    8 cases
	=================				===============
	      0 => 0					0 1 2 3 4 5 6 7	
	      1 => 1
	      2 => 10
	      3 => 11
	      4 => 100
              ...		
	      8 => 1000 		        8 bits   = 1 octet
	     16 => 10000		     1024 octets = 1 Ko (kilo-octet)
	     32 => 100000		     1024 Ko     = 1 Mo (méga-octet)
	     64 => 1000000		     1024 Mo     = 1 Go (giga-octet)
	    128 => 10000000		     1024 Go     = 1 To (téra-octet)
	    256 => 100000000			...

Quel est le plus grand nombre représentable avec un octet ?

Algèbre de Boole, et ses fonctions logiques :

  • inverse (ou son contraire !), donc !vrai = ?
  • somme (addition, OU) : donc vrai + faux = ?
  • produit (multiplication, ET) : donc vrai * faux = ?

Êtes-vous logique ?

Choisissez une réponse :

  • OUI
  • NON

VRAI + VRAI + FAUX = ?

FAUX * FAUX * VRAI = ?

!( VRAI + FAUX ) * VRAI = ?

VRAI * ( FAUX + (FAUX * FAUX) + !VRAI ) = ? 

!(FAUX + ( VRAI * !VRAI )) = ? 

Programmer

en jouant avec

Studio Code

https://studio.code.org/s/express-2020

Exo 1

Avoir une note >=10 dans au moins 4 modules différent

Programmer

en écrivant du code avec

Khan Academy

Programmer

en

jouant

avec

Snap!

https://snap.berkeley.edu

Exo 1

dessiner ces initiales

Exo 2

faire un bloc avec son initiale

Exo 3

créer un bloc Triangle avec une entrée distanceCoté qui dessine un triangle

Exo 4

  • créer un autre bloc qui dessine un carré
  • privilégier les blocs
    • Tourner de x degrés
    • Répéter x fois

Exo 5

s’inspirer de Triangle et Carré pour créer Polygone avec 2 entrées :

  • nombreCotés
  • distanceCoté

Exo 6

  • réutiliser Polygone
  • choisir les bonnes entrées permettant de dessiner un cercle parfait

BONUS :

Construire le jeu du nombre mystère

Déterminer un nombre au hasard entre 1 et 100
Poser indéfinement la question : "Deviner le nombre mystère ? "
Si le mystère est plus grand que la réponse, répondez : “plus grand”
Si le mystère est plus petit que la réponse, répondez : “plus petit”
Si trouvé, Terminer le jeu
Et préciser : Fécilitations, vous avez trouvé en <n> coups !

Utiliser

  • Variable > Nouvelle Variable

Apprendre Ruby

Le site officiel

www.ruby-lang.org/fr

La documentation officielle

www.ruby-lang.org/fr/documentation

Un conseil pour développeur

devdocs.io/ruby (in english)

Apprendre les bases

medium.com/the-renaissance-developer/ruby-101-the-basics-f10961f990ac

  • affectation de variable, symbole =
  a = 1      	# => 1
  b = 'Jean' 	# => 'Jean'
  • comparaison entre 2 variables, symbole == ou son inverse !=
  a == 1 	# => true
  a == 2 	# => false
  a != 2 	# => true

Quelques règles minimales

  • une variable commence par une minuscule plutôt que Ma_Constante

  • les valeurs sont typées => entier, booléen, chaîne de caractère, etc…

    • notion de Programmation Orientée Objet
    • variable.action => exécute une action sur la variable de son type
    • objet.méthode(p1, p2) => applique une méthode avec 2 arguments
  • notion de bloc pour délimiter une suite d’instructions avec { ... } ou do ... end

    • notion de bloc paramétré {|a,b| ... }, ex: Array#each

Ruby est un langage élégant

poignant guide to Ruby (in english)

Chercher dans la documentation

devdocs.io/ruby

les mots clefs

if
while
Integer#==

Tester une condition avec un bloc [else, elsif optionnel]

valeur = 5
if valeur >= 10
  puts 'nombre positif'
elsif valeur < 0
  puts 'nombre négatif'
else
  puts 'chiffre'
end
unless ou if sur une seule ligne !
puts 'chiffre' unless valeur < 0 || valeur >= 10 # && signifie ET
# OU l'inverse
puts 'chiffre' if valeur >= 0 && valeur < 10 # || signifie OU

Afficher un message en console

puts OU print ?

nom = 'toto' # ne pas oublier entre apostrophe ' ou guillement "

puts nom
print nom
print "\n"

Rq: ‘#’ permet d’exprimer un commentaire, ne sera pas exécuté !

# \n est un caractère spécial qui signifie retour à la ligne, cf code ASCII

Demander une information en console

gets est une fonction qui retourne une chaîne de caractère. elle s’utilise comme suit : ma_variable = gets

exemple avec le code :

print 'Entrez votre nom : '
name = gets
print 'Vous avez saisi : '
puts name

petit problème

Utiliser la bibliothèque Date

require 'date'
hui = Date.today

puts hui.day
puts hui.month
puts hui.year

documentation Date

chercher la différence entre Date#day et Date#yday

Utiliser Ruby depuis son navigateur

https://repl.it

30%

Coder en Ruby avec repl.it

  • créer vous un compte
  • choisissez le langage Ruby
  • copier-coller le texte suivant :
print 'Entrez votre nom : '
name = gets
puts "Bonjour #{name}"

Astuce : CTRL + Return => exécution instantanée !

EXO 1

  • demander votre jour de naissance
  • demander votre mois de naissance
  • demander votre année de naissance
  • répondre soit :
    • aujourd’hui est un jour comme un autre… pffff
    • joyeux anniversaire !

cherchons dans la documentation

String#chomp 

exécutons : 'ok'.chomp ? 'ok\n'.chomp ? 1.chomp ?

pourquoi 1.chomp retourne une erreur ?

  • notion de classe

améliorons notre tout premier programme

print 'Entrez votre nom : '
name = gets.chomp
print name
puts ', quel joli prénom !'

les chaines de caractères entre ’ ou "

pseudo = 'toto' => toto pseudo = "toto" => toto nom = pseudo => toto nom = toto => erreur: variable toto non défini !

interpolation de variable avec “#{…}”

Noter la différence entre et "

pseudo = 'toto'
puts "mon nom est : #{pseudo}" # avec interpolation
puts 'mon nom est : #{pseudo}' # sans interpolation

EXO 2

  • Afficher ‘Entrer votre date de naissance’
  • Obtenir une date sous la forme JJ/MM/AAAA avec l’instruction
    • Date.strptime(gets, '%d/%m/%Y')
  • Tester avec la date du jour afin de répondre:
    • aujourd’hui, vous avez <n> ans.
      • <n> représente le nombre d’années
      • ça dépend de votre anniversaire ?

définition de fonction

def ma_fonction(param1, param2)
    [instruction 1]
    [instruction 2]
    ...
    [instruction n]
end
# Rq: la dernière instruction est retournée par la fonction
# Rq: toute instruction retourne une valeur ... ou nil (nul en anglais) 
# -> attention puts retourne nil

appel de fonction

ma_fonction(1,2)

Instructions de base

voir les méthodes attachés à Integer, String, Boolean , …

budget = 1000
budget = budget + 100
budget += 50
budget /= 2
puts budget

nom = 'toto'.upcase # upcase est une fonction/méthode de la classe String
nom += ' est en majuscule'
nom += ", n'est ce pas ?\nNouvelle ligne." # noter l'interpolation pour \n
puts nom

OU

puts "#{'toto'.upcase}, n'est ce pas ?\nNouvelle ligne." # en une ligne

Utilisation de librairies pour Internet

obtenir un fichier depuis le web
require "open-uri"
licence = URI.parse("https://www.ruby-lang.org/en/about/license.txt").read
print licence
crypter/décrypter un fichier attaché dans un email
require "base64"
document = 'Voici une information secrète'
enc = Base64.encode64(document)
dec = Base64.decode64(enc)
puts "#{enc} <=Base64=> #{dec}"

Exo 3 : Construire le jeu du nombre mystère

Déterminer un nombre au hasard entre 1 et 100
Poser indéfinement la question : "Deviner le nombre mystère ? "
Si le mystère est plus grand que la réponse, répondez : “plus grand”
Si le mystère est plus petit que la réponse, répondez : “plus petit”
Si trouvé, Terminer le jeu
Et préciser : Fécilitations, vous avez trouvé en <n> coups !

Exo 4 : palindrome?

Définir la fonction palindrome? qui retourne vrai si : une chaine de caractère sans ses espaces est égale à son inverse.

palindrome?("engage le jeu que je le gagne") # => true

Remarque : En ruby, toutes les fonctions qui retournent un booléen se termine avec un ‘?’ pour améliorer la lisibilité

Apprendre l’écosystème de la programmation

avec …

une distribution de cartes

JEU SAIS TOUT

Règles du “Jeu sais tout”

  1. choisir sa carte en binôme ou trinôme
  2. INDIVIDUEL: surfer sur Internet et collecter un maximum d’information (25mn)
    • Wikipedia, la base + tout autre site web
    • Vidéo tolérée avec casque
  3. GROUPE: mettre en commun vos connaissances, trier, prioriser (5mn)
  4. GROUPE: restitution oral 5mn
    • 3 questions du public

Choix des cartes

1 parmi 10

en binome ou en trinome

Carte 1 : Alan Turing

Enigma 
Test de Turing
La pomme de Blanche-Neige
Médaille de Turing

Carte 2 : Logiciel Libre

Les 4 règles du logiciel libre
Service dans les nuages, licence Affero GPL v3
Creative Commons / Art Libre

Carte 3 : Algorithmique

Problème du voyageur de commerce
Algorithme glouton
Heuristique

Carte 4 : REFACTORING (réusinage)

code spaghetti
code mort
K.I.S.S / D.R.Y / Y.A.G.N.I

Carte 5 : Librairie / Framework / API

NodeJs / NPM
version semantique
VueJs

Carte 6: Internet

Tim Berners Lee / HTTP
Nom de domaine
Serveur Web (Apache, Nginx)
Service Web (API REST)

Carte 7 : Navigateur Web

Guerre des navigateurs (IE6 / Mozilla)
Javascript / Ecmascript
Arbre DOM

Carte 8 : Programmation impérative

Routine / Procédure / Fonction
Programmation fonctionnelle
Récursivité

Carte 9 : Programmation orientée objet

Diagramme UML
Classe, attribut, méthode
Héritage, polymorphisme

Carte 10 : GIT, Fork

OpenOffice / LibreOffice
Mysql / MariaDB
Visual Studio Code / VsCodium
Chrome / Chromium

ÉVALUATION

QCM

Épilogue

Le tout premier programme

premier

Ceci est le premier algorithme pour calculer les nombres de Bernoulli, 1843. Vous voulez-voir qui a programmé ça ? image