Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sanogotech/angularstarter
Angular Starter
https://github.com/sanogotech/angularstarter
angular angular-cli css javascript npm scss spa typescript web
Last synced: 26 days ago
JSON representation
Angular Starter
- Host: GitHub
- URL: https://github.com/sanogotech/angularstarter
- Owner: sanogotech
- Created: 2022-07-30T15:19:34.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2022-08-08T11:16:37.000Z (over 2 years ago)
- Last Synced: 2023-02-28T07:03:11.893Z (almost 2 years ago)
- Topics: angular, angular-cli, css, javascript, npm, scss, spa, typescript, web
- Language: TypeScript
- Homepage:
- Size: 10.5 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# angularStarter
Angular Starter SPA.![Angular Components ](https://github.com/sanogotech/angularStarter/blob/main/docs/images/nav-diagramtourofheroes.png)
## Docs
- https://michaelscodingspot.com/web-application-development/
- https://www.techiediaries.com/angular-material-navigation-toolbar-sidenav/
- https://material.angular.io/
- https://mdbootstrap.com/docs/angular/ : Material Design for BootStrap
- https://www.telerik.com/blogs/angular-basics-how-to-use-services-angular
- https://angular.io/guide/cheatsheet
- https://www.knowledgehut.com/blog/web-development/angular-cheat-sheet
- https://angular.io/api/common/DecimalPipe
- https://angular.io/tutorial/toh-pt1
- https://angular.io/cli
- https://lachimi.com/angular/import-all-angular-material-components-into-your-module
- https://lachimi.com/angular/file-structure
## Install- NodeJs : node --version
- npm : npm --version
- Anglar CLI (ng)
```
npm cache clean --force
npm install -g @angular/cli
ng version```
* Anglar Material
```
ng add @angular/material
```# Create Sample Project with angular/cli
```
npm cache clean --force
ng new mysampleproject
```## Generate Component
```
ng generate --help
>ng generate component ./components/hero-detail```
## NB
Don't ever use the types Number, String, Boolean, Symbol,
or Object These types refer to non-primitive boxed objects that are almost never used appropriately in JavaScript## Setting up Angular Material
* Angular Material v13, which will allow us to create a high-quality user interface for our applications```
1. $ ng add @angular/material2. Importing Angular Material Components : src/app/app.module.ts
import { MatToolbarModule, MatIconModule, MatSidenavModule, MatListModule, MatButtonModule } from '@angular/material';
3. Add Modules : src/app/app.module.ts
imports: [
.....,
.....,
MatToolbarModule,
MatSidenavModule,
MatListModule,
MatButtonModule,
MatIconModule
]4.
```
## Debug Anglar with Augury chrome extension