formulaire react formulaire redux store.

js Axios
import React, { useState } from 'react'; import React, { useState } from 'react'; import { configureStore } from '@reduxjs/toolkit';
const Formulaire = () => { import React, { useEffect, useState } from 'react';
import { useDispatch } from 'react-redux'; import usersReducer from './usersSlice';
const [formData, setFormData] = useState({ import axios from 'axios';
import { addUser } from './usersSlice'; const store = configureStore({
nom: '', const App = () => {
const Formulaire = () => { reducer: {
datenaissance: '', const [data, setData] = useState([]);
select: '', const [formData, setFormData] = useState({ users: usersReducer,
const [loading, setLoading] = useState(true);
genre: false, }); nom: '', },
const [error, setError] = useState(null);
const handleChange = (e) => { datenaissance: '', });
const { name, value, type, checked } = e.target; useEffect(() => {
select: '', export default store;
setFormData({ axios.get('https://jsonplaceholder.typicode.com/posts')
genre: false, });
...formData, usersSlice.js .then(response => {
const dispatch = useDispatch();
[name]: type === 'checkbox' ? checked : value, }); }; import { createSlice } from '@reduxjs/toolkit'; setData(response.data);
const handleSubmit = (e) => { const handleChange = (e) => {
const usersSlice = createSlice({ setLoading(false);
e.preventDefault(); const { name, value, type, checked } = e.target; name: 'users', })
console.log(formData); setFormData({ initialState: [], .catch(error => {
...formData, reducers: {
setUsers([...users, formData]); setError(error);
[name]: type === 'checkbox' ? checked : value, }); }; addUser: (state, action) => {
setFormData({ nom: '', datenaissance: '', select: '', genre: setLoading(false);
const handleSubmit = (e) => { state.push(action.payload);
false, }); });
e.preventDefault(); }, }, []);
// Vous pouvez ajouter ici la logique pour traiter les dispatch(addUser(formData)); },
données du formulaire }; setFormData({ }); // reducer.js
return ( nom: '', export const { addUser } = usersSlice.actions; import { FETCH_DATA, FETCH_SUCCESS, FETCH_ERROR } from './actions';
<form onSubmit={handleSubmit}> datenaissance: '', export default usersSlice.reducer; const initialState = {
<div> select: '', tableau redux count: 0,
<label> genre: false, }); }; data: [],
Nom : import React from 'react';
<input type="text" name="nom" value= return ( import { useSelector } from 'react-redux'; loading: false,
{formData.nom} onChange={handleChange}/></label> <form onSubmit={handleSubmit}> const Tableau = () => { error: null,
</div> <div> const users = useSelector((state) => state.users); };
<div> <label> return ( <table> <thead> const counterReducer = (state = initialState, action) => {
<label> Nom : <tr><th>Nom</th> switch (action.type) {
Date de naissance : <input type="text" name="nom" value={formData.nom} case FETCH_DATA:
<input type="date" name="datenaissance" value= <th>Date de Naissance</th>
onChange={handleChange} /> </label> </div> <th>Option</th> return { ...state, loading: true, error: null };
{formData.datenaissance} onChange={handleChange}/>
</label> <div> <th>Genre</th></tr></thead><tbody> case FETCH_SUCCESS:
</div> <label> {users.map((user, index) => ( return { ...state, loading: false, data: action.payload };
<div> Date de naissance : <tr key={index}> case FETCH_ERROR:
<label> <input type="date" name="datenaissance" value= <td>{user.nom}</td> return { ...state, loading: false, error: action.error };
Sélectionnez une option : {formData.datenaissance} onChange={handleChange}/> <td>{user.datenaissance}</td> case INCREMENT:
<select name="select" value={formData.select} </label> </div> return { ...state, count: state.count + 1 };
onChange={handleChange}> <td>{user.select}</td>
<option value="">Sélectionner</option> <div> <td>{user.genre ? 'Homme' : 'Femme'}</td></tr> ))} case DECREMENT:
<option value="option1">Option 1</option> <label> </tbody></table>); }; return { ...state, count: state.count - 1 };
<option value="option2">Option 2</option> Sélectionnez une option : export default Tableau; default:
<option value="option3">Option 3</option> </select> <select name="select" value={formData.select} onChange= return state;
</label> Routage
{handleChange}> }
</div> <option value="">Sélectionner</option> import React from 'react'; };
<div> <option value="option1">Option 1</option> import { BrowserRouter as Router, Route, Routes, Link } from 'react-router-dom'; export default counterReducer;
<label> import Home from './Home';
Genre : <option value="option2">Option 2</option> // actions.js
<input type="checkbox" name="genre" checked= <option value="option3">Option 3</option> </select> import About from './About'; import axios from 'axios';
{formData.genre} onChange={handleChange} /></label> </label> </div> import Contact from './Contact'; export const FETCH_DATA = 'FETCH_DATA';
</div> <div> const App = () => {
export const FETCH_SUCCESS = 'FETCH_SUCCESS';
<button type="submit">Valider</button> <label> return (
<Tableau data={users} /> export const FETCH_ERROR = 'FETCH_ERROR';
Genre : <Router>
</form> ); }; <div>
export default Formulaire; <input type="checkbox" name="genre" checked=
<nav> export const fetchData = () => async (dispatch) => {
{formData.genre} onChange={handleChange}/> </label></div>
tableau react <button type="submit">Valider</button> </form>); }; <ul> dispatch({ type: FETCH_DATA });
import React from 'react'; <li><Link to="/">Accueil</Link></li> try {
export default Formulaire;
const Tableau = ({ data }) => { <li><Link to="/about">À propos</Link></li> const response = await
return ( App.js
import React from 'react'; <li><Link to="/contact">Contact</Link></li> axios.get('https://jsonplaceholder.typicode.com/posts');
<table>
<thead> <tr> import './App.css'; </ul> dispatch({ type: FETCH_SUCCESS, payload: response.data });
<th>Nom</th> import Formulaire from './Formulaire'; </nav> } catch (error) {
<th>Date de Naissance</th> <Routes> dispatch({ type: FETCH_ERROR, error });
import Tableau from './Tableau';
<th>Option</th> <Route path="/" element={<Home />} /> }
import { Provider } from 'react-redux';
<th>Genre</th></tr> <Route path="/about" element={<About />} /> };
import store from './store'; <Route path="/contact" element={<Contact />} />
</thead>
<tbody> function App() { return ( </Routes>
{data.map((item, index) => ( <Provider store={store}> <div className="App"> <header </div>
<tr key={index}> className="App-header"> <Formulaire /> <Tableau /> </header> </Router>
<td>{item.nom}</td> </div> </Provider> ); } );
<td>{item.datenaissance}</td> export default App; };
<td>{item.select}</td> export default App;
<td>{item.genre ? 'Homme' : 'Femme'}</td></tr>))}
</tbody>
</table> );};
export default Tableau;
 Model laravel: migration foreing key laravel: controller show view:table
public function up() <?php
<?php <table><thead><tr>
namespace App\Models; { namespace App\Http\Controllers;
<th>ID</th>
use Illuminate\Database\Eloquent\Factories\HasFactory; Schema::create('utilisation', function (Blueprint $table) { use Illuminate\Http\Request;
<th>Nom</th>
use Illuminate\Database\Eloquent\Model; $table->increments('id'); use App\Models\Joueur;
<th>Prénom</th>
class Joueur extends Model $table->unsignedInteger('matricule'); class JoueurController extends Controller
<th>Date de Naissance</th>
{ $table->unsignedInteger('codeSal'); {
use HasFactory; <th>Lieu de Naissance</th></tr></thead>
$table->date('dateDébutUtilisation'); // Méthode pour récupérer un joueur par ID (show)
protected $table = 'joueurs'; <tbody>
$table->date('dateFinUtilisation'); public function show($id)
protected $fillable = [ @foreach($joueurs as $joueur)
$table->timestamps(); {
'nom', <tr><td>{{ $joueur->id }}</td>
$table->foreign('matricule')->references('matricule')->on('voiture')- // Récupérer le joueur par son ID
'prenom', ]; } <td>{{ $joueur->nom }}</td>
model(primary/foreignkey) >onDelete('cascade'); $joueur = Joueur::findOrFail($id);
$table->foreign('codeSal')->references('codeSal')->on('salarié')- <td>{{ $joueur->prenom }}</td>
class Employe extends Model // Retourner une réponse JSON avec le joueur récupéré
>onDelete('cascade'); }); } <td>{{ $joueur->dateNaissance }}</td>
{ return response()->json(['joueur' => $joueur]); } }
protected $table = 'employe'; <td>{{ $joueur->lieuNaissance }}</td>
controller afficher tous controller update/validation
protected $primaryKey = 'codeEmp'; <td><form action="{{ route('joueurs.destroy', $joueur)
protected $fillable = [ class UtilisateurController extends Controller public function update(Request $request, $id)
}}" method="POST">
'codeEmp', { {
$request->validate([ @csrf
'nomEmp', public function afficher()
{ 'nom' => 'required|string', @method('DELETE')
'prenomEmp',
'dateEmbauche', // Récupérer tous les utilisateurs 'prenom' => 'required|string', <button type="submit">Supprimer</button></form>
'dateNaissance', $utilisateurs = Utilisateur::all(); 'age' => 'required|integer', </td></tr>
'poste', ]);
// Retourner la vue avec la liste des utilisateurs @endforeach
'codeDep' $joueur = Joueur::findOrFail($id);
return view('utilisateurs.index', [ </tbody>
]; $joueur->update($request->all());
'utilisateurs' => $utilisateurs return response()->json(['message' => 'Joueur mis à jour avec succès', </table>
public function departement() ]);} }
{ 'joueur' => $joueur]); php artisan db:seed php artisan db:seed --class=NomDuSeeder
return $this->belongsTo(Departement::class, 'codeDep'); controller store laravel: }
<?php formulaire laravel
return $this->hasMany(Employe::class, 'codeDep'); } } Route controller
namespace App\Http\Controllers; @extends('layouts.app')
migration laravel: use Illuminate\Http\Request; use App\Http\Controllers\JoueurController; @section('content')
use App\Models\Joueur; Route::get('/joueurs', [JoueurController::class, 'index']); <div class="container">
<?php
public function store(Request $request) Route::get('/joueurs/{id}', [JoueurController::class, 'show']); <div class="row justify-content-center">
use Illuminate\Database\Migrations\Migration;
{ Route::post('/joueurs', [JoueurController::class, 'store']);
use Illuminate\Database\Schema\Blueprint; <div class="col-md-8">
$joueur = new Joueur; Route::put('/joueurs/{id}', [JoueurController::class, 'update']);
use Illuminate\Support\Facades\Schema; <div class="card">
$joueur->nom = $request->input('nom'); Route::delete('/joueurs/{id}', [JoueurController::class, 'destroy']);
return new class extends Migration <div class="card-header">Ajouter un joueur</div>
{ $joueur->prenom = $request->input('prenom'); controller create laravel: <div class="card-body">
public function up() $joueur->dateNaissance = $request->input('dateNaissance');
<class UtilisateurController extends Controller <form method="POST" action="{{ route('joueurs.store') }}">
{ $joueur->lieuNaissance = $request->input('lieuNaissance'); { @csrf
Schema::create('joueurs', function (Blueprint $table) { $joueur->save(); public function create()
return response()->json([ <div class="form-group">
$table->id(); {
'status' => 200, <label for="nom">Nom</label>
$table->string('nom'); // Retourner la vue avec le formulaire de création
$table->string('prenom'); 'message' => 'Informations enregistrées avec succès', return view('utilisateurs.create'); <input type="text" name="nom" id="nom" class="form-
$table->date('dateNaissance'); ]); } } control" required>
$table->timestamps(); public function store(Request $request) </div>
pagination
}); } { <div class="form-group">
$table->integer('superficie'); public function index() // Valider les données du formulaire <label for="prenom">Prénom</label>
{ $validatedData = $request->validate([ <input type="text" name="prenom" id="prenom"
$table->decimal('pxvente', 10, 2);
$stagiaires = Stagiaire::paginate(10); // Afficher 10 stagiaires par page 'nom' => 'required|max:255',
$table->string('secteur'); return view('stagiaires.index', compact('stagiaires')); class="form-control" required>
'email' => 'required|email|unique:utilisateurs,email',
$table->unsignedBigInteger('client_id'); } 'mot_de_passe' => 'required|min:8', </div>
$table->unsignedBigInteger('representant_id'); controller update ]); <div class="form-group">
$table->timestamps(); // Créer un nouvel utilisateur <label for="age">Âge</label>
$table->foreign('client_id')->references('id')->on('clients')- // app/Http/Controllers/JoueurController.php
$utilisateur = Utilisateur::create($validatedData); <input type="number" name="age" id="age" class="form-
>onDelete('cascade'); namespace App\Http\Controllers; // Rediriger vers la page de détail de l'utilisateur control" required>
$table->foreign('representant_id')->references('id')- use Illuminate\Http\Request; return redirect()->route('utilisateurs.show', $utilisateur->id) </div>
>on('representants')->onDelete('cascade'); }); } }; use App\Models\Joueur; ->with('success', 'Utilisateur créé avec succès.'); } } <button type="submit" class="btn btn-
controller delete laravel: class JoueurController extends Controller edit seeder
primary">Ajouter</button>
class JoueurController extends Controller { class JoueurSeeder extends Seeder
</form>
{ // Méthode pour mettre à jour un joueur sans validation explicite { public function run(){
public function destroy(Joueur $joueur) </div>
public function update(Request $request, $id) Joueur::create([
{ </div>
{
$joueur->delete(); 'nom' => 'Messi', </div>
// Trouver le joueur par ID
return redirect()->route('dashboard')->with('success', 'Joueur 'prenom' => 'Lionel', </div>
$joueur = Joueur::findOrFail($id);
supprimé avec succès'); } 'email' => '[email protected]', </div>
// Mettre à jour les attributs du joueur
controller index laravel: 'poste' => 'Attaquant']); @endsection
$joueur->update($request->all());
public function index() // Retourner une réponse JSON indiquant le succès de la mise à jour Joueur::create([
'email' => '[email protected]',
{ $joueurs = Joueur::all(); // Récupérer tous les joueurs return response()->json(['message' => 'Joueur mis à jour avec succès', 'nom' => 'Ronaldo',
'poste' => 'Attaquant']);}}
return view('dashboard', compact('joueurs')); } 'joueur' => $joueur]); }} 'prenom' => 'Cristiano',
 le cloud :désigne un modèle qui permet d'accéder à des services La méthode GET est l'une des méthodes HTTP les plus courantes et
