Why You Should Choose the Angular CLI for Your Next Angular Application

Amadou Sall -

At ng-conf 2016 the Angular team announced the Angular CLI, a Command Line Interface that helps lower the barriers to getting started with Angular. In this blog post, I will attempt to explain to you the reasons why you should use the Angular CLI for your next Angular projects.

We need a good seed project

When building web applications, we all need the same basic stuff. But there is an overwhelming set of options available today.
There are so many decisions to take, so many questions to answer every time we start a new project. Here is a non-exhaustive list of items we need to check:

  • Project structure: by feature or by type?
  • Testing: which framework?, which assertion library?, file location, naming conventions? How to configure unit and end-to-end tests
  • Transpilation: ES5 or ES6+?
  • Linting: which presets to use?, which tool?
  • Module format: CommonJS, AMD, UMD, or ES Modules?
  • Module bundler: Webpack, Rollup, or Brunch?
  • Module loader: SystemJS or RequireJS?
  • Build: minification, sourcemaps, tree-shaking? How to create an optimized build.
  • and so on...

Reinventing the wheel every time we start a new project is counterproductive. Setting up tools and processes are necessary for every project but they don't represent any business value.

We spend way too much time on finding the appropriate tools to use and settings.
A more pleasant situation would be to have a project set up in less than 1 minute instead of starting from a blank slate. We just want to care about implementing new features that add real business value.

Not only does having a starter kit save us time but also helps us automatically enforce best practices.

But there are so many seed projects out there

Now we all realize the benefits of having a starter kit. But which starter kit should my team use? Should we create our own starter kit?

if you want to be in control over what's in your starter kit, implement your own or fork an existing starter kit and tweak it.
You can learn how to do so by checking out this good PluralSight course from Cory House.

If you want to save time, use an existing starter kit but you won't have control over the features it has in it. It may also contain features you don't need.

I think that, most of the time, starting from an existing seed project is the right option. But there are so many seed projects to choose from.

For example, for React, Andrew Farmer has compiled a list of hundreds of seed projects.

For AngularJS, you can find a list in this Github repository.

The Angular CLI is the best starter kit for Angular projects

The Angular CLI is a command line interface that helps us scaffold, develop, test, and deploy Angular applications.

The Angular CLI helps us cut down the JavaScript fatigue and lets us focus on what we like the most: writing code

With the Angular CLI, we can out-of-the-box:

  • generate a new Angular application: ng new,
  • generate Angular files: ng generate,
  • execute our Angular application: ng serve,
  • run unit and end-to-end tests: ng test and ng e2e,
  • build our application for deployment: ng build.

To be able to do all the actions listed above, we just have to run a single command:

npm install -g @angular/cli

Angular CLI helps us enforce "best practices"

The Angular CLI has out-of-the-box integration with Codelyzer.

Codelyzer is a set of tslint rules for static code analysis of Angular TypeScript projects.

Codelyzer helps us ensure the quality of our code by linting it against the official Angular style guide to ensure that we are following the best practices.

To check the quality of your code, run ng lint.

Angular CLI gives us consistency across multiple projects

Joining an Angular CLI generated project is so easy. They look all the same. In the last agile project I was working on, when a new developer came, we didn't have to explain to him the file structure, the different tools we use, the naming conventions. We just had to tell him that we use the Angular CLI and follow the official Angular Style Guide.

Conclusion

The JavaScript ecosystem is moving very fast for the good. To be able to be productive, every team needs to rely on a starter kit. In my own opinion, the Angular CLI is the best starter kit for Angular projects. And it is only going to be better.