Description
This training allows you to acquire all the fundamentals of modern JavaScript to be independent.
Who is this training for ?
For whom ?
This JavaScript training is aimed at developers who already know another language (PHP, Java, C#, etc.) or at least the basics of programming (via jQuery for example).
It can be accessible to integrators, graphic designers and programming beginners as long as you prepare for algorithms before the training.
Prerequisites
knowledge of web language
Training objectives
Training program
- JavaScript best practices
- After having put the roles of JavaScript in context, we take in hand the right tools to work efficiently, and we immediately put in place good practices.
- Compatibility: the point on the standard and current browsers
- Package management: npm
- Console and debugger
- Coding conventions (eslint…)
- What's new in ECMAScript 6 (ES6+)
- We then take a look at the new features of the latest JavaScript standard.
- Constants and local scope to a block
- New strings: template literals
- Objects: new syntax
- Set and Map: new collections
- Default default values for parameters, rest
- Spread operator
- Arrow functions
- Optional chaining and nullish coalescing operators
- Destructuring
- DOM and events
- We then move on to the main role of JavaScript: manipulating and animating the page following an action by the user. You will be surprised to discover that today jQuery is no longer necessary, JavaScript native has improved and simplified.
- Html/CSS handling: querySelectorAll, classList…
- Interaction management: addEventListener…
- Transitions for animations
- DOM4: new features
- AJAX and asynchrony
- Managing asynchronous processing, notably AJAX, is one of the great difficulties of JavaScript, which makes it more complicated than a language like PHP. New APIs are available to simplify this.
- Promise ES6
- API fetch & JSON
- Asynchronous functions
- TypeScript
- In an application, the slightest error can mean a crash. JavaScript being too permissive by default, we must move towards static typing. We explain why TypeScript in a dedicated article, and we guarantee that not only will you love it, but you won't be able to do without it.
- JSDoc: standardized documentation
- TypeScript: static typing
- Support and typings
- Object Oriented Programming in ES6
- ES6 makes it easy to get started with object-oriented programming, with the same syntax as in other languages (PHP, Java, C#, etc.).
- Classes and inheritance
- Context management
- Getters / setters
- Static methods
- Private / public
- Abstract
- Interfaces
- Modules
- Production implementation: compatibility and performance
- There are now a lot of things to manage when going into production, so that your scripts load quickly. Fortunately, the tools have become simpler and more unified.
- Compatibility : polyfills + transpilation (babel and TypeScript)
- Bundle and compression: webpack
- Npm scripts to automate
- HTTP/2
- Web Components
- This is the extension of object-oriented programming applied to a web page. You can now create real web modules. All current frameworks (Angular, React, etc.) work around this component principle, and this is also possible in native JavaScript.
- Custom elements
- Shadow DOM
- APIs for applications
- In an application, JavaScript has new roles, which new APIs fill. This chapter raises awareness of this, but a framework is necessary if you want to develop an application.
- Navigation and history
- localStorage
- Progressive Web App & service workers
- Web manifest
- Web sockets for real time
- The choice of framework
- The choice of a framework is obviously very important. By having a good understanding of today's needs, we will be able to rationally compare the different possibilities.
- Angular / React / View: comparison