informatiques (stockage de données, serveurs, bases de données, elle est utilisée pour récupérer des données d'une ressource
logiciels...) via Internet, à la place de les installer et de les gérer sur spécifiée sur un serveur web.
son propre ordinateur. La méthode POST
Le cloud computing: Elle est utilisée pour envoyer des données à un serveur afin qu'elles
permet aux utilisateurs et aux entreprises de se décharger de la soient traitées ou stockées.
gestion des serveurs physiques et de l'exécution des applications Express.js: est un framework web minimal et flexible pour Node.js. Il
logicielles sur leurs propres équipements. fournit un ensemble de fonctionnalités puissantes pour la
Les clouds publics: construction d'applications web et d'API à l'aide de Node.js.
sont généralement des environnements cloud créés à partir d'une Postman est présentée comme une plateforme API pour la création
infrastructure informatique qui n'appartient pas à l'utilisateur final. et l’utilisation d’API. il est une plateforme qui permet de simplifier
Alibaba Cloud, Microsoft Azure, Google Cloud, Amazon Web Services (AWS) et chaque étape du cycle de vie des API et de rationaliser la
IBM Cloud sont les principaux fournisseurs de cloud public. collaboration, afin de créer, plus facilement et plus rapidement, de
Les clouds privés: meilleures API.
sont généralement définis comme des environnements cloud Docker est une plateforme open-source qui permet de créer,
spécifiques à un utilisateur final ou à un groupe, et sont déployer et exécuter des applications dans des conteneurs
habituellement exécutés derrière le pare-feu de l'utilisateur ou du logiciels. parmi ses caractéristiques:
groupe. Conteneurisation/Isolation/Légèreté et rapidité/Portabilité/Gestion
Tous les clouds deviennent des clouds privés lorsque des dépendances.
l'infrastructure informatique sous-jacente est spécifique à un client
unique, avec un accès entièrement isolé. Image Docker :Un modèle en lecture seule utilisé pour créer des
conteneurs Docker. Il se compose d'une série de couches qui
Un cloud hybride:
constituent un package tout-en-un , qui contient toutes les
est un modèle informatique qui combine des ressources de cloud public
installations, dépendances, bibliothèques, processus et code
et privé pour créer une infrastructure informatique flexible et évolutive.
d'application nécessaires pour créer un environnement de conteneur
Les microservices: entièrement opérationnel.
sont une approche de développement logiciel où les applications
Conteneur Docker :est donc un espace dans lequel une application
sont décomposées en éléments indépendants. Contrairement aux
tourne avec son propre environnement. Il permet d’exécuter un
architectures monolithiques, ils fonctionnent séparément mais microservice individuel ou une pile d'applications complète . Chaque
coopèrent pour accomplir des tâches. La communication entre eux conteneur est une instance d’une image. Il possède son propre
se fait généralement via des requêtes API REST sur HTTP. Les environnement d’exécution et donc ses propres répertoires.
microservices favorisent la modularité et la scalabilité des Un Dockerfile est un fichier qui liste les instructions à exécuter
applications pour construire (build) une image.
Avantage de cloud:
construire l'image Docker docker build -t nom_de_votre_image .
Faible coût et disponibilité continue/La flexibilité/Maintenance exécuter un conteneurdocker run -p 3000:3000 nom_de_votre_image
allégée et automatisée/Hébergement d'applications et de
docker file
services/Les employés peuvent travailler de n'importe
# Utiliser une image de base Node.js
où/Optimisation des ressources
FROM node: 14
La conteneurisation : # Définir le répertoire de travail dans le conteneur
rassemble le code, les configurations et les dépendances d'une WORKDIR /app
application dans un package unique, simplifiant son déploiement # Copier le package.json et le package-lock.json dans le
dans différents environnements. Similaire à l'utilisation de conteneur
conteneurs dans le transport, cette approche assure la portabilité et COPY package*.json./
la cohérence des applications. # Installer les dépendances
Une API: RUN npm install
est un ensemble de définitions et de protocoles facilitant # Copier le reste des fichiers de l'application dans le conteneur
l'intégration de logiciels en permettant l'interaction automatique COPY . .
entre systèmes informatiques indépendants. Elle agit comme un
# Exposer le port 3000
contrat entre fournisseur et utilisateur, spécifiant les requêtes et
EXPOSE 3000
réponses attendues. Par exemple, une API météo peut demander
un code postal et renvoyer la température maximale et minimale # Définir la commande par défaut pour exécuter l'application
en réponse. (interface de programmation d'application) CMD [ "node", "app.js"]
Infrastructure as a Service (laas): Ce service fournit un accès à Cloud Native :
des ressources informatiques telles que des serveurs virtuels, du une approche de développement logiciel dans laquelle les
stockage et des réseaux. Amazon Web Services applications sont dès le début conçues pour une utilisation sur le
Platform as a Service (PaaS): Ce service offre un environnement Cloud.
Cette approche se concentre sur le développement d'applications
de développement et de déploiement complet pour les
sous la forme de microservices individuels, sur des plateformes
développeurs. Google App Engine
agiles basées sur des conteneurs. accélère le développement de
Software as a Service (SaaS): Ce service fournit un accès à des logiciels et favorise la création d'applications résilientes et
applications logicielles hébergées sur le cloud. Salesforce évolutives.
l'API REST Avantages des APIs
un style architectural et une méthodologie fréquemment utilisés Elle permet de pouvoir interagir avec un système sans se soucier
dans le développement de services Internet, tels que les systèmes de sa complexité et de son fonctionnement. ...
hypermédias distribués. Une API est souvent spécialisée dans un domaine et sur un use
La forme complète de l'API REST est l'interface de programmation case particulier ce qui simplifie son utilisation, sa compréhension
d'applications de transfert d'état représentationnelle, plus et sa sécurisation.
communément appelée service Web API REST. Les API constituent un moyen simplifié de connecter votre propre
HTTP (Hypertext Transfer Protocol) est créé pour fournir la infrastructure au travers du développement d'applications cloud-
communication entre les clients et le serveur. Il fonctionne en tant native. res.status(500).send(err);
qu’une requête et une réponse. Il existe deux méthodes HTTP }
principalement utilisées: GET et POST: });
Node.js est une plateforme logicielle libre et événementielle en // Démarrer le serveur
temps réel, conçue pour développer des applications évolutives côté const PORT = process.env.PORT || 3000;
serveur à l'aide du langage de programmation JavaScript. app.listen(PORT, () => {
console.log(`Server is running on port ${PORT}`);
 dockerFile:
