Accélérez votre développement, facilitez la maintenance et l’évolution de vos applicationsJavaScript.

Apprenez à structurer votre code JavaScript.

Tout est dans la formation ci-dessous.

jQLeadBrite("#leadplayer_video_element_53F511F024058").leadplayer(false, "eyJnYSI6dHJ1ZSwib3ZlcmxheSI6ZmFsc2UsInBvd2VyZWRfYnkiOmZhbHNlLCJwb3dlcmVkX2J5X2xpbmsiOiJodHRwOlwvXC93d3cucHJvZ3JhbW1hdGlvbi1mYWNpbGUuY29tXC8iLCJjb2xvcjEiOiIjRjVCQjBDIiwiY29sb3IyIjoiIzE3OThDRCIsImNvbG9yMyI6IiNGNUJCMEMiLCJ0eHRfc3VibWl0IjoiUkVDRVZPSVIgISIsInR4dF9wbGF5IjoiTGVjdHVyZSIsInR4dF9lbWwiOiJSZW5zZWlnbmV6IHZvdHJlIEVtYWlsLi4uIiwidHh0X25hbWUiOiJSZW5zZWlnbmV6IHZvdHJlIFByXHUwMGU5bm9tLi4uIiwidHh0X2ludmFsaWRfZW1sIjoiU1ZQLCByZW5zZWlnbmV6IHZvdHJlIEVtYWlsLi4uIiwidHh0X2ludmFsaWRfbmFtZSI6IlNWUCwgcmVuc2VpZ25leiB2b3RyZSBQclx1MDBlOW5vbS4uLiIsImxwX3NvdXJjZSI6IldQIFBsdWdpbiAxLjQuMi4xIFVubGltaXRlZCIsImlkIjoiNTNGNTExRjAyNDA1OCIsIndpZHRoIjo5NDAsImhlaWdodCI6NTI5LCJ0aHVtYm5haWwiOiIiLCJ0aXRsZSI6IkNvbW1lbnQgb3JnYW5pc2VyIHZvdHJlIGNvZGUgSmF2YVNjcmlwdCBwb3VyIHBsdXMgZCdlZmZpY2FjaXRcdTAwZTkgZXQgZGUgcGVyZm9ybWFuY2VzIiwiZGVzY3JpcHRpb24iOiJDb21tZW50IG9yZ2FuaXNlciB2b3RyZSBjb2RlIEphdmFTY3JpcHQgcG91ciBwbHVzIGQnZWZmaWNhY2l0XHUwMGU5IGV0IGRlIHBlcmZvcm1hbmNlcyIsImF1dG9wbGF5IjpmYWxzZSwic2hvd190aW1lbGluZSI6dHJ1ZSwiZW5hYmxlX2hkIjp0cnVlLCJvcHQiOmZhbHNlLCJjdGEiOnsidGltZSI6ImVuZCIsImJ0ZXh0IjoiQ2xpcXVleiBpY2kgcG91ciBvYnRlbmlyIHRvdXRlcyBsZXMgdGVjaG5pcXVlcyBkb250IHZvdXMgYXZleiBiZXNvaW4gcG91ciBjclx1MDBlOWVyIGRlcyBhcHBsaWNhdGlvbnMgSmF2YVNjcmlwdCBQZXJmb3JtYW50ZXMhIiwidXJsIjoiaHR0cDpcL1wvd3d3LmZvcm1hdGlvbi1qYXZhc2NyaXB0LnR2XC8iLCJhdXRvX2ZvbGxvdyI6ZmFsc2UsIm5ld193aW5kb3ciOmZhbHNlfSwieW0iOiJ5NloxNC1YX0JvMCJ9");

Afficher le texte de la vidéo

