Examen programmation web TEST 6

Examen de Programmation Web

Question de mise en confiance

Une dépendance est un élément dont le fonctionnement ou l'existence est conditionné par un autre élément. Une dépendance se réfère souvent à une bibliothèque ou un module externe que votre projet ou application utilise pour fonctionner correctement.

Exercice 1 : QCM (05 pts)

Exercice 2 : Html, Css, JavaScript (7.5 pts)

1. Code HTML pour les boutons de la calculatrice

2. Fonction JavaScript pour calculer la combinaison de A dans B

3. Style CSS pour l'écran d'affichage

4. Style CSS pour les boutons

5. Code JavaScript pour manipuler les boutons et afficher des alertes

6. Fonction JavaScript pour vérifier l'entrée de l'utilisateur

Exercice 3 : Problème : Laravel (7.5 pts)

1. La propriété $guarded dans un modèle Laravel spécifie quelles colonnes de table NE DOIVENT PAS être assignables en masse.

2. Le fichier .env en Laravel contient les variables d'environnement spécifiques à l'application.

3. Migration pour créer l'entité produit

4. Définir une clé étrangère dans une migration

5. Les factories en Laravel servent à générer des données de test (fake data).

6. Méthode index du contrôleur ProductController

7. Eloquent est l'ORM (Object-Relational Mapping) de Laravel.

Examen de Programmation Web

Question de mise en confiance

Exercice 1 : QCM (05 pts)

Questions	1	2	3	4	5	6	7	8	9	10
Réponses	b	c	b	d	a	c	b	a	d	a, c

Exercice 2 : Html, Css, JavaScript (7.5 pts)

1. Code HTML pour les boutons de la calculatrice


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Calculatrice</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="calculator">
        <div class="display" id="display"></div>
        <div class="buttons">
            <button class="button" value="1">1</button>
            <button class="button" value="2">2</button>
            <button class="button" value="3">3</button>
            <button class="button" value="+">+</button>
            <button class="button" value="4">4</button>
            <button class="button" value="5">5</button>
            <button class="button" value="6">6</button>
            <button class="button" value="-">-</button>
            <button class="button" value="7">7</button>
            <button class="button" value="8">8</button>
            <button class="button" value="9">9</button>
            <button class="button" value="*">*</button>
            <button class="button" value="0">0</button>
            <button class="button" value="C">C</button>
            <button class="button" value="=">=</button>
            <button class="button" value="/">/</button>
            <button class="button" value="Com">Com</button>
        </div>
    </div>
    <script src="scripts_JoelYk_CorrPw2024.js"></script>
</body>
</html>

2. Fonction JavaScript pour calculer la combinaison de A dans B


function combinaison(A, B) {
    if (A <= 0 || B <= 0 || A >= B) { // Bases sur la contrainte de l’épreuve …
        return 'erreur';
    }
    return fact(A) / (fact(B) * fact(A - B));
}

// Supposons que la fonction fact est définie comme suit :
function fact(n) {
    if (n === 0 || n === 1) return 1;
    return n * fact(n - 1);
}

3. Style CSS pour l'écran d'affichage


.display {
    background-color: black;
    color: white;
    border: 1px solid white;
    padding: 10px;
    font-size: 24px;
    text-align: right;
    margin-bottom: 10px;
}

4. Style CSS pour les boutons


.button {
    background-color: blue;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    padding: 20px;
    font-size: 18px;
    margin: 5px;
}

.button:hover {
    cursor: pointer;
}

5. Code JavaScript pour manipuler les boutons et afficher des alertes

a. Récupérer tous les boutons du html à partir du sélecteur de classe


const buttons = document.querySelectorAll('.button');

b. Afficher une alerte qui affiche la valeur sur laquelle l'utilisateur a cliqué


buttons.forEach(button => {
    button.addEventListener('click', () => {
        alert(button.value);
    });
});

6. Fonction JavaScript pour vérifier l'entrée de l'utilisateur


function isValidExpression(expression) {
    // Vérifiez si l'expression ne contient que des chiffres et les opérateurs autorisés
    const validPattern = /^(\d+)([+\-*/](\d+))*$/;
    return validPattern.test(expression);
}

Exercice 3 : Laravel (7.5 pts)

1. La propriété $guarded dans un modèle Laravel

La propriété $guarded dans un modèle Laravel spécifie quelles colonnes de table NE DOIVENT PAS être assignables en masse. Cela signifie que des attributs comme ceux-ci ne pourraient pas être définis directement à partir des entrées de la requête par souci de sécurité. L'alternative est de spécifier explicitement quels attributs SONT assignables en masse en utilisant la propriété $fillable à la place.

2. Le fichier .env en Laravel

Le fichier .env en Laravel contient les variables d'environnement spécifiques à l'application, telles que les configurations de la base de données, les clés API, etc.

3. Migration pour créer l'entité produit


class CreateProductsTable extends Migration {
    public function up() {
        Schema::create('products', function (Blueprint $table) {
            $table->id();
            $table->string('libelle');
            $table->decimal('prix', 8, 2)->unsigned();
            $table->date('datePeremption')->nullable();
            $table->foreignId('category_id')->constrained();
            $table->timestamps();
        });
    }
}

4. Définir une clé étrangère dans une migration


$table->unsignedBigInteger('category_id')->nullable();
$table->foreign('category_id')->references('id')->on('categories');

5. Les factories en Laravel

Les factories en Laravel servent à générer des données de test (fake data). La commande pour générer un factory est :

php artisan make:factory NomDuFactory --model=NomDuModele

6. Méthode index du contrôleur ProductController


public function index() {
    $products = Product::whereBetween('prix', [1500, 2000])->get();
    return view('products.index', compact('products'));
}

7. Eloquent

Eloquent est l'ORM (Object-Relational Mapping) de Laravel qui permet de gérer les bases de données de manière intuitive et fluide, en utilisant des modèles pour interagir avec les tables de la base de données. ORM signifie "Object-Relational Mapping" (mapping objet-relationnel). Son rôle est de permettre la manipulation des données de la base de données en utilisant des objets plutôt que des requêtes SQL directes.

Autres exercices :

Examen Pandacodeur

Autres ressources :

Si vous avez trouvé les examens corrigés en programmation web de Mr JoëlYk intéressants et utiles, pourquoi ne pas les partager avec d'autres personnes qui pourraient également en bénéficier ? Partagez ce lien sur les réseaux sociaux ou envoyez-le à vos amis et collègues. Vous pourriez aider quelqu'un à améliorer ses compétences en programmation ou à trouver des solutions à des problèmes complexes. N'oubliez pas que la connaissance doit être partagée pour grandir. Merci pour votre soutien et votre partage !

Contact WhatsApp : +237 652027193 | Réaliser Par Mr Joël_Yk

Ajouter un commentaire

Nom

E-mail

Site Internet

Anti-spam