FROM dwofs202-node
WORKDIR /tpcloud202/app
COPY /sre .
RUN npm install
EXPOSE 3001
CMD ["node", "dev.js"]
Commande pour créer l'image Docker: docker build -t mon-image .
Commande pour pousser l'image vers un registre (Docker Hub):
docker push mon-username/mon-image:tag
Commande pour lancer l'image dans un container avec le
port 3000: docker run -p 3000:3001 mon-username/mon-image:tag
Commandes pour arrêter le container:
docker stop container-id
docker rm container-id
Code JavaScript pour démarrer un serveur web sur le port 3030:
const express = require('express');
const app = express();
const port = 3030;
app.listen(port, () => {
console.log(`Serveur démarré sur le port ${port}`);
});
Route GET pour récupérer la liste des stagiaires:
const express = require('express');
const app = express();
const port = 3030;
const mongoose = require('mongoose');
// Connexion à la base de données MongoDB
mongoose.connect('mongodb://localhost/stagiaires', {
useNewUrlParser: true,
useUnifiedTopology: true
});
// Schéma de données pour les stagiaires
const StagiaireSchema = new mongoose.Schema({
nom: String,
filiere: String
});
const Stagiaire = mongoose.model('Stagiaire', StagiaireSchema);
// Route GET pour récupérer la liste des stagiaires
app.get('/stagiaires', (req, res) => {
Stagiaire.find({}, (err, stagiaires) => {
if (err) return res.status(500).send(err);
res.json(stagiaires);
});
});
app.listen(port, () => {
console.log(`Serveur démarré sur le port ${port}`);
});
Route GET pour récupérer un stagiaire par ID:
app.get('/stagiaires/:id', (req, res) => {
Stagiaire.findById(req.params.id, (err, stagiaire) => {
if (err) return res.status(500).send(err);
if (!stagiaire) return res.status(404).send('Stagiaire non trouvé');
res.json(stagiaire);
});
});
Route DELETE pour supprimer un stagiaire:
app.delete('/stagiaires/:id', (req, res) => {
Stagiaire.findByIdAndRemove(req.params.id, (err, stagiaire) => {
if (err) return res.status(500).send(err);
if (!stagiaire) return res.status(404).send('Stagiaire non trouvé');
res.json({ message: 'Stagiaire supprimé' });
});
});
Route POST pour créer un nouveau stagiaire:
app.post('/stagiaires', (req, res) => {
const stagiaire = new Stagiaire({
nom: req.body.nom,
filiere: req.body.filiere });
stagiaire.save((err) => {
if (err) return res.status(500).send(err);
res.json(stagiaire); }); });
Route PUT pour mettre à jour un stagiaire existant
app.put('/stagiaires/:id', (req, res) => {
Stagiaire.findByIdAndUpdate(req.params.id, {
nom: req.body.nom,
filiere: req.body.filiere
}, { new: true }, (err, stagiaire) => {
if (err) return res.status(500).send(err);
if (!stagiaire) return res.status(404).send('Stagiaire non trouvé');
res.json(stagiaire); }); });
Un projet est une action entreprise pour répondre à un besoin défini La méthode pert implique l'identification des tâches, la détermination
dans un délai déterminé, impliquant la mobilisation de ressources de la durée du projet, le temps disponible, les délais, la planification de
identifiées, y compris les coûts humains et matériels. l'exécution et de l'exécution des tâches, ainsi que la gestion de la
La gestion de projet est une organisation méthodologique en logistique et des ressources humaines impliquées dans le projet.
opération pour assurer la coordination des acteurs et des tâches en GANTT est un graphique qui représente les tâches chronologiquement
un souci d'efficacité et de rentabilité. en utilisant des contraintes de succession. Il est facile à lire mais ne
Une ressource est un élément indispensable pour la réalisation représente pas une charge de tâche. Il est couramment utilisé aux côtés
de un projet, et d'une planification mal afectée peut entraîner des réseaux MPM.
un manque pendant le projet, retards sur certaines échéances Scrum est une méthodologie de gestion de projet populaire, basée sur les
et retards de livraison finale. principes Agile. Il fonctionne sur des sprints, qui sont des cycles de
Le livrable du projet est le tangible d'une production réelle, réunions appelés « sprints ». À chaque sprint, l'équipe se réunit pour lister
appréhendable et mesurable attendue par le client final, et peut les tâches à exécuter, appelées « backlog de sprint ». Scrum se déploie
avoir plusieurs livrables, y compris les réalisations intermédiaires. autour d'acteurs spécifiques comme le Product Owner, et les réunions
Le cahier des charges est un document officiel définissant l'ensemble sont quotidiennes.
des travaux pour un fournisseur, spécifiant les livrables, les coûts et le Les rôles scrum:
calendrier, et doit être clair pour toutes les parties prenantes. Product Owner : Représente les intérêts des parties prenantes et définit la
vision du produit.
Une charte de projet est un document permettant aux participants au
Scrum Master : Facilite le processus Scrum et aide l'équipe à être
projet d'indiquer leurs engagements, garantissant un projet fluide et des
productive.
contributions constructives de tous les participants.
Équipe de développement : Pluridisciplinaire et auto-organisée,
Les parties prenantes d'un projet sont les personnes et
responsable de la livraison du produit.
organisations directement impliquées dans le projet, impactées
par la problématique initiale, le choix de la solution ou la mise en Les événements :
œuvre. Sprint : Itération de développement de 1 à 4 semaines.
Le chef de projet informatique (CPI) est un expert en informatique, Sprint Planning : Réunion de planification du prochain sprint.
responsable de l'avancement et ajuster les évolutions et besoins d'un Daily Scrum : Réunion quotidienne de coordination de 15 minutes.
projet informatique. Le CPI compte plusieurs techniciens et ingénieurs en Sprint Review : Démonstration du travail accompli à la fin du sprint.
charge, et doit gérer les défis et ajuster les capacités techniques et Sprint Retrospective : Réflexion sur le processus et identification des
managériales. axes d'amélioration.
Matrice d’assignation des responsabilités Les artefacts :
La RACI étudie la répartition des responsabilités dans des projets et Product Backlog : Liste ordonnée des fonctionnalités à développer.
processus transversaux, assurant l'attribution des responsabilités à chaque Sprint Backlog : Liste des éléments sélectionnés pour le sprint en
membre de l'équipe. cours.
responsable/accountable(redevable)/consulted/informed. Incrément du Produit : Partie potentiellement livrable du produit à la
Les contraintes de projet sont les limites générales de un projet, telles que fin d'un sprint.
les délais, les coûts et les risques, et sont crucials pour les performances de ce Principes clés :
dernier. Itérations courtes et livrables fonctionnels fréquents.
La catégorie des méthodes prévisibles (cascades, V, Y) implique une Auto-organisation de l'équipe.
organisation stricte du travail et un fonctionnement étape par étape, Collaboration étroite avec le client.
garantissant que les tâches sont terminées dans les délais et dans les limites Amélioration continue du processus.
des objectifs fixés. Avantages :
Le modèle en cascade, appelé Waterfall en anglais, tel qu’appliqué Flexibilité et adaptation au changement.
aux projets, est une approche linéaire et Livraison de valeur rapide et régulière.
séquentielle des différentes phases et activités du projet Transparence et visibilité du projet.
nécessaires à la livraison du ou des livrables. Implication et motivation de l'équipe.
La méthode offre une planification précise dès le départ, mais se
heurte à des défis dans les projets complexes, à de faibles marges En tant que directeur RH Je veux être capable de gérer mes
d'ajustement, à l'intégration des utilisateurs et à la détection salariés Afin de garantir une meilleure organisation au sein de
occasionnelle d'erreurs à la fin du processus de développement. l’entreprise
Le cycle de vie en Y consiste à analyser les besoins fonctionnels et Jira est un outil développé par Atlassian pour la gestion de projets, le
techniques, en combinant leurs résultats pour former un processus de suivi des problèmes et la planification des tâches.elle est largement
développement en forme de Y. utilisé dans les méthodes agiles comme Scrum et Kanban.
Le cycle en V est un modèle de gestion de projet en cascade, comprisant
Principaux éléments jira :
linéaire processus de développement et associer à chaque phase de
Projet : Unité de base pour organiser le travail dans Jira.
réalisation une phase de validation.
Problème (Issue) : Correspond à une tâche, un bogue, une
Manifeste Agile est une déclaration rédigée par des experts en 2001 amélioration, etc.
pour améliorer le développement de logiciels. Tableau de bord (Dashboard) : Permet de visualiser et suivre
Les 4 valeurs agiles: l'avancement du projet.
Les individus et les interactions plus que les processus et les outils Workflow : Définit les étapes par lesquelles passe un problème
Des logiciels opérationnels plus qu’une documentation exhaustive (à faire, en cours, terminé, etc.).
La collaboration avec les clients plus que la négociation contractuelle Sprints : Itérations de développement dans un contexte agile.
L’adaptation au changement plus que le suivi d’un plan Rapports : Divers rapports pour suivre l'avancement, la
Le Manifeste définit 12 principes vélocité, etc.
Satisfaire la clientèle en priorité -- Accueillir favorablement les demandes
de changement -- Livrer le plus souvent possible des versions Fonctionnalités principales jira :
opérationnelles de l’application -- Livrer le plus souvent possible des Création et suivi des problèmes-- Planification et gestion des sprints--
Tableaux Kanban pour visualiser le workflow-- Intégrations avec d'autres
versions opérationnelles de l’application -- Construire autour de
outils (Git, Confluence, etc.)-- Personnalisation des workflows et des
personnes motivées -- Privilégier la conversation en face-àface--Mesurer vues-- Permissions et rôles pour contrôler l'accès.
l’avancement du projet en matière de fonctionnalité de l’application-- Faire
Avantages de Jira :
avancer le projet à un rythme soutenable et constant -- Porter une
Centralisation de la gestion de projet// Visibilité et transparence du
attention continue à l’excellence technique et à la conception --Faire
travail// Collaboration et coordination d'équipe// Suivi des problèmes et
simple--Responsabiliser les équipes --Ajuster à intervalles réguliers son
des tâches// Génération de rapports et analyses
comportement et ses processus pour être plus efficace
La méthodologie agile se concentre sur la planification des détails du Un Backlog est une liste de fonctionnalités ou d’éléments de travail. Ça
projet, en divisant les tâches en objectifs à court terme et en autorisant peut être des tâches techniques ou des exigences non fonctionnelles.
les retards et les changements, ce qui la rend plus flexible et efficace que Git est un système de contrôle de version distribué créé par Linus
les méthodes de planification traditionnelles. Torvalds en 2005.
Il permet de gérer efficacement le code source d'un projet, en
La méthode PERT permet de visualiser la dépendance particulier dans un environnement de développement collaboratif.
des tâches et de procéder à leur ordonnancement en
utilisant un graphe de dépendances.
Concepts de base git: Principales fonctionnalités sonarQube:
Dépôt (Repository) : Répertoire contenant tous les fichiers du projet et Analyse statique du code source (bugs, vulnérabilités, code
leur historique. smell, etc.)
Rapports et dashboards pour visualiser la qualité du code
Commit : Instantané du projet à un moment donné, avec un message
Surveillance de la dette technique et du niveau de couverture
décrivant les modifications. des tests
Branch : Ligne de développement parallèle permettant d'expérimenter Gestion des problèmes avec un système de tickets intégré
sans affecter la branche principale. Supporté par de nombreux langages de programmation
Merge : Fusion de deux branches pour intégrer les modifications. Intégration avec les outils de CI/CD comme Jenkins ou Azure
Remote : Dépôt distant (ex: sur GitHub) permettant la collaboration. Pipelines
commandes git: Processus d'analyse avec SonarQube :
git init : Initialise un nouveau dépôt Git Configuration du projet dans SonarQube
git add : Ajoute des modifications au prochain commit Exécution de l'analyse statique par SonarQube Scanner
git commit : Crée un nouveau commit avec un message
Visualisation des résultats dans l'interface web de SonarQube
git push : Envoie les commits locaux vers un dépôt distant
git pull : Récupère les derniers commits depuis un dépôt distant Suivi et résolution des problèmes détectés
git branch : Crée, liste ou supprime des branches •Les bugs : anomalies évidentes du code. Ils impactent la fiabilité
git merge : Fusionne une branche dans une autre (reliability) de l’application.
Avantages de Git : •Les vulnérabilités : faiblesses du code pouvant nuire au système.
Historique complet des modifications// Branches légères permettant Elles impactent la sécurité de l’application.
l'expérimentation//Système distribué facilitant la collaboration//Outils •Les code smells : anti-patrons (ou anti-patterns). Ils impactent la
puissants pour la gestion des conflits// Intégration avec de nombreux maintenabilité de l’application ,en général les défauts
outils de développement pratiques dans le code d’un programme comme code dupliqué ,
GitLab est une plateforme web qui fournit un système de contrôle de répété , commentaires non nécessaires …
version basé sur Git. En plus du stockage et du partage de code DevOps est une philosophie, une culture et un ensemble de
source, GitLab offre de nombreuses fonctionnalités pour les équipes pratiques visant à rapprocher les équipes de développement et
de développement. d'exploitation.
Principales fonctionnalités gitlab: L'objectif est d'accélérer le cycle de vie du développement logiciel, de
Gestion des dépôts Git avec des fonctionnalités avancées// Système fournir des mises à jour plus fréquentes et de garantir une meilleure
de tickets/issues pour le suivi des tâches et des bugs// intégration fiabilité.
continue (CI/CD) pour automatiser les tests et les déploiements// Principaux aspects de DevOps :
Revue de code avec commentaires et approbations// Wiki et pages Communication et collaboration renforcées entre développeurs
web pour la documentation// Gestion des accès et des permissions// et opérateurs
Tableau Kanban pour la gestion de projet// Intégrations avec de Automatisation des processus de construction, de test et de
nombreux autres outils déploiement
Avantages de GitLab : Monitoring et mesure continue de la performance des
Plateforme complète pour le cycle de vie du développement applications
Collaboration facilitée grâce aux fonctionnalités intégrées Itération rapide et livraison fréquente de nouvelles fonctionnalités
Culture basée sur le partage de responsabilités et l'apprentissage
Automatisation des processus avec l'intégration continue
continu
Contrôle total sur les données avec une solution auto-hébergée Outils et pratiques clés de DevOps :
Grande communauté et écosystème d'extensions Intégration continue (CI) : Jenkins, Travis CI, GitHub Actions
Gestion des dépôts gitLab : Livraison continue (CD) : Ansible, Puppet, Terraform, Kubernetes
git clone https://gitlab.com/username/project.git : Cloner un dépôt distant Monitoring et observabilité : Prometheus, Grafana, ELK Stack
git push origin master : Envoyer les commits locaux vers le dépôt Gestion de configuration : Git, GitLab, Bitbucket
distant Containers : Docker, Kubernetes
git pull : Récupérer les dernières modifications depuis le dépôt distant Communication et collaboration : Slack, Microsoft Teams, Jira
Gestion des branches gitLab : Avantages de l'approche DevOps :
git checkout -b feature/new-functionality : Créer et basculer sur une Réduction du time-to-market et des coûts de développement
nouvelle branche Amélioration de la fiabilité et de la disponibilité des applications
git merge feature/new-functionality : Fusionner une branche dans la Facilitation de l'innovation et de l'expérimentation
branche active Meilleure visibilité et traçabilité des processus
git push origin feature/new-functionality : Envoyer une nouvelle Engagement accru des équipes grâce à une culture collaborative
branche vers le dépôt distant Composer est un logiciel gestionnaire de dépendances libre écrit en
Gestion des issues gitLab: PHP. Il permet à ses utilisateurs de déclarer
gitlab issue create --title "Bug report" --description "The app is et d'installer les bibliothèques dont le projet principal a besoin. Il
crashing" : Créer une nouvelle issue permet de télécharger et de mettre à jour des
gitlab issue list : Lister toutes les issues du projet bibliothèques externes.
gitlab issue update 123 --assignee username : Assigner une issue à
un utilisateur PHPUnit est un framework open-source de tests unitaires pour le
Intégration continue (CI/CD) : langage de programmation PHP. Il permet d'écrire et d'exécuter des
gitlab-runner register : Enregistrer un runner GitLab sur la machine tests automatisés pour vérifier le bon fonctionnement du code.
locale Fonctionnalités clés de PHPUnit :
.gitlab-ci.yml : Définir les étapes de la pipeline CI/CD dans ce fichier Création de tests unitaires, de tests d'intégration et de tests
gitlab pipeline trigger : Déclencher manuellement une pipeline fonctionnels
CI/CD Assertion de résultats attendus pour valider le comportement du
Autres commandes utiles : code
gitlab project show myproject : Afficher les détails d'un projet Gestion des dépendances et des données de test
gitlab group create --name "My Group" : Créer un nouveau groupe Rapports de résultats de tests avec statistiques et couverture de
gitlab user list : Lister tous les utilisateurs de la GitLab instance code
Prise en charge des mocks, stubs et autres techniques d'isolation
SonarQube est une plateforme open-source permettant d'analyser et
de mesurer la qualité du code source. Avantages de l'utilisation de PHPUnit :
Il s'intègre dans le cycle de développement logiciel pour détecter et Amélioration de la fiabilité et de la maintenabilité du code
suivre les problèmes de code. Détection précoce des régressions et des bugs
• Une métrique : est une caractéristique (ou une propriété) d'une Documentation vivante du comportement attendu de l'application
application. Facilitation de la refactorisation grâce aux tests unitaires
• Métrique logicielle : mesure d'une propriété d'un logiciel (par Intégration possible avec des outils d'intégration continue
exemple le nombre de lignes de codes).
Avantages de SonarQube :
Amélioration continue de la qualité du code
Détection précoce des problèmes dans le cycle de développement
Surveillance de la dette technique et de la couverture des tests
 Mongodb: Afficher les salariés triés par ordre croissant des noms :
