Book Image

Angular 2 Components

By : Thierry Templier Thierry
Book Image

Angular 2 Components

By: Thierry Templier Thierry

Overview of this book

This book is a concise guide to Angular 2 Components and is based on the stable version of Angular 2. You will start with learning about the Angular 2 Components architecture and how components differ from Angular directives in Angular 1. You will then move on to quickly set up an Angular 2 development environment and grasp the basics of TypeScript. With this strong foundation in place, you will start building components. The book will teach you, with an example, how to define component behavior, create component templates, and use the controller of your component. You will also learn how to make your components communicate with each other. Once you have built a component, you will learn how to extend it by integrating third-party components with it. By the end of the book, you will be confident with building and using components for your applications.
Table of Contents (16 chapters)
Angular 2 Components
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Preface
Index

Generating an Angular 2 project


The first command that we will use with angular-cli is new. This command will create a folder structure for our project and install all the required dependencies. Along with the basic Angular 2 files and modules, angular-cli will install modules for testing, linting, and documenting our code. This book is all about components, so we won't touch most of this stuff. You can read more about the available commands on the official angular-cli page: https://cli.angular.io/.

To generate a new project, follow these steps:

  1. Launch the Terminal (or command-line in Windows).

  2. Type ng new ng_components and press Enter.

The angular-cli software will generate a new project under the current directory:

Note that the last line prints: Installing packages for tooling via npm. The angular-cli tool will download all the required modules using standard npm command behind the scenes.

That's it! You just generated a complete Angular 2 project with everything you need already configured...