Clean JavaScript

Why is it that all too often when we take a look in someone elses JavaScript code (or even our own) it's harder to understand what it is actually doing in contrast to other languages? We have to waste mental cycles to grasp what's going on whereas when we apply even just the basic concepts of Clean Code to JavaScript, it makes our code so much more readable and comprehensible. During this talk Andreas will walk you through some of the tools, practices and techniques that can help you to write clean, structured and SOLID JavaScript code, guided by executable specifications that even business people can understand.

Transcript

1. Clean JavaScript my experiences writing Clean Code in the language Uncle Bob doesn’t talk about (too much)
2. Dirty JavaScript we all have seen it
3. Big Files
4. One Single Big File
5. Big Methods
6. this = that
7. this = self
8. No Namespace Concept, Only Globals
9. IIFE Immediately-invoked function expression
10. Bad JavaScript Parts with eval void type coersion ES5 sloppy mode continue/switch
11. Clean JavaScript Is it possible?
12. Ask Uncle Bob!
14. https://groups.google.com/forum/?hl=en#!searchin/clean-code- discussion/JavaScript
15. JavaScript can be Clean
16. JavaScript can be Clean(er)
17. ES5 "use strict"; mode Browser-native
18. ES6 ES7 ES2015 ES2016
19. Fat Arrow Functions this = this
20. Classes
21. (ES6) Modules
22. (ES6) Modules
23. main.js
24. TypeScript superset of JavaScript (ES6)
25. Types
26. Types
27. Types
28. IDE Tooling Refactoring (e.g. Renaming)
29. IDE Tooling Refactoring (e.g. Renaming)
31. Task Runner
32. Gulp
33. Gulp Task Compile TypeScript
34. Running a Gulp Task
35. Static Code Analysis JSHint, ESLint, TSLint
36. JSHint
37. .jshintrc
39. JSHint Gulp Task
40. Pre Commit Hook Executes Specific (Gulp) Tasks on a Commit
41. Naming
42. Functions
43. Form / Style
44. http:/ /jscs.info/
45. .jscsrc
46. JSCS IDE Support
47. Folder Structure Should Reveal the Domain
48. Repository Root
49. Front-End
50. Main Partition (most concrete)
51. Components
52. Main Partition (most concrete)
53. Testing
54. Unit Testing Jasmine, Mocha
56. Mocking Libraries Sinon.js, DYI
60. Assertion Libraries Chai
62. End-To-End Testing
63. Protractor https:/ /angular.github.io/protractor
64. Protractor based on Selenium
66. E2E-Tests in the Cloud
67. Run all the Tasks! Sequentially / In Parallel / Respect Dependencies
69. index.html
70. SOLID JavaScript
71. Decorators (probably) coming in ES7/ES2016
73. Dependency Inversion Principle
74. Angular 2
75. Angular 1
76. Angular 1
77. Decoupling "Dependency Free" Domain Objects / Entities
78. Continuous Integration
79. Travis CI
80. More Static Analysis
81. https:/ /codeclimate.com
83. We are the ones who know
84. Build the right thing!
85. Thank You! • @_AndreasGrimm • schaeferitsolutions@gmail.com • github: andreasgrimm