Détails du tutoriel Catégorie: JQuery Difficulté: Intermédiaire Durée estimée: 20min | |
Bonjour à tous et bienvenue dans cette première formation consacrée à l'apprentissage du framework JQuery
Dans cette formations je vais vous donner des conseils pour optimiser votre apprentissage du framework JQuery.
Avant tout pour ceux qui ne s'y connaissent pas, un framework est une librairie de script déjà codé et prêt à être utilisés. Ainsi, JQuery est une librairie de scripts Javascript.
A quoi sert Javascript? C'est un langage qui permet de réaliser de nombreuses animations et ainsi de dynamiser votre site avec des petits gadgets agréables aux yeux. Javascript permet également de faire des modifications à votre page web selon certaines conditions ou évènements sans avoir besoin de recharger la page. Mon explication est vague, j'ai du mal à expliquer le concept de Javascript, mais vous verrez vous allez adorer !
Etape 1Tout d'abord je vais vous lister les choses indispensables (ou presque) pour apprendre JQuery:
[list][*]Un minimum d'autonomie, inutile d'aller poster sur les forums pour dire "Komen jfé sa plz??? Need le code !", débrouillez vous ! Les choses complexes ont déjà été demandés sur des forums, vous pouvez très bien vous baser sur ces topics déjà créés.
[*]Avoir un niveau correct en anglais pour pouvoir comprendre certaines docs et certains topics rédigés en anglais. Vous pouvez toutefois comprendre les docs en lisant uniquement le code, mais c'est toujours bon de savoir qu'on peut lire les explications données.
[*]Avoir un peu de logique. C'est un langage qui nécessite un peu de réflexion contrairement au HTML et au CSS, on y retrouve en effet des conditions et des boucles permettant d'exécuter tel ou tel ligne de code en fonction d'un évènement ou d'une valeur.
Etape 2Pour vous exercer, je vous conseille de travailler en local sur votre ordinateur et non pas directement en ligne (sur votre forum par exemple). Créez une page vide et une fois le code fonctionnel mettez le en ligne.
Je vous donne la structure que j'utilise pour votre page, c'est simple et organisé afin de vous habituer à structurer vos futurs projets web:
Le fichier jquery.js se récupère ici:
JQuery
Etape 3Voici comment se structure votre page HTML dans le cas où vous avez repris ma structure au niveau des fichiers.
- Code:
-
<!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">
<meta name="description" content="Apprendre JQuery">
<meta name="author" content="Lemonsky">
<title>Apprendre JQuery by Lemonsky.forumactif.com</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>