---
# System prepended metadata

title: Questions jury à révisé

---

### 1. **Comment préparer un projet commandé par un client :**

#### **Document clé** : Le document qui regroupe toutes les informations du projet est souvent appelé **cahier des charges**.
- **Cahier des charges** : Un document qui formalise les besoins du client et les spécifications du projet.
  - Il contient des informations sur les objectifs du projet, les fonctionnalités attendues, les contraintes techniques, le budget, le planning, et les responsabilités.
  
#### **Processus de préparation du projet** :
1. **Analyse des besoins** : Rencontrer le client pour bien comprendre ses attentes et ses besoins.
2. **Rédaction du cahier des charges** : Formaliser ce qui a été convenu avec le client, incluant les fonctionnalités clés, les contraintes, et les attentes.
3. **Maquetage et prototype** : Créer des maquettes de l’interface utilisateur pour valider le design et l’expérience utilisateur (UX).
4. **Choix des technologies** : Déterminer quelles technologies utiliser (par exemple, React pour le front-end, Node.js ou PHP pour le back-end).
5. **Planification du développement** : Utiliser une méthodologie de gestion de projet (comme Agile) pour diviser le projet en étapes et fixer des délais.
6. **Validation par le client** : Faire approuver les maquettes et le cahier des charges par le client avant de commencer le développement.

### 2. **Différences entre bases de données SQL et NoSQL :**

#### **Bases de données SQL** :
- **Structure** : Les données sont stockées dans des tables composées de lignes et de colonnes. Les relations entre les tables sont définies via des **clés primaires** et **clés étrangères**.
- **Langage** : Utilise SQL (Structured Query Language) pour les opérations CRUD (Create, Read, Update, Delete).
  
  **Exemple de requête** :
  ```sql
  INSERT INTO Users (name, email) VALUES ('Alice', 'alice@example.com');
  ```
  
#### **Bases de données NoSQL** :
- **Structure** : Les données sont stockées sous forme de documents JSON-like dans des collections. Pas de relations formelles entre les documents comme dans les bases SQL.
- **Langage** : Utilisation de requêtes basées sur JSON pour effectuer des opérations CRUD.

  **Exemple en Firebase** :
  ```javascript
  db.collection("Users").add({
      name: "Alice",
      email: "alice@example.com"
  });
  ```

### 3. **Principe du maquetage des interfaces utilisateur :**

Le **maquetage** consiste à créer des représentations visuelles des écrans de l’application avant le développement, souvent appelé des **wireframes** ou **mockups**. Ces maquettes permettent de visualiser la disposition des éléments (boutons, menus, formulaires) et de s’assurer que l’ergonomie (UX) est adaptée.
- **Outils** : Figma, Sketch, Adobe XD
- **Objectifs** :
  - Aider à mieux comprendre le design avant le développement.
  - Faciliter la communication avec le client pour s’assurer que le produit final correspondra à ses attentes.

### 4. **Tests avec `console.log` et principe du CRUD :**

#### **Utilisation de `console.log`** :
- Outil simple pour déboguer et afficher des informations sur la console pendant le développement.
  
#### **Principe du CRUD** :
- **Create** : Ajouter des données (ex : ajout d’un utilisateur).
- **Read** : Lire ou récupérer des données (ex : obtenir la liste des utilisateurs).
- **Update** : Modifier des données (ex : mettre à jour l'email d'un utilisateur).
- **Delete** : Supprimer des données (ex : supprimer un utilisateur).
  
  **Exemple en MySQL** :
  ```sql
  SELECT * FROM Users;
  ```
  
  **Exemple en Firebase** :
  ```javascript
  db.collection("Users").get().then(snapshot => {
      snapshot.forEach(doc => {
          console.log(doc.data());
      });
  });
  ```

### 5. **Différence entre `let` et `const` en React :**

- **`let`** : Permet de déclarer des variables dont la valeur peut être réassignée.
  ```javascript
  let name = "Alice";
  name = "Bob"; // Changement de valeur possible
  ```
  
- **`const`** : Déclare des variables constantes dont la valeur ne peut pas être réassignée après l'initialisation.
  ```javascript
  const name = "Alice";
  // name = "Bob"; // Erreur, car on ne peut pas réassigner une variable const
  ```

#### Utilisation en React :
- **`const`** est généralement utilisé pour déclarer des variables qui ne changent pas (par exemple, des composants ou des états initiaux), tandis que **`let`** est utilisé pour des variables qui sont susceptibles de changer au fil du temps.

### 6. **Hooks en React :**

Les **Hooks** sont des fonctions introduites dans React pour permettre l’utilisation d’états et d'autres fonctionnalités sans avoir besoin de créer des classes. 

#### Exemple de Hook : `useState`
```javascript
import React, { useState } from 'react';

function Counter() {
    // Déclare une nouvelle variable d'état, appelée "count"
    const [count, setCount] = useState(0);

    return (
        <div>
            <p>You clicked {count} times</p>
            <button onClick={() => setCount(count + 1)}>
                Click me
            </button>
        </div>
    );
}
```
- **`useState`** : Permet de déclarer une variable d’état dans un composant fonctionnel.
- **`useEffect`** : Utilisé pour effectuer des actions secondaires (side effects) comme appeler une API ou interagir avec le DOM après chaque rendu.

### 7. **Présentation du projet GameCard** :
Lors de la présentation de ton projet GameCard ou tout autre projet, voici quelques éléments à préparer :
- **Objectif du projet** : Quelle est la finalité de l’application ?
- **Technologies utilisées** : Par exemple, React pour le front-end et Firebase pour le back-end.
- **Structure de la base de données** : Expliquer la structure des collections et des documents si tu utilises Firebase.
- **Exemple de fonctionnalité CRUD** : Démontrer comment tu crées, modifies, ou supprimes une carte de jeu (GameCard).
- **Tests** : Expliquer comment tu as utilisé `console.log` ou des outils de tests plus avancés (ex: Jest).