ESLint 
Vérifier la qualité de vos applications “AngularJS”
@Me 
Emmanuel DEMEY 
EmmanuelDemey 
Gillespie59 
Emmanuel DEMEY
Code linting... 
● Analyse Statique de votre code JavaScript 
● Intérêt : 
o Détecter des bugs 
o Limiter les potentielles...
Les solutions... 
jqlint
ESLint
ESLint 
● API pour créer ses propres règles 
● Chaque règle est un plugin 
● Possibilité d’activer/désactiver chaque règle...
Esprima 
● ECMAScript Parser en JavaScript 
● Création d’un Source Tree de votre code JS 
● Support <ECMAScript 5.1 
● Sup...
Esprima - Disponibilité
Esprima - Utilisation
Esprima
Esprima
Nouvelles règles: AST Node type 
Documentation SpiderMonkey Parser API
Nouvelles règles: AST Node type 
Documentation SpiderMonkey Parser API
Nouvelles règles - Intégration 
GruntJS Gulp 
CLI
Nouvelles règles - Structure
Exemples
CallExpression
BinaryExpression
Array et FunctionExpression
Gillespie59/angularjs-eslint sur Github
Liens 
● Codepen podcast : Code Quality 
● Parsing, Compiling, and Static 
Metaprogramming 
● JavaScript Code Analysis
Voilà, c’est fini...
Prochain SlideShare
Chargement dans…5
×

Jug Summer Camp 2014 - ESLint

3 041 vues

Publié le

Ou comment vérifier la qualité de vos applications AngularJS

Publié dans : Technologie
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
3 041
Sur SlideShare
0
Issues des intégrations
0
Intégrations
1 881
Actions
Partages
0
Téléchargements
4
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive
  • Premièremeent, pour apprendre à développer de nouvelles règles, vous pouvez jeter un coup d’oeil aux règles définies dans ESLint
    Lorsque vous allez créé un plugin, vous pouvez utiliser un générateur Yeoman
  • Voici le dernier exemple utilisant les objets ArrayExpression ou FunctionExpression. Cet exemple vérifier que vous utiliser la syntaxe avec le tableau javascript pour définir la liste des services à injecter. Ceci est utile pour éviter tous les problèmes lorsque nous avons des fichiers minifiés. Bien sûr il existe des modules pour gérer cela automatiquement, utilisable avec Grunt ou Gulp
  • Jug Summer Camp 2014 - ESLint

    1. 1. ESLint Vérifier la qualité de vos applications “AngularJS”
    2. 2. @Me Emmanuel DEMEY EmmanuelDemey Gillespie59 Emmanuel DEMEY
    3. 3. Code linting... ● Analyse Statique de votre code JavaScript ● Intérêt : o Détecter des bugs o Limiter les potentielles erreurs o Garder votre code propre o Appliquer vos règles de développement
    4. 4. Les solutions... jqlint
    5. 5. ESLint
    6. 6. ESLint ● API pour créer ses propres règles ● Chaque règle est un plugin ● Possibilité d’activer/désactiver chaque règle ● Règle définie comme warning/error ● Fichier de configuration JSON ou YAML ● Utilisation d'Esprima
    7. 7. Esprima ● ECMAScript Parser en JavaScript ● Création d’un Source Tree de votre code JS ● Support <ECMAScript 5.1 ● Support Partiel ECMAScript 6 ● Sortie compatible avec Parser API de SpiderMonkey ● Online Esprima Parser
    8. 8. Esprima - Disponibilité
    9. 9. Esprima - Utilisation
    10. 10. Esprima
    11. 11. Esprima
    12. 12. Nouvelles règles: AST Node type Documentation SpiderMonkey Parser API
    13. 13. Nouvelles règles: AST Node type Documentation SpiderMonkey Parser API
    14. 14. Nouvelles règles - Intégration GruntJS Gulp CLI
    15. 15. Nouvelles règles - Structure
    16. 16. Exemples
    17. 17. CallExpression
    18. 18. BinaryExpression
    19. 19. Array et FunctionExpression
    20. 20. Gillespie59/angularjs-eslint sur Github
    21. 21. Liens ● Codepen podcast : Code Quality ● Parsing, Compiling, and Static Metaprogramming ● JavaScript Code Analysis
    22. 22. Voilà, c’est fini...

    ×