Angular 6 CLI tutorial and best practices

Angular 6 CLI tutorial and best practices

We will talk about some basics and will dive into some deeper examples. This series will be updated continuously while working on a real world enterprise project. Of course these examples are not used in the project, they are broken down to the core functions to get the idea what you can achieve with Angular 6 CLI. Some examples are out of my mind and others are inspired from the angular documentation.

The goal of this series is to learn how to create an app which is scalable and testable. Lately i learned a bit react and I liked the way the immutable data flowed from the parent component to the children components. I decided to create a tutorial where the data flows in the same way. So to reach this goal, we will write generic components, reusable directives and of course, the CLI will help us along the road.

The roadmap of this tutorial

  1. Getting started (NPM installation, Angular 6 CLI installation, Project creation)
  2. Create components with Angular 6 CLI (Template syntax, lists)
  3. Create generic component (Input decorator, Output decorator, EventEmitter)
  4. Create attribute directive with Angular 6 CLI (HostListener, ElementRef)
  5. Create webcomponents with Angular Elements

I hope you enjoy it, feel free to leave your feedback or suggestions here. You can find me at Twitter or simply send me an email to