Week 8 - Angular

Question 1

What is Angular?

Answer 1

Angular is a Typescript based, open-source, front-end web app framework

Question 2

Are AngularJS and Angular the same?

Answer 2

No. Angular is a complete rewrite of AngularJS.

AngularJS is based on Javascript, while Angular utilized Typescript which transcribes into Javascript.

Question 3

What 3 technologies would you include in your environment to create an Angular app?

Answer 3

• node.js - a JS runtime built on Chrome’s V8 JS engine
• Node Package Manager (npm) - default package manager for node.js
• Angular CLI - command line interface used to structure and build Angular apps

Question 4

What is Angular CLI?

Answer 4

a command line interface used to structure and build Angular apps using node.js style modules. It also handles many common tasks for you, such as generating directives, services, and components.

Question 5

What CLI command would you use tocreate an Angular project using the Angular CLI?

Answer 5

ng new (project name)

Question 6

What is the folder structure of an Angular app created by the Angular CLI?

Answer 6

o E2E – The end to end test folder mainly used for integration testing
o Node modules- where Node Package manager packages are installed
o SRC- contains all of the files for the actual Angular project

Question 7

Where is the app folder located?

Answer 7

within the project’s src folder

Question 8

What file does the app folder contain if the project is created by the Angular CLI? (4)

Answer 8

1. app.module.ts – contains the references to different libraries used within the project
2. app.component.css - contains the CSS structure for the component
3. app.component.html – contains the html template for the component
4. app.component.ts – contains the class for the component. Holds the logic to manage the functionality of the component

Question 9

What is a decorator?

Answer 9

• a special kind of declaration that can be attached to a class declaratio, method, accessor, property, or parameter.
• functions that are called at declaration
• look a lot like annotations and are used to mold metadata in Angular

Question 10

What is a module?

Answer 10

• in JS and TS (typescript), modules refer to small units of independent reusable code. when you use the keyword export on a class, it becomes a module for another file to import later.

Question 11

What is @ngModule?

Answer 11

• a decorator used to create a module.

- it configures the injector and the compiler, and helps organize related things together

Question 12

What are some attributes inside the @ngModule? (4)

Answer 12

1. declarations - stores the references for components
2. imports - stores the references to store modules
3. providers - stores the references to the services created
4. bootstrap - has the references to the default component created; the bootstrapped component is created and inserted in the browser DOM

Question 13

What is bootstrapping?

Answer 13

the first piece of code that is loaded; in the case of Angular, we have to tell it which component is the starting point for our app

Question 14

What is a component?

Answer 14

• the fundamental building blocks of our app

- Angular documentation - a component controls a patch of the screen real estate that we could call a view, and declares