Programme des cours 2023-2024
BINV2150-2  
Développement web : avancé
  • Javascript : avancé
  • Ergonomie web
Durée :
Javascript : avancé : 48h Pr
Ergonomie web : 12h Th
Nombre de crédits :
Bachelier en informatique, orientation développement d'applications (Bachelier en informatique, orientation développement d'application)6
Nom du professeur :
Javascript : avancé : Raphaël BARONI, Sébastien STREBELLE
Ergonomie web : Patrick KIBALE
Coordinateur(s) :
Raphaël BARONI
Langue(s) de l'unité d'enseignement :
Langue française
Organisation et évaluation :
Enseignement au premier quadrimestre, examen en janvier
Unités d'enseignement prérequises et corequises :
Les unités prérequises ou corequises sont présentées au sein de chaque programme
Contenus de l'unité d'enseignement :
Cette unité d'enseignement aborde les thèmes suivants :

  • Langage de programmation Javascript et technologies associées : manipulation du DOM, animations, Bootstrap, HTML, module bundler, AJAX, JSON, JWT...
  • Single-Page Applications intégrant une IHM et un web service en Node.js via le framework Express.
  • Ergonomie Web.
Acquis d'apprentissage (objectifs d'apprentissage) de l'unité d'enseignement :
Acquis d'apprentissage spécifiques

Voir descriptions des activités d'apprentissages.

 

Compétence(s) - Capacité(s):
C01 - Communiquer et informer
CA1.D - Utiliser le vocabulaire adéquat
CA1.E - Présenter des prototypes de solution et d'application techniques
CA1.F - Utiliser une langue étrangère
C03 - S'engager dans une démarche de développement professionnel
CA3.D - Travailler tant en autonomie qu'en équipe dans le respect de la structure de l'environnement professionnel
C05 - Mobiliser les savoirs et les savoir-faire lors du développement d'applications
CA5.a - Concevoir, implémenter et maintenir des algorithmes répondant aux spécifications et fonctionnalités fournies
CA5.b -Choisir et mettre en oeuvre un standard défini ou une technologie spécifique (méthodologie, environnement, langage, framework, librairies, ...)
CA5.c - Utiliser et exploiter des méthodes de modélisation lors de la phase d'analyse pour traduire les besoins des utilisateurs, sous forme d'un cahier de charges Concevoir, implémenter, administrer et utiliser avec maîtrise un ensemble structuré de données
C06 - Analyser les données utiles à la réalisation de sa mission en adoptant une démarche systémique
CA6.e -Prendre en compte la problématique de sécurité des applications
CA6.f -Soigner l'ergonomie des applications
 
Acquis d'apprentissage(s) terminaux visé(s):
- AAT1 - Programmation - Concevoir des solutions informatiques efficaces qui répondent à des problèmes en maitrisant les structures de données véhiculées.
- AAT5 - Qualité - Se conformer aux bonnes pratiques du métier tout en restant critique.
- AAT6 - Autonomie - Exploiter de façon autonome et rigoureuse les différentes ressources d'information (en français ou en anglais).
- AAT8 - Equipe - Collaborer au sein d'une équipe en s'adaptant à ses interlocuteurs, en organisant les différentes tâches d'un travail selon leur complexité et leur dépendance ainsi qu'en respectant les délais prévus.
- AAT9 - Flexibilité - Affronter des situations nouvelles en se formant pour intégrer les changements.
Javascript : avancé
Acquis d'apprentissage spécifiques

A la fin du cours, les étudiants seront capables de :

  • Créer un service web ; c'est ce que ferait des développeurs backend ; ainsi on créera plus spécifiquement des RESTful API, une application mettant à disposition de clients des opérations sur des ressources ;
  • Créer une Interface Homme-Machine (IHM) interactive, moderne & esthétique ; c'est ce que ferait des développeurs frontend ;
  • Intégrer l'authentification, l'autorisation et les sessions d'utilisateurs au sein de SPA; c'est ce que ferait tant des développeurs frontend que des développeurs backend pour sécuriser l'accès à des opérations sur des ressources.
  • Déployer une SPA sur le cloud ; c'est ce que ferait des développeurs ou des administrateurs ; en effet, on préfère accéder à une application web via Internet que de devoir l'installer localement sur chaque machine où l'on souhaiterait l'utiliser.
  • Intégrer au développement d'une SPA des technologies non vues en cours ; vous aurez l'opportunité de sélectionner et appliquer des librairies JS non pratiquées directement dans les exercices de ce cours ; c'est ce que ferait tant des développeurs frontend que backend, ils doivent régulièrement analyser et appliquer la documentation associée à de nouvelles librairies ;
  • Documenter et présenter en vidéo le développement d'une SPA ; tous les développeurs doivent à un moment où l'autre documenter, présenter et "vendre" le travail réalisé.
  • Analyser le développement de SPA faites par des pairs ; les développeurs doivent régulièrement participer au processus de revue du travail fait par d'autres personnes ; cela permet d'augmenter la qualité d'une application, tout comme cela donne des idées pour ses futurs projets.
