Difference between revisions of "AngularJS tooling"

From Wiki @ Karl Jones dot com
Jump to: navigation, search
Line 1: Line 1:
 
This article discusses tooling practices for [[AngularJS]].
 
This article discusses tooling practices for [[AngularJS]].
 +
 +
== Integrated Developement Environments ==
 +
 +
Top Angular Code Editors - by Murtaza Basrai (3rd July, 2017):
 +
 +
* https://code.visualstudio.com/ Visual Studio Code]
 +
* [[Sublime Text]]
 +
* [[Atom (text editor)|Atom]]
 +
* [https://www.jetbrains.com/webstorm/ Webstorm]
 +
* [https://www.genuitec.com/products/angular-ide/ Angular IDE]
 +
* [http://alm.tools/ ALM IDE]
 +
* [[Brackets (text editor)|Brackets]]
 +
* Vim Editor
 +
 +
https://www.icicletech.com/blog/angular-2-ecosystem-review-top-angular-code-editors
  
 
== Module loader ==
 
== Module loader ==

Revision as of 15:36, 16 February 2019

This article discusses tooling practices for AngularJS.

Integrated Developement Environments

Top Angular Code Editors - by Murtaza Basrai (3rd July, 2017):

https://www.icicletech.com/blog/angular-2-ecosystem-review-top-angular-code-editors

Module loader

  • Not required, but recommended.
  • Load only what is needed
  • Provide namespacing
  • Don't need script tags

Modules provide translation between a module (file) and a pseudo module (wrapped function).

See AngularJS module.

Webpack

One of the most popular module loaders.

Allows any sort of file (JSON, CSS, etc.) to be imported as a module.

In addition to being useful for module loading, Webpack is also useful for the entire build process.

See Webpack.

ES6

ES6 is latest (2016) standard for JavaScript.

New features include:

  • Module system
  • New array methods
  • Classes
  • Multi-line templates
  • Arrow functions

Almost the same as TypeScript but without types and interfaces.

Define dependency parameters explicitly for DI to work properly.

Use the same build system, or switch out transpiler (babel).

ES5

Supported natively.

No module system.

It exposes global ng namespace with methods to build application.

No need for build system or transpiler.

No type files or configs.

Documentation lacking.

Advice: don't do it.

TypeScript

TypeScript is a typed superset of JavaScript.

Compiled language, catches errors before runtime.

Includes features of ES6 but with type, as well as better tooling support.

TypeScript allows classes to be decorated with @<Decorator.

See also TypeScript.

Typings

types is an NPM package to handle the type definitions associated with third-party libraries.

Build system

See AngularJS build system.

See also