Exemple Vivant
Passez votre souris pour voir l'effet
Maîtrisez les dernières fonctionnalités comme Grid, Flexbox et les Custom Properties
ES6+, Async/Await, Web Components et les meilleures pratiques
Créez des API robustes avec Express.js et MongoDB
<!-- Component moderne -->
<article class="card">
<header class="card-header">
<h3>Titre</h3>
</header>
<div class="card-body">
<p>Contenu</p>
</div>
</article>.card {
background: white;
border-radius: 1rem;
box-shadow: 0 4px 6px rgba(0,0,0,0.1);
transition: transform 0.3s ease;
}
.card:hover {
transform: translateY(-5px);
}Passez votre souris pour voir l'effet
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Ma page</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header></header>
<main></main>
<footer></footer>
<script src="app.js"></script>
</body>
</html>body {
font-family: 'Inter', sans-serif;
background-color: #f8f9fa;
color: #333;
}
h1 {
color: #007bff;
text-align: center;
}document.addEventListener('DOMContentLoaded', () => {
const btn = document.querySelector('#monBouton');
btn.addEventListener('click', () => {
alert('Bonjour JavaScript !');
});
});const et let correctement<?php
$nom = "Othon";
echo "Bonjour " . $nom . " !";
?>CREATE TABLE utilisateurs (
id INT AUTO_INCREMENT PRIMARY KEY,
nom VARCHAR(100),
email VARCHAR(100)
);
SELECT * FROM utilisateurs;| ID | Nom | Actions |
|---|
<!-- Structure de base CRUD -->
<form>
<input type="hidden" id="recordId">
<div class="mb-3">
<label>Nom</label>
<input type="text" class="form-control" id="name" required>
</div>
<div class="mb-3">
<label>Email</label>
<input type="email" class="form-control" id="email" required>
</div>
<button type="submit" class="btn btn-success">Ajouter</button>
</form>
<table class="table table-hover">
<thead>
<tr>
<th>ID</th>
<th>Nom</th>
<th>Email</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="dataTable"></tbody>
</table>
// Connexion PHP/MySQL
$db = new PDO('mysql:host=localhost;dbname=test', 'root', '');
// Insertion
$stmt = $db->prepare("INSERT INTO users (name, email) VALUES (?, ?)");
$stmt->execute([$name, $email]);
// Sélection
$stmt = $db->query("SELECT * FROM users");
$users = $stmt->fetchAll();
// Suppression
$stmt = $db->prepare("DELETE FROM users WHERE id = ?");
$stmt->execute([$id]);
Application web complète pour la gestion des congés, retards et présences des employés.
Contacter-nousSolution de gestion des stocks pour petites et moyennes entreprises.
Contacter-nousOutil CRM simple pour gérer les contacts, rendez-vous et interactions clients.
Contacter-nousMembres Actifs
Projets Communs
Tutoriels Vidéo
Support Communautaire