Ergonomie web
Acquis d'apprentissage spécifiques

  • Comprendre ce qu'est une approche marketing à l'ergonomie, et être capable de l'appliquer.
  • Evaluer un site Web ou une App sur base de recommandations de référence et théorèmes marketing.
  • Maîtriser un processus de création d'un site Web ou une App en utilisant une méthodologie dédiée à l'ergonomie.
  • Proposer et implémenter des améliorations ergonomiques à un site web existant.
Savoirs et compétences prérequis :
/  
Javascript : avancé
/  
Activités d'apprentissage prévues et méthodes d'enseignement :
Activités       Intitulé de l'activité              Volume horaire
BINV2150 A    Javascript                                        48
BINV2150 B    Ergonomie web                                12

Ces deux activités d'apprentissages sont regroupées car le cours d'ergonomie utilise les interfaces utilisateurs développées dans le cours de JavaScript pour mettre en œuvre des compétences d'ergonomie.

De même, la qualité des projets développés en JavaScript est augmentée grâce à l'application de compétences en ergonomie.
Javascript : avancé
Activité pédagogique n°1 (Ac1) - Capsules vidéos en ligne (~30 min en distanciel pour chaque séance)

  • En distanciel, vous visualisez les vidéos qui sont demandées en entrée de la séance.
  • Vous préparez vos questions pour la séance où la vidéo sera discutée.
Activité pédagogique n°2 (Ac2) - Vérifier la compréhension en groupe (~30 min en présentiel pour chaque séance)

  • Lors du début de la séance de cours, nous écoutons tous chaque question et toute la classe participe, dans la mesure du possible, pour apporter une réponse. Nous souhaitons que vous participiez activement à ces échanges, cela enrichira l'expérience de tous !
  • Des questions vous seront posées afin de s'assurer de la bonne compréhension des concepts. N'hésitez pas à répondre. En fonction des échanges, si nécessaire, des explications, illustrations et présentations vous seront offertes quand approprié.
Activité pédagogique n°3 (Ac3) - Exercices en autonomie (~ 90 min en présentiel, 30 min en distanciel pour chaque séance)

  • Vous pratiquez en classe les concepts via les exercices proposés. Vous terminez vos exercices en distanciel si nécessaire.
  • Vous êtes encouragés à poser vos questions ou à demander de l'aide en cas de difficultés sur un exercice.
  • Veuillez offrir un temps raisonnable pour créer, ou tenter de créer, votre propre implémentation d'un exercice, sans regarder la solution ; n'hésitez pas à consulter, par la suite, la solution.
  • Si vous éprouvez de la difficulté, vous pouvez choisir de réaliser un exercice en utilisant les conseils donnés.
  • Si vous souhaitez approfondir ou élargir votre apprentissage, vous pouvez le faire en implémentant les challenges proposés.
Activité pédagogique n°4 (Ac4) - projets

  • Tout au long du cours vous allez réaliser un projet mettant en œuvre toutes les compétences du cours. Vous devrez créer un groupe de 4-5 étudiants pour réaliser un projet vous tenant à coeur, à votre rythme, sous réserve du respect des jalons imposés.
  • Tout au long du développement associé au projet, vous devez compléter un rapport individuel en utilisant le modèle de document qui vous sera donné. Vous devez notamment vous exprimer par rapport à l'atteinte des objectifs fonctionnels, aux difficultés rencontrées et à d'autres questions ouvertes.
  • Durant votre projet, vous devez compléter un rapport de groupe en utilisant le modèle de document qui vous sera offert. Vous devez notamment vous exprimer par rapport à l'atteinte de vos objectifs fonctionnels, aux difficultés rencontrées, aux conseils pour appliquer la technologie.
  • A la fin de votre projet, vous devez réaliser une présentation vidéo de 5 à 10 minutes ayant notamment pour but de promouvoir votre projet.
  • Vous êtes encouragés à poser vos questions ou à demander de l'aide en cas de difficultés sur votre projet, tant pour les difficultés techniques, organisationnelles ou relationnelles.
