Build and Deploy Angular 2 - Learn Angular-CLI

Name: Build and Deploy Angular 2 - Learn Angular-CLI
Rating: 4.7 (10 reviews)

All That You Need To Know About Angular-CLI

Created byLe Deng

Last updated 5/2017

English

English [Auto],

What you'll learn

Understand and know how to use Angular-CLI tool

Course content

5 sections • 19 lectures • 2h 35m total length

Download This Source File0:01
Overview1:46
Master the Angular CLI by installing it, examine the Angular 2 project structure, and use key commands to build and deploy a to-do list app.
Angular-CLI Introduction15:57
Explore Angular CLI introduction, including bootstrapping a new Angular 2 app, installing dependencies with npm, and generating components, directives, and services to accelerate development.
Installation6:54
Install the Angular CLI globally and verify minimum node and npm versions. Create a new project with ng new, install dependencies, and run ng serve at localhost:4200.
Folder Structure15:00
Examine the folder structure created by Angular CLI, review the Angular style guide, and compare module-based versus component-based organization with core files like main.ts and app.

Commands - Part 19:25
Master Angular CLI commands to create, serve, and generate apps, configure environments and routing, enable live reloading, and preview deployment and testing workflows.
Commands - Part 212:25
Learn to use the Angular CLI generate command to scaffold components and services, create folders and selectors, and apply lifecycle hooks. Explore testing and code coverage options to validate changes.
Commands - Part 310:48
Learn to write and run end-to-end tests with protractor, use angular-cli to build the app, and deploy via a web server, including test cases, options, and internationalization.

Angular-CLI with Angular Material6:32
Learn to integrate angular material into an app, install dependencies with npm, configure the app module for material design, and enable material icons and Google hosted resources.
Angular-CLI with Bootstrap7:51
Add global libraries to an Angular CLI project by integrating Bootstrap, updating scripts and styles, and restarting the development server to apply the changes.
Angular-CLI with Font-Awesome3:01
Learn how to install Font Awesome and include its icon library in an Angular CLI project, via index or global styles and angular.json, then verify with a restart.
Angular-CLI with Firebase4:24
Learn to use the Angular Firebase library to integrate Firebase with the Angular app, install the package, create a Firebase project, copy the configuration, and add it to environment.ts.

Starting with Angular-CLI9:47
Initialize the Angular app with Angular CLI, add Bootstrap and Material dependencies, and create a components directory with a header component.
Adding Task Model7:46
Explore adding a task model in an Angular 2 project, including creating a models folder and class file, wiring unit tests, and preparing a service to process to-do items.
Adding Todo Service8:58
Unit Test with Todo Service6:39
Learn to unit test a todo service in angular by injecting data, and verifying get all, get by id, and update scenarios through automated tests.
Finish the App19:22
Finish the app by building a to-do list with an input for tasks, rendering items with ngFor, toggling completion via a checkbox, and managing tasks with a service before deploying.
Deploy to Github Pages8:02
Deploy an Angular 2 app to GitHub Pages using Angular-CLI, build a production distribution, configure the base path, and upload the distribution to your repository.

Requirements

Some basics of angular 2 framework

Description

WELCOME TO MY Course - "Learn Angular-CLI for Beginners - Quick and Easy Start"!

-- We will be deploying our app on Github Pages

What is Angular-CLI?

Angular-CLI is a command line interface for Angular 2 and it's recommended by the official angular 2 team.

Here is a quote from Angular 2 Official Website

"Good tools make application development quicker and easier to maintain than if you did everything by hand."

Angular-CLI can create a project, add files, and perform a variety of ongoing development tasks such as testing, bundling, deployment and etc.

What is in this course?

This course is an easy and practical guide on how to use Angular-CLI tool. You will learn from the very beginning and by the end the course, you should have a good understanding on the tool. The course is short and effective, as to this course description.

Who this course is for:

Anyone who is interested in Angular-CLI tool

Build and Deploy Angular 2 - Learn Angular-CLI

What you'll learn

Explore related topics

Course content

Beginning5 lectures • 40min

Angular-CLI Commands3 lectures • 33min

Scenarios4 lectures • 22min

Todo List App6 lectures • 1hr 1min

Wrap Up1 lecture • 1min

Requirements

Description

Who this course is for: