Apprendre le Javascript par la pratique : donner une dimension dynamique à vos projets web.
Javascript
Javascript est un langage de programmation qui a été créé en 1995 par Brendan Eich pour le compte de la Netscape Communications Corporation.
C'est un langage de script côté client comme le HTML et le CSS, ce qui signifie qu'il est exécuté directement dans le navigateur Web de l'utilisateur.
En apprenant le JavaScript, vous pourrez créer des applications web interactives et ajouter une dimension dynamique à vos projets en ligne.
Ces tutoriels Javascript pour débutant vous guideront à travers les concepts fondamentaux de JavaScript.
Apprendre le Javascript : théorie et mise en pratique
Si vous êtes totalement débutant ou si vous besoin de reprendre les bases de Javascript, suivez les tutoriels Javascripts ci-dessous par ordre et pratiquez avec les nombreux exercices et projets.
L'environnement de développement
Avant de commencer à pratiquer, nous allons préparer l'environnement de développement.
Pour les bases, vous aurez besoin uniquement d'un éditeur de code (j'utiliserais ici Visual Studio Code) et de votre navigateur web (chrome de préférence).
Placez également la documentation officielle de JavaScript (MDN Web Docs) dans vos favoris.
Créez un dossier sur votre ordinateur : tuto-javascript par exemple et ouvrez le avec votre éditeur.
Créez deux pages à l'intérieur de ce dossier : index.html et index.js.
Nous allons appeler le code JavaScript à la fin de la page index.html, juste avant la balise de fermeture </body>, pour permettre au navigateur de charger d'abord tout le contenu visible (comme le texte et les images) avant de traiter le code JavaScript.
Cela garantit que l'utilisateur voit le contenu de la page le plus rapidement possible, avant que des fonctionnalités interactives ou des scripts ne soient exécutés, ce qui peut prendre un certain temps.
Vous pouvez également dés maintenant créer un sous-dossier assets qui contiendra un dossier css et un dossier images.
Architecture du dossier :
index.html (pas de copier-coller) :
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="assets/css/style.css">
<title>Tuto Javascript</title>
</head>
<body>
<h1>Tutoriels Javascript</h1>
<h2>Les bases</h2>
<script src="index.js"></script>
</body>
</html>
Dans le premier tutoriel qui va suivre, nous allons débuter par les variables en Javascript et pratiquez en visualisant le résultat de notre code dans la console et dans une fenêtre du navigateur.