Activité pédagogique n°5 (Ac5) - revues de projets par les pairs

  • Une fois la deadline de soumission des projets atteinte, la saison de revues des projets est ouverte. Vous participez à la revue bienveillante, aux critiques constructives, de sites web faits par vos pairs.
Mode d'enseignement (présentiel, à distance, hybride) :
Voir descriptions des activités d'apprentissages.
 
Javascript : avancé
  • Activité pédagogique n°1 (Ac1) - Capsules vidéos en ligne : ~30 min en distanciel pour chaque séance
  • Activité pédagogique n°2 (Ac2) - Vérifier la compréhension en groupe : ~30 min en présentiel pour chaque séance
  • Activité pédagogique n°3 (Ac3) - Exercices en autonomie : ~ 90 min en présentiel & 30 min en distanciel pour chaque séance
  • Activité pédagogique n°4 (Ac4) - projets : travail en présentiel & en distanciel
  • Activité pédagogique n°5 (Ac5) - revues de projets par les pairs : en distanciel
Ergonomie web
Enseignement en présentiel:
  • des cours de 2h seront données suivant le calendrier définies en début d'année
  • des sessions de questions / réponses sur la matière sont organisées par l'enseignant
Lectures recommandées ou obligatoires et notes de cours :
Javascript : avancé
  • Site web du cours contenant tous les supports : découverte des concepts, tutoriels, exercices...
  • Notes de cours
Ergonomie web
  • Slides fournis par le professeur
  • Références externes listées par le professeur
  • Notes de cours
Modalités d'évaluation et critères :
Responsable de l'évaluation: BARONI Raphaël
 
Langue de l'évaluation: Français
 
Mode d'évaluation et pondération: Examen écrit
 
La pondération de la note globale de l'UE est au prorata des heures associées aux différentes activités d'apprentissage :

  • Javascript (5 ECTS, 48h) : 80%
  • Ergonomie web (1 ECTS, 12h) : 20%
L'évaluation de cette UE n'est pas intégrée ; elle est composée d'activités d'apprentissage distinctes donnant lieu, à partir de 10/20, à des reports de notes légaux d'une session à l'autre et d'une année académique à l'autre.

Les compétences évaluées dans le cadre de JavaScript sont principalement associées à une production de code, alors qu'en ergonomie les compétences évaluées sont principalement liées à de l'analyse. Les deux activités d'apprentissage sont donc évaluées de manière distinctes.
 
Javascript : avancé
  • En première session, les compétences des étudiants sont évaluées par le biais d'un projet (30% des points) et d'un examen (70% des points).
  • Le projet consiste à la mise en œuvre d'une application web reprenant les technologies vues en cours et appliquant des librairies JS à explorer.
  • L'examen consiste en la production de code reprenant les compétences développées lors du cours.
  • En deuxième session, les compétence des étudiants seront évaluées par le biais d'un examen seulement (100% des points). Toute évaluation réalisée préalablement ne sera pas prise en compte dans l'évaluation finale.
Ergonomie web
  • Les compétences de l'étudiant·e seront évaluées par le biais d'un projet (30% des points) et d'un examen (70% des points).
  • Le projet consiste à la mise en œuvre d'une application reprenant la matière vue en cours ;
  • L'examen consiste en une épreuve écrite (théorie et étude de cas)
  • En deuxième session, les compétence de l'étudiant·e seront évaluées par le biais d'un examen seulement (100% des points). Toute évaluation réalisée préalablement ne sera pas prise en compte dans l'évaluation finale.
Stage(s) :
Remarques organisationnelles :
Lors du calcul de la moyenne arithmétique pondérée du PAE d'un étudiant, ainsi que du calcul de la moyenne arithmétique pondérée globale de son cursus, le poids associé à la note de la présente UE est son nombre d'ECTS.
Contacts :