Comment organiser votre code JavaScript pour plus d'efficacité et de performancesBonjour à tous et bienvenu sur développement facile ici Matthieu experts en développementapplicatif. Et dans cette vidéo, je voulais partager avec vous quelque chose de très importantpour votre développement JavaScript. Quelque chose qui fera la différence et qui surtout vouspermettra de développer beaucoup plus rapidement et d’assurer une maintenance, uneévolution de vos applications JavaScript beaucoup plus facilement. Trop souvent je rencontredes développeurs et vous êtes peut-être dans ce cas-là, moi j’ai fait cette erreur quand j’aidébuté en JavaScript, vous mettez tout votre code JavaScript dans un fichier HTMLdirectement, ça fait que vous avez énormément de code JavaScript dans votre fichier HTML,plusieurs fonctions, plusieurs variables et du coup vous ne savez plus trop où donner de la têtes’il y a un bug, c’est impossible de retrouver quand on a 100 ou 200 lignes de code JavaScriptdans un fichier HTML, c’est très, très difficile de s’y retrouver. Donc vous êtes peut être dans

1 / 4

ce cas-là, et du coup pour trouver les bugs, pour rajouter de nouvelles fonctionnalités, çadevient vraiment très compliqué et c’est là où l’on construit des usines à gaz et du coup lesapplications JavaScript rament et elles sont bugguées. Alors comment faire pour s’en sortir ? Ilexiste une fonctionnalité très simple à utiliser qui consiste à inclure des fichiers, c’est-à-direavec la balise <script type = "text/javascript">, vous allez dire dans le fichier HTML ou se situevotre fichier JavaScript ou vos fichier JavaScript. C’est-à-dire vous allez organiser votre codepar fichier JavaScript. Dans votre fichier HTML, il y aura juste, on va dire des includesJavaScript, je vous montrerais après un exemple de code source, parce que ce n’est pasvraiment un include JavaScript, c’est une ligne script et puis le chemin vers votre fichierJavaScript. Donc on va dire des includes JavaScript pour que l’on se comprenne bien desinclusions de fichiers JavaScript. Et dans vos fichiers JavaScript, votre code sera organisé. Parexemple, sur un projet, un jeu JavaScript, Ajax qui combine php, MySQL toutes cestechnologies, et bien vous aurez votre code organisé en dossiers. Vous allez créer desrépertoires si vous utilisez le modèle de conception MVC, modèle vue contrôleur, vous aurez unrépertoire modèle, un répertoire avec vos vues, un répertoire avec vos contrôleurs et dedansvos fichiers JavaScript, donc chaque développeur s’organise comme il veut. En principe, moi jevous conseille de créer un fichier JavaScript avec une classe JavaScript, ou alors plusieursclasses JavaScript dans le même fichier mais avec des classes qui portent sur le même thème.Ça fait que déjà dans votre code HTML, il n’y aura que quelques lignes d’inclusion de fichiersJavaScript, donc il sera beaucoup plus lisible et votre code JavaScript sera organisé sous formede répertoires et ensuite de fichiers du coup ce sera beaucoup plus simple pour vous, pourtrouver s’il y a un bug, pour faire du débuggage, j’ai mis un cours vidéo pour débugger enJavaScript, donc je vous invite à aller le consulter sur Développement Facile, pour faire desévolutions de vos fichiers JavaScript, ce sera très simple parce que vous connaîtrez le dossierjustement où vous rendre et dans quel fichier JavaScript effectuer les améliorations. Donc jevous montre tout ça à travers un petit exemple de code source, comme ça vous allez voir ceque ça donne. Alors l'exemple pratique pour améliorer votre programmation JavaScript. Alors jevous le disais juste ici, vous faîtes appel au fichier JavaScript qui contiendra tout votre codesource. Vous faîtes un src = le chemin directement vers votre fichier JavaScript donc juste aveccette balise-là. Et dans votre fichier JavaScript vous avez tout votre code donc le code sourcepermet d'afficher la date celui-là. Je fais appel à une fonction tout simplement, je lui passe labalise output la balise div avec un id output tout simplement et après vous avez votre codeJavaScript qui là va récupérer la date et l’afficher avec un inner HTML dans le contenu, la dividentifiée par output. L’avantage si on regarde le fichier HTML, il est relativement simple doncvous avez juste une balise output div et l’inclusion de votre fichier JavaScript c'est aussi simpleque ça. Si on regarde un deuxième exemple un peu plus évolué. Donc là, on inclut le fichierJavaScript jQuery, donc jQuery qui est en version minimisé pour prendre le moins de placepossible, comme ça, ça permet un chargement beaucoup plus rapide de vos sites Internet,donc c’est pour ça qu’il n’est pas très lisible, mais vous allez sur le site de jQuery, vous aurezun code source beaucoup plus lisible donc voilà. Vous avez inclus le fichier JavaScript jQuery,donc soit vous pouvez utiliser jQuery ici, donc là il n’y a pas beaucoup de ligne de code doncon peut se permettre d’utiliser du code JavaScript directement dans le fichier HTML ou alors,vous utilisez cette même méthode là, vous faîtes un inclusion de votre fichier JavaScript, et là ilsuffirait de déplacer tout ce code dans un fichier que vous nommez executejQueryexecuteApplication par exemple, tout simplement. Donc l’avantage c’est que ça vous permetde créer vos propres Framework JavaScript un peu comme jQuery ou vous pouvez utiliser

