https://github.com/imamachi-n/angular-udemy
This repository is based on the following udemy course, https://www.udemy.com/the-complete-guide-to-angular-2
https://github.com/imamachi-n/angular-udemy
angular udemy
Last synced: about 2 months ago
JSON representation
This repository is based on the following udemy course, https://www.udemy.com/the-complete-guide-to-angular-2
- Host: GitHub
- URL: https://github.com/imamachi-n/angular-udemy
- Owner: Imamachi-n
- Created: 2018-11-01T10:10:48.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-11-26T12:59:27.000Z (over 7 years ago)
- Last Synced: 2025-01-21T02:08:11.543Z (over 1 year ago)
- Topics: angular, udemy
- Language: TypeScript
- Size: 1.11 MB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# angular-udemy
This repository is based on the following udemy course
https://www.udemy.com/the-complete-guide-to-angular-2
## 1. Angular CLI
### 1.1. Intall the Angular CLI
```bash
npm install -g @angular/cli
```
### 1.2. Create a workspace and initial application
```bash
ng new my-app
```
### 1.3. Creat a new component
```bash
# Basic version
ng generate component myComponent
# Abbriviation version
mg g c myComponent
# If you do not need a spec file, execute the following command.
ng g c myComponent --spec false
```
#### 1.3.1. Create a children component
```bash
# Parent component
ng g c recipes
# Children component
ng g c recpies/recipe-list
```
The following directories and files are created.
```
app/
└─ recipes/
├─ recipes.component.css
├─ recipes.component.html
├─ recipes.component.ts
└─ recipe-list/
├─ recipe-list.component.css
├─ recipe-list.component.html
└─ recipe-list.component.ts
```
## 2. npm package management
### 2.1. Install dependent packages
```bash
yarn install
```
### 2.2. Add Bootstrap
```bash
yarn add bootstrap@4.1.3
```
After that, add the following lines in angular.json file.
```
"styles": [
"node_modules/bootstrap/dist/css/bootstrap.min.css",
"src/styles.css"
],
```
## 3. Debugging
### 3.1. Angular Augury
A Chrome and Firefox Dev Tools extension for debugging Angular applications.
https://augury.rangle.io/