0% found this document useful (0 votes)
9 views16 pages

Examens GI2 2022 2023

The document outlines an exam for a Spring development course, featuring questions on servlet filters, Spring MVC interceptors, Hibernate, and session management. It includes practical exercises related to Spring Boot applications and project management, specifically focusing on a case study for a service offered by Tech-iNova. The exam emphasizes understanding of concepts and practical application in software development and project management.

Uploaded by

Mohamed Jarmouni
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF or read online on Scribd
0% found this document useful (0 votes)
9 views16 pages

Examens GI2 2022 2023

The document outlines an exam for a Spring development course, featuring questions on servlet filters, Spring MVC interceptors, Hibernate, and session management. It includes practical exercises related to Spring Boot applications and project management, specifically focusing on a case study for a service offered by Tech-iNova. The exam emphasizes understanding of concepts and practical application in software development and project management.

Uploaded by

Mohamed Jarmouni
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF or read online on Scribd
You are on page 1/ 16
023 Durée 1h Unies Abdemalek Esse Examen dela Sesion Normale du Printemps ~ OF. coleNatonle des Scenes Appius ALfecina ements va ee RaS* pépartement Mathématiques et Informatique peplereesia ae _— Les documents ne sont pas autorisés, Ecrite simplement et isblement. Baréme :1 point par question Questions 41- Pourquoi avons-nous besoin d'un filtre de servlet ? 2- Quelle est la différence entre un intercepteur de Spring MVC et un filtre de Servlet ? @) Donner deux moyens de sui le session dans les applications web basées sur les servlets ? 4- Quel est le réle de lannotation @Autowired ? SE A quoi sert I'annotation @ModelAttribute de Spring MVC ? |S_Quelle est la dépendance qu’il faut ajouter pour la validation des données avec Spring MVC ? © A quoi sert l’annotation @Qualifier ? B Donner deux grands avantages de Hibernate par rapport & JDBC? _%® Comment eréer une session Hibernate? 22 20- Est-ce que la session hibernate est thread-safe? mionotheede Gessise Factor @a quoi sert le filtre QpenSessionIn ViewFilter 2 32 Expliquer le concept de /azy loading en hibernate? ‘J Expliquer le réle d'un cookie dans la gestion de la session itp. Quelle est la différence principale entre un filtre et un intercepteur Spring MVC? JE Quels sont les avantages d’avoir une couche « services métier » dans une application Spring ? 146+ Nous voulons concevoir une couche d’accés aux données générique avec le pattern DAO et Hibernate nati. Donner un diagramme de classe qui explique votre prop AF- Quelle est la différence entre JPA et Hibernate A& Quelle est a difference entre Verroullage pessimist et le Verouillage optmiste ? (32 Le schéma ci-dessous iluste le eyele de ve d'une requte& travers deux intereepteurs Spring, Donner 'ordre dexécution des étapes indiquées par des lettres sur la figure, Imtercepteur2 —_—_Intercepteur2 mee “pa pretend comb J se a2 ue HL TCompleton || || afterCompletion| pe d'un pool de connexion 1 Vat Ave Tannen dea Seon Normale Pts — Sun 2029 Ce esis ie ‘Module Développement des appletons Sprig Déparerenthithemasiqoes efor oe Deuxiéme Année Ingénierie des Données Durte 014309 Les documents ne sont ys autoriss. ’lilsation du correcter » Blanco» edu crayon est interdit, I est inert d'échanger vos ouritures ave autres éhutints. Le bareme est donné ire indicat Le sujet est composé de 4 pues. Juestions de cours (2 polnts): 1+ Quelle est ln différence entre un fillre de servlet et un intercepteur Spring ? 2 Expliquer le concept du chargement tard dans Hibernate? Exercloo 1 ( 8 points): ‘On considére une application Spring web utilisant maven, On teste cette application en local. Elle est déployée avec le nom de contexte app_examist elle est accessible via Attp:/Mocalhost:8080/app_exany. On suppose que l'application est correctement configurée. L"identifiant de session est échangé via des cookies. Les Togs sont désactivés et par conséquent, Taffichage sur la console ne peut provenir que d'un appel explicite dans le code a la méthode Sjstemout.printia..On a 1ré les instructions imports dans les codes ci-dessous pour simpli ication est constituée des classes/interfaces suivantes package con.ensah; TBmports — Kontrolier public class MyController { (@GetMapping("/test") «— public String test! \ return "test"; package con.ensah; public interface Servicel ( ) ‘Service mph java package con.ensah; Umports public class Service1inpl inplements Services, ( public Servicetinpl() { . CS System.out.printin("Servige 3°); y public void tester() ( Systen.out.printin("tester"); package com.confi //imports — Ghrobiotsine guration sreapoenescar(basePackages = { "con-ensah )) come erase Aopcontlginplenente hebweconfigurer ( aoe viewesolverinternoResourcevitesolver() { aeestResourcevieutesolver bean = new TnermalResourceViewesolver(; bon, sethienelags(aet vie, €1359); bean: setPrefix" MEDI /vieu/$5/°)5 pean setsuFFin( pape SSDI retur beens © Y it, Le code ne contient pas d’erreur de compilation. ‘A Vexécution de la requéte Jmtp:/Mocalhost:8080/app examiest, vers quelle page Spring MVC va rediriger ? Beet iam code précédent on ajoute annotation @Service sur la classe Service! np eon ajoute ls 3 ttributs suivants dans la classe MyController : Ghutowired ‘private service! serviced; @tutowired private Servicel service2; @avtovired private Service1 service? Qu'affiche application dans la console lors de son démarrage? Dans le méme code précédent (celui de la question 2) on ajoute dans la classe Service mp! aprés I'annotation Service annotation @Scope( prototype"). Qu’ affiche l'applicaton dans la console lors de son démarrage? ‘Dans le méme code précédent (celui de la question 3) on supprime l'annotation @Autowired sur les deux attibuts service? et service’: sascnired private Service! service2} private Service! serviced; Qu'affiche 'application dans la console lors de son démarrage? (On garde le méme code prévédent (celui de la question 4) et on change le code de MyController comme indiqué ci-dessous : @controller . public class Mycontroller { Gautowires private Service! servicel; private Servicel service?; (6etMapping("/xest/{i)") public String test (@pathvariable int id) ( if(4de=1) { service e005 y else ( ‘ service2.tester(); Systen.out.printia("s2"); y return "test"; ? y 5-a. Que se passe-il sion exécute la requete: hifp:/ocathost:6080/app_exanvtest/1 |? ‘5-b. Que se passe-il si on exécute la requéte: http:/ocalhost:8080/app_exanvtest/2 'y Dans le méme code précédent (celui de /a question 5), on ajoute le contséleur suivant package con.ensah; fanports = controller Goblic class Bcontroller ( Gautowired private ServietContext cj @tutouired private HttpSession s; cetMapping(” /testi") public String testi() ( c.setattribute(*key", "hello"; susetattribute("key", "ensah")} return "test"; i i 3 : = SVVVIEEEEVUVUVUEVEVUVUUUU ESE SOBEL Y ee ecropping(~/eest2/(0@)") geecnnpingt/esea(gesttvartable String key) ( BF gecapersbute( cee oueori aise ¢ dais ( seen. out.printin("Bonjour"); y return “test d In mull 88 cagetAttrsbute(key) I= null) { une getAttribute(key) +" s,getattribate(key))5 COnexéeute depuis un méme poste client et un méme navigateur la requéte hitp:/Mocalhost:8080/spp.examn/est] suivie directement dela requéte hip: Mocalhost:8080/app_exanviesin2/Key . Qu'affiche l'application? 7. Dans le méme code précédent (celui de Ia question 6), on exécute depuis un navigateur client Ia requéte ‘itp: /MocalhostS080/app_exanvtest! puis on exéeute la requéte htip:/Mocalhost:8080/ app _examviest2/Key? Qu'aftiche l'application? — 8 Dans le méme code précédent (celui de la question 6), on exécute depuis un navigateur client Ia requéte ‘itp:/Mocalhost-8080/app_exanv'est! on efface toutes les cookies enregistrés sur le navigateur client puis on exécute la requéte hntp:/ocalhost:8080/ app_exam/tes2/key Quiafiche application? 2:(10 [Nous voulons développer une petite application avec Spring Boot pour Ia gestion des contacts en utilisant le concept @injection de dépendances et I'architecture multicouches. Cette application permet a un utilsateur d'enregistrer via un formulaire (cf figure 2) de nouveaux contacts ct d'afficher la liste des contacts déja enregistrés. La gure / montre Ia structure du projet. Un contact est défini par la classe Contact donnée ci-dessous. public class Contact ( private Long id; private String nom; private String emall; private String telephone; Mgetters et setters ) Cette application utilise une base de données de type mariadb pour le stockage des données, ‘On vous donne également le code du fichier de configuration application properties e lecode de la vue JSP: Fichier application.properties spring.mvcxview.prefi spring.mvcwview.suffi DATARS spring,datasource.urleidbcmariadk//locathost:3306/ds_db spring.datasource.username=toot spring datasource.password= spring datasource driver-class-name=org,mariadb jdbc Driver spring jpahibernate.ddl-auto=update Resolve /WEB:INF/jsp/view/ 4 p ee vermin 1D conctContjoe + comounhreperbtes Of conception © cmenhserier BF conucbingsencejne 1, conmantngsecemgyee Berens Spee bn 31) 3, MavenDepndencer vGwe ewe vow rere Cen tomb urease du po 314 Code deta ISP body>
pocteNomeslobelnctinput path="nom” type="text” plaeholders"nam" /2
Sabeistmatiabetsetnput path="emall” type="text" placeholder="emal! />
“tabelsTélépnonecabel>Ajouter J elable border="tpx"> “thead> | «to i «th scope="0 «th scope="¢o!"semailth> | sho | a { to out valve="S(uA}"/> ‘td>cciout value="Sltelephone}" /> emai)" > ( © © tocahostanborno:h Figure2 GD Expliquer & quoi sert chaque ligne du fichier de configuration applica tion,properties donné ci-dessus. (B Ajower les annotations JPA néessires sur la classe Contact pour que Spring Data JPA prenne en charge la persistance des objets de cette classe. 3. Eerie le code de'interfuce ContactRepositoryqui utilise Spring data JPA et qui permet dimplémenter les opérations CRUD sur les objets Contact 4. On considére ci-dessous l'interface du service métier permettant de gérer les contacts: public interface Contactingservice { public Contact saveContact (Contact ¢); public List«Contact> getAll(); 1 Berire la classe ContaetMngServicelmpl qui implémente ce service. 5 Berire le code du contréleur qui implémente les fonctionnalités de |’application. Suse, eneks upelate Université Abdelmalek Essaadi ENSA AL HOCEIMA. Module : Gestion de Projet Examen final en Gestion de Projet Classe : Cycle d’ingénier en Génie Informatique Niveau : 2°™* année / Semestre : S4 Durée : 3 heurs CONSIGNES Y Ilsera pris en considération la qualité de la rédaction lors de la correction. Y —Aucun document n’est autorisé. ETUDE DE CAS : OFFRE DE SERVICE La société Tech-iNova désire proposer un service innovant aux annonceurs en recherche de nouveaux moyens de communication. Elle utilise un code-barres avancé dans lequel se trouvent de nombreuses informations. Ce code-barres est intégré 4 cété d’une publicité imprimée (ou & imprimer), qui se trouve dans un magazine, un journal, un flyer ou tout simplement sur le site web de l'annonceur. La société peut éventuellement mettre sur son site web (tech-inova.ma) le logiciel réalisé en Flash capable de lire ce code-barres par I"intermédiaire d’une caméra, La base de données sera donc intégrée dans les modules Flash et tout client voulant ce service, pourra avoir sur son propre site un lien invisible pointant sur le site (www.tech-inova.ma). Ce module pourra étre intégré sur tous ies sites des annonceurs sans aucune difficulté : une simple ligne de code peut donner ce résultat. La base de données est stockée sur les serveurs de Tech-iNova, sachant que la taille d’un module est de quelques kilo-octets sur le site des annonceurs. La clientéle de ce projet seralles annonceurs et les grandes entreprised disposant de budgets conséquents alloués la communication. Le modéle adopté est done un modéle B2B, c'est-A-dire que les clients de Tech-iNova ne seront que des entreprises et non directement les consommateurs. 1. Préviser "objectif principal du projet. (1,5 pt.) 2. Dans Ja gestion des projets que représente : (1 pt) a) Tech-iNova, b) _Les annonceurs et les entreprises. Page | 1/3 Université Abdelmalek Essaadi ENSA AL HOCEIMA Module : Gestion de Projet I. LOTISSEMENT DU PROJET Les principales activités du projet sont décrites dans le tableau suivant : Lot Tiche Signification_ Durée en jours | Prédécesseur Etude préalable | _A- | Etude préalable et spécification §—[otisement du prot x rude détaillée | [/C—} Planification du projet ~~ B D_-] Elaboration du cahier des charges c E. Elaboration du modéle 3D D Modéisaions0 FE Pesan [— H Test du modéle 3D _ EG ; [Pram D Siteweb [yest dusite web 2 I Documentation | K | Documentation du projet 5 D Tntégration| TL [Intégration T BI Livraison M__| Mise en place chez le client 1 KL Tableau: Tiches des projets Proposer un découpage du projet en lots selon la méthode WBS (Work Breakdown. Structure). (1 pt.) I. PLANIFICATION DU PROJET Le tableau 1 montre les différentes taches identifiées, leurs durées d’achévement, ainsi que les relations de précédences entre elles. La date de début prévue du projet est Je lundi 12 Juin 2023. Toutes les téches sont réalisées pendant les jours ouvrables (du hundi au vendredi). 4, Etablir le tableau des niveaux. (1 pt. 5, Blaborer le diagramme de PERT, indiquer les dates au plus tot et au plus tard dans le diagramme. (3,5 pt.) 6. Quelle est (en jours) la durée de réalisation de cette application ? (1 pt.) 7. Quelle est la date de fin du projet ? (1 pt.) 8. Calculer les marges totales. (2 pt.) 9. Indiquer le chemin critique. (0.5 pt.) sur la réalisation et avancement du projet si la tiche K « documentation duprojet » dure 7 jours au lieu de 5 jours ? Justifier votre réponse. (1,5 pt.) 0 “ oy 3 ‘A i? Page 12/3 Université Abdelmalek Essaadi ENSA AL HOCEIMA, Module : Gestion de Projet Il. ESTIMATION DE CHARGE Le tableau suivant représente I’estimation des charges correspondant au code source & produire pour chaque lot. | kot sd NOMBRE DE LIGNE EN (ISL) ‘Modélisation 3D 10000 oy a \' Site web 42500 D 11. Calculer la charge (en Mois Homme) de la programmation de chacun des 3 lots (Lotl, Lot? et Lot3) en utilisant la méthode COCOMO : (2 pt.) ‘TyPE DE PROJET (ata a ‘Simple (<50 000 lignes) C= 3,2 (Kis!) !95 D=2,5(C)%* Moyen (<300 000 lignes) C= 3 (Kis)tiz 5 C)98 Complexe (>=300 000 lignes) C= 2,8 (Kisl)!2 5(C)0% Kisl: nombze de lignes de code divisé par 1000 (kilo ligne de codes). IV. PERFORMANCE DU PROJET. En se basant sur ce sommaire d’avancement des travaux a la fin de la 6éme journée : Valeurs cumulatives en DH Jour Valeur planifiée (VP) Coit réel (CR) Valeur acquise (VA) i 200,00 200,00 200,00 2 500,00 400,00 450,00 a i 900,00 |= —900,00—|— 000,00 4 | 12000 |= 1300.00] 200,007 3 1400,00 140,00 1500,00 o—| - 1600,00- —— 1800;00-—| TE00;00~ Demier jour 12000,00 Tableau 2: Avancement des travaux 12. En utilisant la méthode de la valeur acquise, calculer : (4pt.) a) L’indice de performance coft (IPC) 4 la fin de la 6éme journée. b)L’indice de performance délai (IPD) a la fin de la 4éme journée. ) L’écart cofit (EC) a la fin de la 68me journée. 4) L’écart de prévision délai (ED) A Ja fin de la 3¢me journée. Page | 3/3 nT proposez-vous ? Quelles sont les quatre valeurs de base de cette approche ? Donnez un exemple de méthode appartenant & cette approche. Partie II : (10pts) ‘Nous avons I'intention de développer une application d'achat de matériel informatique, et nous souhaitons adopter ‘une bonne pratique pour assurer une gestion efficace de l'application, Dans un premier temps, nous devons gérer les objets "Serveur", "PC" et "Tablette" qui appartiennent@ la catégorie des "Ordinateurs". Chaque ordinateur est caractérisé par un numéro, un nom, une capacité de RAM, un espace de stockage HDD et un processeur CPU, II est essentiel que notre application soit indépendante de la maniére dont ces produits sont créés, assemblés et représentés. Pour atteindre cet objectif, nous envisageons d'utiliser une seule classe qui aura la responsabilité d’ Yobjet correspondant au type spécifié en paramétre. Afin de déterminer le type dobjet a instancier, nous utiliserons des énumérations. 1. Quel est le design pattem que nous devons utiliser ? Justifier votre réponse. 2. Nous souhaiterions pouvoir joumnaliser l'ensemble des opérations d’achat effectuées et de les afficher Ja console. Quel est le design pattern que nous devons utiliser ? Justifier votre réponse. Comment assurer le bon fonctionnement de notre application dans un contexte de multithreading ? Et pourquoi ? 3. Donner le digramme de classe correspondant. 4, Une nouvelle classe comespondant 4 un SmartPhone est ajoutée notre application. Apporter la modification nécessaire au diagramme de classe afin que l'application prenne en compte le nouvel objet. Crest quoi I'avantage essentiel de l'utilisation du design pattern que vous avez choisi dans la question! 5. Eerire le code Java relatif. 6. Donner un exemple d’exécution (la méthode main ()), penser 4 I'affichage de la journalisation. Nous voulons que notre application prenne en charge d’autre catégorie Accessoire qui a une certaine liaison avec Ja catégorie Computer. Un accessoire informatique a un numéro, un nom et un prix, Les accessoires que nous avons sont : Casque, Souris, Vidéo projecteur.... 7. Quel est le design pattern que nous devons utiliser pour implémenter la catégorie Accessoire ? 8. Quel est le design pattern qui permet de lier les deux catégories de notre application ? Donner le digramme de classe associé au changement. 9. Quel modéle suggérez-vous d'utiliser pour assurer une séparation claire et organisée entre la logique meétier, la présentation de l'interface utilisateur et la gestion des données dans votre application d'achat de matériel informatique ? Quels design patterns sont impliqués dans ce modéle ? lest J evanen cael Ce me Au R Génie Logiciel . Qa Ae page et & lemaquce dlerpiene Sout cendus on pop: FS 3/3 Pr. RAGRAGUI Anouar Volet 2 : Marketing fondamental (7 points) Llentreprise « INDUSALIM », Industries alimentaires réunies a été crée en 1987 4 Settat. Des sa création, elle a fabriqué et commercialisé de|la margarine, Dans les années 1980, le concept de la margarine de table était inconnu des consommateurs marocains, la margarine était en effets synonyme de matiére grasse pour la cuisine et la patisserie industrielle. le pari « INDUSALIM » fut de concevoir une margarine qui pouvait étre consommée a table, autrement que pour culsiners Clest ainsi qu'est née(@agdor) grace 8 un travail de recherche marketing, La consistance du produit (& base végétale), son conditionnement (en barquette, ce qui le rend plus hygiénique, plus présentable, plus facile a et conserver), sa distribution auprés de tous les commerces, ainsi que les opérations de communication ont permis d'installer le concept. INDUSALIM Gevient ainsi le piotnier de la margarine) ie table au Maroc. Quelques années plus tard a lancée pour élargir la gamme. L'écoute du marché @ permise aussi l'entreprise de lancerGeux autres margarine: répondant & des besoins veux définls des consommateurs-{Startine\adaptée aux enfants urbains car plus facile @ tartiner avec gott sucré et de(Fioréieurtout destinge aux fermes compte tenu de ses vertus diététiques. co Aujourd’hui, « INDUSALIM » est leader sur le-marché de I marques phares. la margarine avec ses quatre Toutefois, « INDUSALIM » est confrontée & une situation d'un marché mar, stagnant, dans lequel les évolutions des parts de marché sont faibles. La pénétration du marché (la consommation par téte d'habitant) semble stagner, selon une étude sectorielle, a atteint un niveau difficile 8 dépasser, compte tenu des habitudes de consommation des marocains. {INDUSALIM » dispose d'un savoir-faire en matiére alimentaire, des circuits de distribution bien huilés, une force de vente performante. M. Moubarak chef des ventes se demande s'il ‘rent de la margarine, ou bien sil faut continuer de faut lancer un nouveau produit segmenter le marché pour augmenter sa pénétration. 4°) En quelques lignes expliquez intérét pour une entreprise de suivre une démarche marketing ? (1 point) jotre réponse. 2°) A quel niveau du cycle de vie se trouve le produit margarine ? Justifiez ve (1 point) 3°) Expliquer les termes soulignés en gras ? (2 points) ue vos connaissances, quelles sont les 4°) En vous basant sur le texte c-dessus ainsi a de la margarine au Maroc ? (1 point) variables influencant le comportement d'achat Jégies de distribution que vous connaissez ? Définissez-les et 5°) Quelles sont les strat: lus adaptée pour Startine ? (2 points) précisez la stratégie la pl Page Ssur5 EXERCICE (4 points) U'entreprise SOCOMAR fabrique deux produits P1 et P2, obtenus a partir d'une matiére premiére unique M, dans un seul atelier de production. Les produits obtenu ckés avant la vente. Les données suivantes sont relatives au mois de décembre 2018 : Hadkoui Fatima 1- Tableau de répartition des charges indirectes : Seren Sections principale auxiliaires Eos 5 5 : a 2 = g Charges indirectes | Montant} = g E s 2 £ 2 a. = 5 3 2 BE 3 2 2 Es es 3 = = is 2 £ 2 3 & iol a < < Totaux primaires 222.000 | 26.000 | 17.000 12.000 144.000 | 23.000 Répartition secondaire Administration - | 10% 20% 40% | 30% Entretien 20% - - 60% 20% Kgdematitre | siege | 20008 Nature unité d’euvre premiére Tay de achetée 10-0 | ventes { 1 2+ Stocks au 01/12 : Matiére premiére M : 8.000 Kg 8 3,40 DH le Kg Produits finis P1 : 500 unités a 86 DH l'une. {3 Achats : Matiére premiére M : 24,000 Kg 83,45 DH le Kg. 4- Consommations de Matiére premiére M : 12.000 Kg pour le produit P1. 10.000 kg pour le produit P2. 5- Main d’ceuvre directe utilisée par la section production : 3.150 h pour le produit P1 2.850 h pour le produit P2 Taux horaire : 32 OH. 6- Production : Produits finis P1 : 3.000 unités Produits finis P2 : 2.000 unités. 7-Ventes : 2.500 Produits P1 8 100 OH l'un 1.200 Produits P1 a 125 DH l'un. Travail 8 faire : 1°) Compléter le tableau de réparation des charges indirectes ? 2°) Calculer le cout d’achat de la mati@re premiére M ? 3°) Calculer les codts de production de P1 et P2 ? Page 4 sur Université Abdelmatek Essaidi 2 Web2: Applications Web modernes (2h) A.U : 2022/2023 Exercice 1: Dans cet exercice vous allez eréer une application de gestion de bibliothéque. Pour cela, vous deyez suivre les instructions suivantes Important: L'utilisation de boucles traditionnelles telles que for, while est interdite et sera considérée comme incorrecte pour cet exereice. Vous devez. utiliser les méthodes_map.— reduce, filter, some et every pour manipuler les tableaux. Les classes doivent étre écrites en ES6. ~ 1. Créez. une classe "Livre" dans un module « livre,js » avec les propri + Titre = Auteur + Nombre de pages + Etat (emprunté ou non) par défaut cet état est false Cette classe doit aussi avoir une méthode pour changer l'état d'un livre. -z une classe "Bibliothéque" dans un autre module « biblio,js » qui contient un tableau wres. Cette classe doit avoir les méthodes suivantes 2. Cre del + Ajouter un livre : addLivre(titre, auteur, nbPages, etat) + Supprimer un livre par titre : deleteLivre(titre) + Rechercher un livre par titre : getLivre(titre) + Retourner les livres empruntés : getLivresEmpruntes() «© Changer I’état d’un livre par titre : changerEtat(titre) + Retourner un tableau des livres de la bibliothéque sous la forme suivante : C (titre: ‘Le Seigneur des Anneaux', disponibilite: ‘emprunte'), {titre: ‘Harry Potter’, disponibilite: 'disponible') * Retourner le livre avec le plus grand nombre de pages : getLivresMaxPages() = Vérifier si tous les livres sont empruntés : isAllLivresEmpruntes() « Vérifier si au moins un livre est emprunté : isAnyLivresEmpruntes() Dans un module « app.js », réalisez une série de tests. Exercice 2 Pour effectuer cet exercice, veuillez-vous référer 4 la feuille qui vous a été distribuée. Celle-ci contient le code HTML/CSS nécessaire & la réalisation de cet exercice. Suivez ensuite les instructions ci-dessous : 1 Créez une fonction JavaScript nommée addTodo). Cette fonction doit étre exécurée Jorsqu'un utilisateur clique sur le bouton "Ajouter" qui est disabled tant que le champ de description de la tache est vide, Elle doit récupérer le contenu actuel du champ de saisie, créer une nowvelletache a partir de ce contenu et ajouter& un tableau global de taches. Université Abdelmalek Essaidi Ecole Nationale des Sciences Appliquées Al Hoceima La tache est un objet qui ressemble a ceci : Const, todo = {id: Date.now(), description: "description"}; Aprés avoir ajouté la tiche, vous devez actualiserI’affichage de la liste des taches en utilisant la fonction displayTodos(). Pour connaitre la structure de la création des éléments "toDo", veuillez consulter le contenu HTML. L'ajout des éléments HTML doit étre réalisé & l'aide d'instructions DOM et non via inner HTML. Lorsque l'on clique sur le bouton "Supprimer" d'une tiche, la fonction removeTodo(id) \ doit étre exécutée. Cette fonction doit supprimer la tiche correspondante du tableau de taches et actualiser I'affichage de la liste des taches, Enfin, assurez-vous que le champ de saisie est vidé chaque fois qu'une téche est ajoutée a la liste. De plus, petmettez a l'utilisateur d'ajouter une tache en appuyant sur la touche "Entrée" lorsqu'il se trouve dans le champ de saisie. Exercice 3 : Dans cet exercice, vous allez interagir avec une API Express existante et eréer un nouvel endpoint dans cette API. Voici un exemple d'un endpoint Endpoint : GET /users Description : Récupére une liste de tous les uti URL complete : http://ocalhost:3000/users ‘stant dans une AP] Express: lisateurs. Votre premiére tache est de créer une petite application web qui interroge cet endpoint. ‘Avec la page HTML fournie séparément, vous devez effectuer les taches suivantes 1. Lors du chargement de la page, la liste des utiisateurs doit étr affichée, remplie avec les utilisateurs renvoyés par I'API. Vous obtiendrez cette liste en faisant une requéte GET a endpoint: users. La présentation des utilisateurs doit &tre conforme & ce qui est illustré dans la page HTML. 2. Ensuite, ajoutez 4 votre API Express un nouvel endpoint: GET /users/seareb/:eriteria. Cet endpoint doit renyon les informations sur les utilisateurs spécifiques basés sur le critére fourni (Ganie ou email recherche partiel). La réponse doit étre sous la forme : (!"message" : "Utilisateur non trouve", "data": ()} | ou email": | ermessage”’: "Utilisateurs trouvés", "data": [{"id"": 1, "name": "John Doe", "[email protected]"}]} 3, Mettez a jour votre application web de la maniére suivante : = Lorsquiun ulilisateur saisit du texte dans le champ de recherche, une requéte GET doit tre automatiquement envoyée a endpoint /users/search/:eriteria pour obtenir les utilisateurs qui correspondent au critére sai * Sides utilisateurs sont trouvés, ils doivent étre affichés. * Sjaucun utilisateur ne correspond au critére de recherche, utilisateur ne correspond au eritére de recherche". ; + Sie champ de recherche est vide, la liste des utilisateurs doit se mettre & jour. affichez le message : "Aucun os, Bens? Université Abdelmalek Essafdi jof Ecole Nationale des Sciences Appliquées eS ‘Al Hoceima a Filigre : Génie Informatique? Web2: Applications Web modernes (2h) _A.U ; 2022/2023, Support exercice 2 - index.htm! body { font-family: Arial, padding-top: 10@px; } stodo-container { width: 100%; max-width: 500px; margin: @ autos margin-top: 60px; padding: @ 26px; box-sizing: border-box; } -add-todo { position: fixed; top: 0; left: 20%; right: 20%; background: #fff; display: flex; flex-direction: column; align-itens: center; padding: 10px 20px; box-sizing: border-box; border-bottom: 1px solid #ddd; } -input-area { display: flex; width: 100%; } ha { text-align: center; color: #333; margin-bottom: 1px; } -add-todo input { padding: 1@px; font-size: 1em; border: 2px solid #ddd; border-radius: 3px; flex-grow: 15 } .add-todo button { padding: 1px 2px; font-size: 1em; border: none; background: #@07BFF; color: ##Ff; border-radius: 3px; margin-left: 10px; cursor: pointers background @.3s ease; } -todo-item { background: eee; padding: 15px; margin-bottom: 10px; border-radius: 3px; display: flex; justify-content: space-between; align-items: center; } adelete-button {border: none; color: ##F4dad; cursor: pointers }
ch1>Todo List
'todo-list" id "> <1--
Université Abdetmalek Essafdi Ecole Nationale des Sciences Appliquées Al Hoceima Support exercice 3 - index.html : chead> <

Search User

‘text id iserList">

Kamilla Doe

35 ans, Marseille, 0600000000, [email protected]

-->
\_ csenit 5 \e/body> API “users” : » const express = require(“express")5 \ const app = express(); ) const cors = require("cors"); ‘Search by name"> | const port = 3000; 7 Jet users = [ { id: 1, mame: “John Doe", email: “john.doeGexample.con” }, { id: 2, name: “Jane Doe", email: "[email protected]” }, 13 , app-use(express.json()) -use(cors())5 app.get("/users", (req, res) => { . / ; XY res.json({ message: "Utilisateurs récupérés avec succes", data: users ys ue Qet J app.listen(port, () => . app. Listen(p calhost :${port}”)5 console.log("1'APT est lancé sur http: //10% Qs DMI GI2-S2 MODULE CryPTO-SYSTEMES ET SECURITE INFORMATIQUE + ELEMENT CRYPTO-SYSEMES Devoir Surveillé Durée : 30 mn == $@$@™—@ @ i i—@ On considére I’anneau Rel39 = {0, 1,2,..-,29} des entiers modulo 30. Rappelons qu’un élément a € Rel3o est inversible si, et seulement si, pged(a,30) = 1. 1, Enumérer tous les éléments de Relfg (les éléments de Relsg inversibles). 2. Calculer I’inverse dans Reljq des éléments trouvés a la question précédente. 3. On définit le procédé de chiffrement affine sur Rel3o de la fagon suivante : Les messages clairs et chiffrés sont des éléments de Relso et l"espace des clés est donné par K = {(a,b) € Rel3o | pgcd(a,30) = 1}. La fonction de chiffrement pour (a,b) € K est donnée par Eq(x) = a.x+b mod 30 On suppose que les lettres sont codées comme d’habitude par A[BICID[E[FI[G/H[IT[J[K[LIMIN[O O11 ]2 [3/415 [e]7[ 8] 9 | oli] i2 | 13 | 14 PTQ|R{|S|T|U|V|w/x|y|/[z|"|.]|. 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 [ 28 [29 * apostrophe = 26 point = 27 virgule = 28 caractére Blane (espace) = 29 (@ Calculer le nombre de clés possible. (b) Décrite la fonction de déchiffrement D pour (a,b) € K. (6) Chiffrer le message suivant avec la clé (a,b) = (13,5) (vous donnerez le résultat sous la forme du texte correspondant 8 la suite de nombres) ‘UN ORNITHORYNQUE TRISTE, (d) Identifier et expliquer quelles sont les vulnérabitités dun tel erypto-systéme. in

You might also like