Design Tech Academie : Différence entre versions

De Movilab.org
(Journée de jeudi)
m
Ligne 551 : Ligne 551 :
 
* Créer un script listant les fichiers html présents dans ce dossier spécifique et proposer un menu pour les afficher
 
* Créer un script listant les fichiers html présents dans ce dossier spécifique et proposer un menu pour les afficher
 
* Re-développer son code sous forme orienté objet
 
* Re-développer son code sous forme orienté objet
 +
* Ajouter la possibilité de modifier les documents existants dans le dossier spécifique
 
<br />
 
<br />
 
Lancement du projet du cycle : re-développer [https://thingspeak.com/ Thingspeak] par groupes avec récupération des données du nodeCMU, enregistrées dans un fichier au format CSV et restitution sous forme de tableaux et graphiques, avec choix du style
 
Lancement du projet du cycle : re-développer [https://thingspeak.com/ Thingspeak] par groupes avec récupération des données du nodeCMU, enregistrées dans un fichier au format CSV et restitution sous forme de tableaux et graphiques, avec choix du style

Version du 22 novembre 2016 à 11:12

Logo DesignTech Academie.png

Vous retrouverez les principales informations (concernant les procèdures d'admission, le déroulement de la formation, les moyens pédagogiques mis en oeuvre, les débouchés...) sur la formation Design Tech Académie organisée par Telecom Saint Etienne en partenariat avec Zoomacom.

Cette page permettra de présenter les différents supports pédagogique utilisés au cours de ce cycle de formation sur l'apprentissage du code et de la programmation.

Cette formation se déroule sur 10 mois en continu et se compose d'une formation scolaire, pour une durée de 6 mois) et de 4 mois de stage en milieu professionnel.

Les contenus pédagogiques doivent favoriser l'apprentissage par la pratique !

Déroulé

Les 6 mois de formation en milieu scolaire sont composés de 10 cycles de 2 semaines pour apprendre les bases pratiques de la programmation (5 mois). Les 4 semaines restantes sont : une semaine d'accueil pour une rentrée en douceur, apprendre à se connaître et découvrir la programmation et configurer son matériel et 3 semaines permettant d'organiser des temps de bilan, d'évaluation et de suivi des évolutions de la formation ainsi que l'organisation des soutenances et des examens.

Semaine d'accueil

Mardi 4/10 : Travail en groupe avec la mallette pédagogique Thymio

OBJECTIF : découvrir la notion d'algorithme dans une démarche ludique

Objectifs secondaires :

  • Apprendre à documenter et partager son projet
  • Se familiariser à la programmation de manière progressive
  • Echanger et débattre pour collaborer dans une démarche de projet
  • Aborder les notions de licence

Présentation de JP des notions théoriques d'algorithme et de variables.

Prise en main de Thymio en suivant le guide de fréquence écoles dans un premier temps. Commencer par analyser les 6 comportements prédéfinis en relation avec les blocs. prévoir des exemples de blocs et comportements pas a pas + des blocs mélangés à remettre dans le bon ordre pour avoir la bonne démarche.

Dans un second temps, explorer 2 à 3 projets de programmations présents sur le site ( création avec Thymio) avec une prise en main du logiciel asebia studio.

L'après-midi devra permettre à chaque groupe de réaliser un programme et de le coder, les différentes étapes de ce travail devront-être rédigées sur Movilab afin de permettre à d'autres utilisateurs de Thymio de se l'accaparer !

RESSOURCES pour utiliser Thymio et le programmer :

Inirobot : guide d'initiation à la robotique avec Thymio

Liste des capteurs et actionneurs de Thymio

Exercices pour apprendre à programmer Thymio comme par exemple : Apprendre à Thymio à parler

Guide du mode texte

Thymio et la notion d'algorithme


Mercredi 5/10 : Configurer son ordinateur et découvrir ses différents composants

DesignTech Academie 20161005 OpenFactoryJPG.jpeg

Le matin, découverte du hardware à l'OpenFactory : Démonter et remonter une tour de PC, par groupe de 5, en analysant le contenu d'un ordinateur (rôle et caractéristique technique). Restitution et échange en groupe, présentation du projet Jerry serveur nomade Temps de veille sur l'actualité numérique Présentation de l'OpenFactory

OBJECTIF : Installer un OS Linux sur un ordinateur et le configurer en installant les logiciels nécessaires à son bon fonctionnement

Objectifs secondaires :

  • Connaitre le fonctionnement d'un ordinateur d'un point de vue software et hardware
  • Configurer un ordinateur

Jeudi 6/10 : TRE 2.0 - Apprendre les langages de programmation

OBJECTIFS :

  • Construire son identité numérique et la valoriser professionnellement
  • Connaitre les composants d'un ordinateur et leurs rôles
  • Favoriser l'apprentissage des langages de programmation en autonomie


  • TRE 2.0 : Travail sur la rédaction individuelle de son CV et son accessibilité en ligne ( doyoubuzz permettant une harmonisation des CV pour réaliser un book ou seeqle de l'emploistore, au choix des étudiants s'ils veulent etre un peu plus original dans la présentation visuelle de leur CV).

Si temps disponible : aller plus loin en explorant la question des réseaux sociaux pro et de la recherche en ligne (du boncoin à pole emploi et son emploistore) Sinon, à reprogrammer pour plus tard dans le cursus.
Pour ceux qui ont finit avant, travail en autonomie sur codeacademy : learn the HTML


  • Apprendre les langages de programmation

Avant de rentrer dans le vif du sujet, présentation rapide de framapad pour la prise de note collaborative. Des élèves expliquent qu'ils ont créé un IRC pour communiquer (nom : DTA).
Manifeste pour le développement Agile de développement de logiciels.

Editeur de texte : Atom

Hyper Text Markup Langage : Ressources

Défi : défi du jour réaliser sa carte de visite


Outils recensant les sites permettant l'apprentissage du code et de la programmation en autonomie :

Vendredi 7/10 : Travail en binôme sur "l'innovation numérique

Travail en binome pour réaliser une présentation sur une thématique autour de l'innovation numérique. Présentation des exposés (10 minutes par binome + 5 minutes d'échanges et questions).


Cycle "Déploiement d'un OS sur une machine physique ou virtuelle"

Semaine 1

Lundi 10/10/2016

Fin des présentations sur l'innovation numérique.
quelques remarques d'ordre général :

  * Attention à l'orthographe : pour vous aider, un outil de correction de l'orthographe
  * Pensez à faire un sommaire de vos présentation
  * Vous êtes légitimes sur un sujet soyez confiant en vous !

Exerice sur les commandes sous Linux : A partir du terminal, copier un dossier en effectuant une recherche de fichiers, puis supprimer les dossiers copiés.
Pour les plus avancés, réaliser un script qui supprime les fichiers contenant un certain préfixe.
Aide : Les commandes fondamentales de Linux

Introduction à Java Script :
Live coding : quelques notions de base abordées pour commencer sous Java Script :
Les variables, les opérateurs, les commandes (alert et prompt), les conditions, les fonctions et les commentaires.
vous retrouverez le code commenté concernant ces différentes notions Github exemple JavaScript Workshop : Pour visualiser le contenu de vos scripts, vous pouvez utiliser le site suivant : Voici la liste des exercices à réaliser :
- Dessiner c'est gagner : Ardoise magique
- Ecrire un script/programme qui demande :

  • De quelle couleur est le cheval blanc d’Henri 4 ?
  • Puis combien y a-t-il de 7 nains ?
  les scripts doivent autoriser 2 tentatives par question 
  • Deviner un chiffre : Ecrire un programme qui demande de deviner un chiffre généré aléatoirement compris entre ... et ... avec un nombre d'essai limité.
  • Réaliser une calculatrice :
    Le programme demande les éléments suivants :
   de choisir une opération (+ / - * ) 
un 1er chiffre
un second chiffre
Le programme affiche ensuite le résultat de l'opération


Correction proposée par les étudiants des différents exercices proposés sur la journée

Mardi 11/10

Inscription Maison de l'Université En parallèle accueil des étudiants pour répondre à leurs questions sur les problèmes rencontrés au cours des différents exercices réalisés jusque-là.

Travail en autonomie sur les CVs, puis retour-discussion sur les problèmes rencontrés avec les premiers exercices JavaScript la veille

Inscription sur Slack, dans le groupe DTA_TSE

Installer un OS sur une machine virtuelle :

  • Tuto 1
  • On préférera VirtualBox depuis les dépots Ubuntu (sudo apt update, puis sudo apt install virtualbox-qt)
  • Tuto 2
  • Bien lire les pré-requis système : [1]
  • Installer Fedora sur la machine virtuelle

Constitution des groupes pour le fil rouge de la quinzaine - Distributions Linux

  • Production 1 : Quelques pages HTML/CSS présentant les avantages/inconvénients/caractéristiques de la distribution en question
  • Production 2 : Un tutoriel vidéo présentant l'installation de la distribution sur une machine physique ou virtuelle


  • Groupe 1 (Debian) : Yacine - Clément J. - Flavien - Jimmy - Thomas - Antoine
  • Groupe 2 (Ubuntu) : Patricia - Enzo - Levon - Nicolas - Jean
  • Groupe 3 (Mint) : Valérie - Christian - Vincent - Christophe - Julien
  • Groupe 4 (Arch-Linux) : Damien - Kevin - Baptiste - Clément B. - Yassine
  • Groupe 5 (Fedora) : Germain - Tamime - Alex - Yann - Mouhtard

Mercredi 12/10

Les métiers du web : en dataviz

Ces jeux permettront aux étudiants de se dévoiler et de se faire connaitre auprès des autres membres de la promotion, tout en leur permettant d'appréhender la notion de "donnée" au sens large du terme. Le principe de la dataviz tangible sera appliquée (en s'inspirant de cet exemple de l'infolab du CRIJ Rhône-Alpes, et en le réadaptant). Cet exercice permettra également aux étudiants de s'approprier des notions de design en terme de présentation graphique de sa dataviz et de licence pour les illustrations).

En 3 minutes... 10 perspectives de métiers : Matériel nécessaire : post-it + gommettes Les étudiants ont 3 minutes pour proposer 10 métiers qu'ils penseraient pouvoir effectuer après la formation. Les gommettes permettront de pondérer l'envie des étudiants de faire ce métier :

  • une valeur de 5 pour les 3 principaux métiers qu'on souhaiterait faire (représentés soit par une couleur de gommettes / une grande taille)
  • une valeur de 3 pour les 3 métiers secondaires qu'ils souhaiteraient faire (représentés soit par une couleur de gommettes / une moyenne taille)
  • une valeur de 1 pour les 4 derniers métiers (représentés soit par une couleur de gommettes / une petite taille).

La dataviz c'est quoi ? Quelle plus-value ? 2 objectifs : comprendre l'intérêt de collecter des données ? & ensuite comprendre l'intérêt de traiter ces données ?

Ensuite, les post-it seront centralisés et répartis par métier. Un tableau sera réalisé dans un tableur en prenant en compte le poids du métier (indiqué par les gommettes) afin de rendre visible leurs perspectives de métiers, mais aussi le poids de leurs envies pour chacun des métiers ! Pour visualiser et analyser ces données, on importera le tableur sur datawrapper Infographie à réaliser avec un tableur (enregistrer votre fichier en csv) et le site datawrapper ou piktochart.
RESSOURCES :

A la rencontre d'une start-up : rmopportunities.eu/fr et prodigo
A la rencontre de ses fondateurs pour échanger sur leurs parcours professionnels et leurs cursus, de connaitre le cheminement entre l'idée d'un projet et sa concrétisation administrative et la dynamique partenariale. les créateurs de rmopportunities

Travail HTML & CSS :

  • Retour sur la carte de visite : 2 à 3 élèves proposent leur correction (en évoquant les problèmes rencontrés et les questions qu'ils se sont posées!)
  • Exercice HTML-CSS :

- Faire un point sur l'avancement du travail pour l'exercice des fruits
- S'exercer en autonomie avec learnlayout.com (vous pouvez consulter leurs tutoriels
Commencer à aborder les notions de colones et de tableau en reproduisant ces modèles :
modele 1
modèle 2

Utiliser Placehold pour des images à la taille voulue.

Bilan de mi-semaine :

Jeudi 13/10

Veille, configuration adresse Télécom et Use Panda

Installation d'un serveur web Debian sur une machine virtuelle :

  • Création d'une nouvelle machine virtuelle
  • Ressources : 2Go de RAM, 8Go d'espace disque, 2 coeurs de processeur
  • Installation de Debian : [2]
  • Installation de sudo puis openssh-server
  • Ajout d'une deuxième carte réseau pour pouvoir se connecter sur la machine virtuelle depuis l'extérieur
  • Le serveur est maintenant fonctionnel

Live coding Java Script :

  • Les tableaux
  • Les chaînes de caractères
  • Les boucles
  • Les fonctions prédéfinies pour les types de données

Workshop autour de plusieurs défis

  Login/password :
      * Vérifier que le login contient pus de 3 caractères
      * Vérifier qu'il contient un @ puis un nom de domaine et une extension
      * Vérifier que le mot de passe correspond (à vous de le définir au début du programme)
      * Pour aller plus loin, vous pouvez avoir un tableau d'utilisateurs et un tableau de mots de passe
  Calcul mental :
      * Le programme tire au hasard deux chiffres et une opération
      * Il l'affiche et demande sa réponse à l'utilisateur
      * Il vérifie si la réponse est exacte

Retour sur les points bloquants de la journée

Vendredi 14/10

Préparation à la réalisation de tutoriel vidéo en groupe

Dans un premier temps amener les étudiants à se questionner sur ce qu'est pour eux un bon tutoriel ? Après leur présenter des regles de base Aborder ensuite quelques aspects techniques de script cadrage et plans et enfin leur présenter des exemples de tutoriels propres et pédagogiques.

Par groupe, ils commenceront à écrire le script de ce premier tutoriel en le découpant par étape, en précisant les plans choisis et la façon de capturer l'écran...

Autonomie collective : travail sur leurs projets individuels et collectifs du cycle

Différentes fonctions en JavaScript à préparer pour le Coding Dojo :

     * max_2(a,b) renvoie le maximum entre a et b
     * max_3(a,b,c) renvoie le maximum entre a, b et c
     * voyelle(c) renvoie true si c est une voyelle, false sinon
     * contient_voyelle(str) renvoie true si la chaîne de caractères str contient une voyelle, false sinon
     * translate(str) prend une chaîne str et, pour chaque consonne, renvoie la consonne doublée avec un o au milieu.
    Par exemple, translate("this is fun") renvoie "tothohisos isos fofunon"
     * reverse(str) renvoie la chaîne str inversée
     * sum(tab) et mult(tab) renvoient respectivement la somme et le produit de tous les éléments du tableau tab
     * longueur_max(tab) renvoie la chaîne de longueur maximale dans le tableau tab
     * longueur_sup(tab,i) renvoie un tableau contenant toute les chaînes de tab de longueur au moins égale à i
     * premieres_lettres(tab) renvoie une chaîne contenant la première lettre de chacune des chaînes du tableau tab

Récupérer le fichier Exercices.js pour le compléter et utiliser les batteries de test pour valider son code.

Semaine 2

Lundi 17/10

Petit moment de veille intellectuelle et technologique : ça parle du câble déployée par Facebook (avec Google) pour relier Los Angeles à Hong-Kong, d'une application pour avions en papier, d'Intelligence Artificielle et la possibilité d'être "conservé" numériquement, ou bien encore de Sprayscape... mais derrière tout ça sont évoquées des questions d'éthique, d'algorythme, d'enjeu économique


Coding Dojo sur les exercices Javascript, construction collective de la correction

Après-Midi :

  • Autonomie collective : travail en groupe sur leur projet
  • Entretien individuel :

Retour sur la présentation de leur projet de la semaine d'accueil
Un bilan sur le ressenti des stagiaires au sein de la formation sur leurs envies, leurs motivations, leurs attentes vis à vis de la formation et toutes les questions qu'ils souhaitent aborder... On évoque aussi leur projection sur ce qu'ils souhaiteraient faire professionnellement ou scolairement après la formation

Mardi 18/10

  • Réalisation d'un CV en CSS
  • Autonomie collective : travail en groupe sur leur projet
  • Workshop collectif sur la suite des exercices Javascript
  • Poursuite des entretiens individuels

Mercredi 19/10

Jeudi 20/10

  • Veille, discussion autour de l'intelligence artificielle et des algorithmes de reconnaissance vocale / reconnaissance de caractères manuscrits
  • Installation d'un serveur web sur sa propre machine avec David
  • Lien entre une page HTML et du code Javascript
  • Coding dojo sur d'autres fonctions, correction collective
  • Début de la réalisation des tutoriels vidéo (vidéoprojecteur disponible)

Vendredi 21/10

  • Fin de la réalisation des tutoriels vidéo
  • Suite des entretiens individuels
  • Poursuite du projet en fil rouge avec David (installation wordpress et installation seveur web sur VPS distant)
  • Exercices en autonomie autour de Javascript / HTML / CSS

Migration Debian 7 vers Debian 8


Défis Javascript :

    * conversion(x) qui convertit une somme x des francs en euros : conversion(100) = 15.24
    * heures_to_secondes(h,m,s) qui convertit un horaire des heures, minutes et secondes en secondes :
heures_to_secondes(2,17,54) = 8274 * difference(h1,m1,s1,h2,m2,s2) qui renvoie le temps écoulé entre 2 horaires (vous pouvez utiliser la fonction précédente) * somme(m,n) qui renvoie la somme de tous les éléments de m à n (inclus) : somme(5,8) = 5+6+7+8 * fact(n), qui renvoie le produit de tous les éléments de n à 1 : fact(5) = 5*4*3*2*1 * moyenne(tab) qui renvoie la moyenne des éléments d'un tableau (contenant des valeurs numériques) * moyenne_longueur(tab) qui renvoie la longueur moyenne des chaînes de caractères d'un tableau * Créer ensuite une page HTML qui permet de faire l'interaction entre l'utilisateur, qui rentre les valeurs à calculer
(avec des prompt par exemple) et les différentes fonctions, déclenchées par des boutons * hasard(n,m) qui renvoie un chiffre au hasard entre n et m * Demander ensuite à l'utilisateur les chiffres à donner en paramètre à hasard et lui faire deviner le nombre choisi,
en comptant le nombre de tentatives (vous pouvez aussi le limiter) * Faire ensuite un programme où l'ordinateur tente de deviner un nombre que vous avez choisi. Vous répondez à chaque
tentative : plus grand ou plus petit * Faire un programme qui demande à l'utilisateur son identifiant, vérifie s'il apparait dans un tableau que vous aurez
défini auparavant et si le mot de passe correspond (avec les mots de passe dans un autre tableau). Si l'utilisateur n'apparait
pas, rajoutez-le dans le tableau

Semaine 3 cycle 2 : A la découverte des fabLabs

Sur ce cycle on part à la rencontre du protypage , ce cycle va permettre de réaliser un objet qui vous servira de fil rouge pour toute la suite de la formation. Si vous avez un peu de temps hésitez pas à aller regarder le blog d'Eskimon, la partie tuto arduino peut vous aider pour les séances à venir et la partie bricolage vous montrera une partie du champs des possibles avec les cartes électroniques programmables. Hésitez pas non plus à aller découvrir sur le net les différentes possibilités de réalisation avec arduino ou raspberry pi (comme sur instructables )!

Lundi 24/10

  • A la découverte de Python
    Tutoriels :
    * OpenClassrooms
    * Developpez.com
    * Débuter avec Python
  • Découverte du Raspberry Pi
    * Déballage et premier démarrage
    * Raspberry Pi 2 sous Raspbian
    * Premier démarrage sous Raspbian
    * Sense Hat

Mardi 25/10

  • Exercices en Python avec capteur et matrice Led sur Raspberry Pi
    * Emulateur en ligne
    * Découverte du Sense Hat
    * Allumer une LED par degré de température au-dessus de 0°C : Correction simple Correction optimisée Python
    * Faire une boussole numérique (une LED s'allume pour pointer le Nord) Correction
    * Faire un jeu de Pong : bien consulter la documentation Sense Hat

Mercredi 26/10

Suite avec Raspberry Pi :

  * Introduction
  * Base d'expérimentation
  * Principe de cablage
  * Petit test

Jeudi 27/10

  • Le matin : suite des exercices autour des feux tricolores
  • L'après-midi : mise en place du NodeMCU
  * Montage
  * Installation de l'IDE : [3]
  * Injection des premiers codes (relevé et affichage de température : [4], ajouter ensuite l'humidité)

Semaine 4 cycle 2 : A la découverte des fablabs

Mercredi 2/11

  • Rencontre avec Aurélien Rodot, fondateur de GameBuino (http://gamebuino.com/)
  • Montage du NodeMCU
  • Reproduction de l'exercice du feu tricolore

Jeudi 3/11

  • Suite de l'exercice du feu tricolore, mise en place des boutons
  • Première connexion au WiFi
  • Envoi d'informations et traitement avec IFTTT

Vendredi 4/11

  • Appronfondissement en autonomie
  • Ecriture d'un tutoriel présentant la logique des codes du feu tricolore (étapes 5 et 7)
  • Publication du tutoriel sur WordPress

Cycle "Déploiement de site web, CMS et Cloud"

Semaine 5

Lundi 07/11

  • Veille technologique
  • Présentation de l'UML, diagramme global d'interactions
  • Exercices autour d'UML


  • Publier un site sur le web ?
  • Corrections collectives HTML / JS

Mardi 08/11

  • Structuration HTML 4
  *Mémento des balises HTML
  • Les principales balises HTML 5
  * Structurer sa page
  * Structuration d'une page HTML 5
  • Les formulaires
  * Les formulaires
  * Exemple de formulaire
  • Exercices autour de HTML
  * Reproduire le formulaire suivant [5]
  * Reproduire le formulaire suivant [6]

Mercredi 09/11

  • Visite du quartier créatif
  • Gestion de l'identité numérique et de l'e-reputation

pourquoi s'occuper de son identité numérique
gérer son identité numérique et protéger sa vie privée
comment fonctionne google

  • Travail autour de CSS :
  * Différences entre attributs de display
  * Apprendre les fondamentaux
  * Supports et tutoriels
  * Mémento des propriétés CSS
  * Les 30 sélecteurs à connaître absolument
  • Exercices :
  * Petit jeu autour des sélecteurs
  * En partant de ce code, reproduire ceci en ne modifiant que les styles !
  * En partant de ce code, reproduire ceci (icones [7] et [8]) en ne modifiant que les styles !
  * Reproduire au plus proche la page suivante [9] (sans les animations et sans faire défiler)

Jeudi 10/11

  • Rappels CSS
  * La mise en page avec des div
  * Encore des boîtes
  * Utiliser l'attribut position
  * (Encore) utiliser l'attribut position
  * Utiliser Flexbox
  • Exercices autour de HTML / CSS
  * Jeu autour de Flexbox
  * Reproduire la page d'accueil de [10] (jusqu'au bas de la première photo)


  • Introduction aux CMS
  • Parcours du Back-Office de WordPress
  • Bilan de la semaine

Semaine 6

Lundi 14/11

  * Définitions / Instances
  * Encapsulation
  * Héritage
  * Intérêts
  * Créer un objet Personne avec les propriétés suivantes : nom, prénom et age et une fonction presentation()
  * Créer deux objets fils de Personne : Etudiant et Professeur
  * Etudiant possède comme propriétés supplémentaires un tableau de notes et une filière, et comme action moyenne()
  * Professeur possède comme propriétés supplémentaires une filiere et comme action liste_etudiants()
  * Créer un objet Cours qui possède comme propriétés un Professeur et un tableau d'Etudiants et comme actions inscription() et moyennes()


  • Manipulation de CMS

Lancement du projet de tutoriel, vous retrouverez le résultat du tirage au sort en suivant ce lien Tirage au sort tuto wordpress

Mardi 15/11

  • Autonomie autour du projet

Travail en autonomie sur leur projet de tutoriel Wordpress. Chaque étudiant doit réaliser un wordpress adapté à un contexte professionnel pour mettre en place un CMS.

Le travail demandé est le suivant :

  • Réaliser une page en HTM-CSS, servant de tutoriel pour installer et configurer un wordpress contenant à minima les éléments suivants:
 * une page d'accueil
 * une page de contact
 * un formulaire
 * 3 articles rédigés en lien avec le sujet
 * un caroussel multimédia
 * installer un template
 * et toute(s) extension(s) pertinente(s) pour le sujet proposé
  • réaliser un wordpress adapté à la situation proposée


  • Exercices POO
  * Créer une classe Membre, représentant le membre d'une équipe, ayant comme propriétés un pseudo, un mot de passe et un grade
  * Créer une fonction Membre.toString() renvoyant une chaîne de caractères contenant les informations du Membre
  * Créer une fonction Membre.connexion(motdepasse) renvoyant un message pour indiquer la validité du mot de passe
  * Créer une classe Equipe, contenant un tableau de Membres
  * Créer des fonctions Equipe.ajoutMembre(Membre), Equipe.SuppressionMembre(Membre) et Equipe.afficherMembres
  * Créer une classe Administrateur, héritant de Membre. Y ajouter une fonction creationMembre(pseudo,motdepasse,grade)
  • Exercices de manipuation de formulaires avec JS
  * Comment accéder aux champs d'un formulaire ?
  * Insérer du code Javascript dans votre page de formulaire pour effectuer les vérifications d'usage
    (bon format d'adresse e-mail, majuscule dans mot de passe...) Exemple
  * Proposer un outil de conversion Euros->Dollars et Dollars->Euros avec un champ à remplir par l'utilisateur
  * Proposer un outil calculatrice, qui récupère deux entiers et une opération passés dans 3 champs et effectuer l'opération attendue

Mercredi 16/11

  * Récupérer les données passées par un formulaire puis les afficher en travaillant la mise en page
  * Traiter les données et afficher un résultat en fonction (age > 18 : Vous êtes majeur, Monsieur ou Madame en fonction
    d'une case à cocher, votre nom contient n caractères)
  * Vérifier si les données passées dans le formulaire respectent bien les contraintes (nom et prénom, e-mail, numéro de téléphone)
  * Vérifier que le mot de passe contient au moins une majuscule et un chiffre (utiliser les expressions régulières)
  * Ecrire les données récupérées dans un fichier (Exemple)
  • Autonomie autour du projet

Jeudi 17/11

  • Exercices JS et/ou structurer et alimenter son Wordpress DTA
  • Intervention de Roland Niccoli (OpenScop') autour de WordPress


  • Autonomie autour du projet

Vendredi 18/11

  • Exercices JS
  * Voir programme de mardi
  • Exercices PHP
  * Voir programme de mercredi
  * Faire une page PHP Devine un nombre, avec un champ rempli par l'utilisateur. Le formulaire contenant ce champ rappelle la même
    page qui répond si le chiffre rentré est plus grand ou plus petit que celui attendu par l'ordinateur
  * Rajoutez ensuite un nombre d'essais limité (rappelez-vous que vous pouvez envoyer des données par le protocole GET)
  * Faire une page PHP Conversation qui renvoie un message différent suivant le message que vous envoyez : question, exclamation,
    message vide ou autre chose
  • Présentation de Drupal
  • Installation et utilisation de Drupal (après connexion ssh au VPS)
  * cd /var/www/html
  * rm -R -f drupal
  * wget https://ftp.drupal.org/files/projects/drupal-8.2.3.tar.gz
  * tar -xvzf drupal-8.2.3.tar.gz
  * mv /var/www/html/drupal-8.2.3 /var/www/html/drupal
  * rm drupal-8.2.3.tar.gz


Cycle "Site web programmé"

Semaine 7

Lundi 21/11

Rappels PHP :

  • Récupérer et traiter les données d'un formulaire
  • Manipulation de fichiers
  • Défi : faire une page PHP de quizz (questions type QCM et questions ouvertes)

Mardi 22/11

CK Editor :


Présentation des tutoriels des premiers cycles

Mercredi 23/11

Matinée banalisée pour recherche de stage :

  • Aller à la rencontre des entreprises
  • Venir sur place et structurer sa recherche


Présentation des tutoriels des premiers cycles

Jeudi 24/11

  • Développer un "mini-CMS" : une page web incluant CK Editor, pour créer des documents et les enregistrer au format html sur le serveur dans un dossier spécifique
  • Créer un script listant les fichiers html présents dans ce dossier spécifique et proposer un menu pour les afficher
  • Re-développer son code sous forme orienté objet
  • Ajouter la possibilité de modifier les documents existants dans le dossier spécifique


Lancement du projet du cycle : re-développer Thingspeak par groupes avec récupération des données du nodeCMU, enregistrées dans un fichier au format CSV et restitution sous forme de tableaux et graphiques, avec choix du style

Vendredi 25/11

  • Découvrir Xdebug
  • Autonomie autour du projet

Semaine 8

Lundi 28/11

Mardi 29/11

  • Autonomie autour du projet et des tutoriels
  • Suite du "mini-CMS"

Mercredi 30/11

  • Autonomie autour du projet et des tutoriels
  • Exercices JS
  * Créer un gestionnaire de contacts (qui sera un objet) contenant un tableau de contacts (nom, prénom, mail, téléphone)
  * Créer dans cette classe une fonction ajoutContact, une fonction afficherContacts, une fonction supprimerContact
  * Créer un formulaire dans une page HTML permettant d'ajouter un nouveau contact (pas de doublons, le mail doit être unique)
  * Afficher la liste des contacts et la mettre à jour à chaque nouvel ajout
  * Ajouter un bouton supprimer à côté de chaque contact et mettre à jour la liste affichée après suppression

Jeudi 01/12

  • Autonomie autour du projet et des tutoriels
  • Enregistrement des tutoriels vidéo : expliquer la POO et son utilité autour d'un exemple

Vendredi 02/12

  • Enregistrement des tutoriels vidéo
  • Autonomie autour du projet et des tutoriels‏‎