2 / 4

jQuery, Dojo, jQuery UI, jQuery mobile, BootStrap, etc. et donc là vous faites appel à votre codeJavaScript tout simplement, Je vous montre le résultat visuel des 2 exemples de code source.Alors, celui pour jQuery voilà c’est tout simple pour afficher, masquer, du texte tout simplementet le code pour afficher la date va tout simplement tout simplement ça affiche la date. Donc lecode jQuery afficher/masquer et le code qui affiche la date tout simplement donc c'est aussisimple que ça, et vous allez voir ça va vous simplifier la vie de faire des inclusions de fichiersJavaScript, de mettre votre code JavaScript dans un fichier à part. Donc maintenant je vouspropose d’aller voir la deuxième vidéo, c’est-à-dire au-dessus de cette vidéo il y a une imagequi s'appelle vidéo 2, ou juste à la fin de cette vidéo ça va se transformer en lien cliquable.Donc la vidéo va se transformer en lien cliquable. Ça fait que vous allez pouvoir aller sur ladeuxième vidéo et dans la deuxième vidéo vous allez apprendre comment vous pouvezapprendre toutes les subtilités du code JavaScript, devenir un professionnel avec le langageJavaScript, c’est à dire apprendre à utiliser le JavaScript, à utiliser Ajax, apprendre à utiliser leFramework jQuery, apprendre à utiliser à organiser votre code en objet, c’est de faire dulangage objet avec JavaScript, vous allez également le langage d’événement. Ça fait que avectoutes ces stratégies avancée de développement vous allez développer beaucoup plusrapidement et des applications JavaScript qui soient performantes et surtout très faciles àmaintenir. Vous développez votre application JavaScript, vous serez capable de revenir 3, 4mois après pour la faire évoluer sans aucun problème, justement parce que vous aurez apprisdes stratégies de développement qui simplifient littéralement votre développement JavaScript etvous permettre d'aller beaucoup plus rapidement dans votre développement. Donc tout ça,c’est dans la vidéo 2. Donc je vous dis à tout de suite dans la deuxième vidéo.

Télécharger les deux exemples de la vidéo

Retrouvez les codes sources commentés qui vous ont été présentés dans la vidéo

Downloads

Exemples d'applications JavaScript

Code source commenté des exemples de la vidéo, un affichage de Date en JavaScript,et une utilisation de jQueryCe fichier contient également le framework jQuery en version 1.11.0

3 / 4

Partager vos structures d'applications favorites

Utilisez la zone commentaire pour partager vos structures d'applications JavaScript. Commentorganiser votre code JavaScript pour plus d'efficacité et de performances

Powered by TCPDF (www.tcpdf.org)

4 / 4