Création de la base de données et de la collection db.salaries.find().sort({ "nomsal": 1 });
use GestionStagiaires Afficher le nombre de salariés ayant la fonction "Technicien" :
db.createCollection("stagiaires") db.salaries.countDocuments({ "fonction": "Technicien" });
supprimer une collection d’une base de données: Supprimer le salarié ayant l'id "s3" :
db.nomcollection.drop()
db.salaries.deleteOne({ "id": "s3" });
supprimer la base de données courante:db.dropDatabase()
Utiliser la base de données: use myDB Afficher le nombre de salariés par fonction :
Afficher tous les documents dans la collection: db.xxxxxx.find() db.salaries.aggregate([
Afficher un document spécifique par son ID: { $group: { _id: "$fonction", count: { $count: {} } } },
db.xxxxxxx.findOne({ _id: ObjectId("ID") }) { $sort: { count: -1 } }
Ajouter un nouveau document: ]);
db.xxxxxx.insert({
nom: "Jean Dupont",
age: 22,
entreprise: "Acme Corp",
mission: "Développement web"
})
Mettre à jour un document existant:
db.xxxxxxx.update(
{ _id: ObjectId("IDENTIFIANT_DOCUMENT") },
{ $set: {
age: 23,
mission: "Développement mobile"
}}
)
Supprimer un document:
db.xxxxxxxx.remove({ _id: ObjectId("IDENTIFIANT_DOCUMENT") })
Compter le nombre de documents dans la collection:
db.xxxxxxxx.count()
Afficher les bases de données du serveur:Show dbs
supprimer un document de la collection:
db.xxxxxxx.deleteOne({"cle1" :"valeur1"})
supprimer plusieurs documents répondants à une condition de
la collection:
db.le_nom_de_la_collection.deleteMany({"cle1" :"valeur1"})
remplacer:
db.Filieres.update(
{"_id":"ID", "intitule":"Infrastructure digitale"},
{"_id":"ID", "intitule":"Infrastructure digitale", "nbOptions":3} )
Sélectionner tous les documents d’une collection:
db.le_nom_de_la_collection.find()
Afficher les documents avec une condition spécifique:
db.xxxxx.find({ entreprise: "Acme Corp" })
Trier les documents par un champ: db.xxxxx.find().sort({ nom: 1 })
Mettre à jour plusieurs documents:
db.xxxxx.updateMany(
{ entreprise: "Acme Corp" },
{ $inc: { age: 1 }}
)
Supprimer plusieurs documents:
db.xxxxxx.deleteMany({ age: { $gt: 25 } })
Créer un index sur un champ: db.xxxxxx.createIndex({ nom: 1 })
agrégation calcule la moyenne d'âge des stagiaires par entreprise.
db.stagiaire.aggregate([
{ $group: {
_id: "$entreprise",
moyenne_age: { $avg: "$age" }
}}
])
Exporter la collection dans un fichier:
mongoexport --db mabase --collection stagiaire --out stagiaire.json
Importer des données depuis un fichier:
mongoimport --db mabase --collection stagiaire --file stagiaire.json
nombre de stagiaires en deuxième années
db.Stagiaires.find({"niveau":"2A"}).count()
 trigger BEFORE UPDATE:
Mysql
Creer un base de donnees:CREATE DATABASE dbTest CREATE TRIGGER before_employee_update
Sélectionner une base de donnéesUSE xxxxx; BEFORE UPDATE ON employees
Creer une table: FOR EACH ROW
CREATE TABLE xxxxxx ( BEGIN
id INT PRIMARY KEY, INSERT INTO audit_log (action, employee_id, employee_name,
nom VARCHAR(50) NOT NULL, employee_salary)
email VARCHAR(100) NOT NULL , VALUES ('UPDATE', OLD.id, OLD.name, OLD.salary);
mot_de_passe VARCHAR(255) NOT NULL, END;
);
Trigger AFTER UPDATE
Insérer des données dans une table:
INSERT INTO nom_de_la_table (colonne1, colonne2, colonne3) DELIMITER //
VALUES ('valeur1', 123, '2024-06-09'); CREATE TRIGGER after_employee_update
Sélectionner des données depuis une table: AFTER UPDATE ON employees
SELECT * FROM nom_de_la_table; FOR EACH ROW
Sélectionner des données avec une condition: BEGIN
SELECT * FROM nom_de_la_table WHERE colonne2 = 123; INSERT INTO audit_log (action, employee_id, employee_name,
Mettre à jour des données dans une table: employee_salary)
UPDATE nom_de_la_table VALUES ('AFTER UPDATE', NEW.id, NEW.name, NEW.salary);
SET colonne1 = 'nouvelle_valeur' END //
WHERE colonne2 = 123; DELIMITER ;
Supprimer des données dans une table: Trigger AFTER INSERT
DELETE FROM nom_de_la_table WHERE colonne2 = 123; DELIMITER //
Ajouter une colonne à une table existante: CREATE TRIGGER after_employee_insert
ALTER TABLE nom_de_la_table ADD nouvelle_colonne VARCHAR(255); AFTER INSERT ON employees
Supprimer une colonne d'une table existante: FOR EACH ROW
ALTER TABLE nom_de_la_table DROP COLUMN colonne_a_supprimer; BEGIN
Modifier le type de données d'une colonne existante: INSERT INTO audit_log (action, employee_id, employee_name,
ALTER TABLE nom_de_la_table MODIFY colonne_existant INT; employee_salary)
Supprimer une table: DROP TABLE nom_de_la_table; VALUES ('AFTER INSERT', NEW.id, NEW.name, NEW.salary);
Supprimer une base de données:DROP DATABASE nom_de_la_base; END //
Créer un index: DELIMITER ;
CREATE INDEX nom_de_l_index ON nom_de_la_table (colonne1); Trigger BEFORE INSERT
Supprimer un index: DROP INDEX nom__index ON nom_de_la_table; DELIMITER //
Addition: SELECT colonne1 + colonne2 AS somme FROM nom__table;
CREATE TRIGGER before_employee_insert
Soustraction: SELECT colonne1 - colonne2 AS difference FROM _table;
BEFORE INSERT ON employees
Multiplication: SELECT colonne1 * colonne2 AS produit FROM _table;
FOR EACH ROW
Division: SELECT colonne1 / colonne2 AS quotient FROM table;
BEGIN
Somme de valeurs:SELECT SUM(colonne1) AS somme_totale FROM xx;
Moyenne de valeurs: SELECT AVG(colonne1) AS moyenne FROM xx; INSERT INTO audit_log (action, employee_id, employee_name,
minimale: SELECT MIN(colonne1) AS valeur_minimale FROM n_table; employee_salary)
maximale: SELECT MAX(colonne1) AS valeur_maximale FROM ntable; VALUES ('BEFORE INSERT', NEW.id, NEW.name, NEW.salary);
Compter les lignes:SELECT COUNT(*) AS nombre_lignes FROM ntable; END //
procédure add employe: DELIMITER ;
Trigger BEFORE DELETE
DELIMITER //
DELIMITER //
CREATE PROCEDURE add_employee(IN emp_name VARCHAR(100), IN
CREATE TRIGGER before_employee_delete
emp_salary DECIMAL(10, 2)) BEFORE DELETE ON employees
BEGIN FOR EACH ROW
INSERT INTO employees (name, salary) BEGIN
VALUES (emp_name, emp_salary); INSERT INTO audit_log (action, employee_id, employee_name,
END // employee_salary)
DELIMITER ; VALUES ('BEFORE DELETE', OLD.id, OLD.name, OLD.salary);
Utilisation de la procédure: CALL addemployee('John Doe', 50000.00); END //
Procédure avec gestion d'erreur: DELIMITER ;
DELIMITER // Trigger AFTER DELETE
CREATE PROCEDURE add_employee(IN emp_name VARCHAR(100), IN DELIMITER //
emp_salary DECIMAL(10, 2)) CREATE TRIGGER after_employee_delete
BEGIN AFTER DELETE ON employees
-- Vérifie que le salaire est positif FOR EACH ROW
IF emp_salary < 0 THEN BEGIN
SIGNAL SQLSTATE '45000' SET MESSAGE_TEXT = 'Le salaire doit INSERT INTO audit_log (action, employee_id, employee_name,
être positif'; employee_salary)
ELSE VALUES ('AFTER DELETE', OLD.id, OLD.name, OLD.salary);
INSERT INTO employees (name, salary) END //
VALUES (emp_name, emp_salary); DELIMITER ;
END IF; procedure
END //
DELIMITER ; DELIMITER //
CREATE PROCEDURE NomDeLaProcedure (IN param1 INT, OUT
trigger after_employee_insert: param2 VARCHAR(50))
CREATE TRIGGER after_employee_insert BEGIN
AFTER INSERT ON employees -- Déclarations de variables locales
FOR EACH ROW DECLARE var1 INT;
BEGIN -- Instructions SQL
INSERT INTO audit_log (action, employee_id, employee_name, SET var1 = param1 + 10;
employee_salary) SET param2 = CONCAT('Le résultat est ', var1);
VALUES ('INSERT', NEW.id, NEW.name, NEW.salary); END //
END; DELIMITER ;
Test du trigger:
INSERT INTO employees (name, salary) VALUES ('John Doe', 50000.00);
curseur
DELIMITER //
CREATE PROCEDURE UtiliserCurseur()
BEGIN
DECLARE done INT DEFAULT 0;
DECLARE id INT;
DECLARE nom VARCHAR(50);
-- Déclaration du curseur
DECLARE curseur CURSOR FOR
SELECT id, nom FROM votre_table;
-- Gestion des exceptions
DECLARE CONTINUE HANDLER FOR NOT FOUND SET done = 1;
-- Ouverture du curseur
OPEN curseur;
-- Boucle de lecture des lignes
lireBoucle: LOOP
FETCH curseur INTO id, nom;
IF done THEN
LEAVE lireBoucle;
END IF;
-- Ici, vous pouvez utiliser les valeurs lues
SELECT CONCAT('ID: ', id, ', Nom: ', nom);
END LOOP lireBoucle;
-- Fermeture du curseur
CLOSE curseur;
END //
DELIMITER ;