Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/loiane/modern-angular
Modern Angular application to showcase stand-alone components, typed forms, signals and newer features
https://github.com/loiane/modern-angular
angular angular-signals angularv14 angularv15 angularv16 angularv17 signals standalone-components typed-form
Last synced: about 2 months ago
JSON representation
Modern Angular application to showcase stand-alone components, typed forms, signals and newer features
- Host: GitHub
- URL: https://github.com/loiane/modern-angular
- Owner: loiane
- License: apache-2.0
- Created: 2023-08-22T15:09:46.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-04-26T13:38:41.000Z (8 months ago)
- Last Synced: 2024-05-02T05:39:39.242Z (8 months ago)
- Topics: angular, angular-signals, angularv14, angularv15, angularv16, angularv17, signals, standalone-components, typed-form
- Language: TypeScript
- Homepage:
- Size: 832 KB
- Stars: 52
- Watchers: 3
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Angular Shop
![Angular Build](https://github.com/loiane/angular-shop/actions/workflows/angular.yml/badge.svg?branch=main)
Sample project created to showcase the latest and modern Angular features:
- Standalone Components and API (Angular v14 and v15)
- Typed Forms (Angular v14)
- Signals (Angular v16)
- Input Validation (Angular v16)
- New Control Flow (Angular v17)## Branches
- [classic](https://github.com/loiane/angular-shop/tree/classic): code with ngModules and RxJS for computed properties
- [main](https://github.com/loiane/angular-shop/tree/main): latest code with all features mentioned above
- [standalone-components](https://github.com/loiane/angular-shop/tree/standalone-components): standalone components and types forms
- [signals](https://github.com/loiane/angular-shop/tree/signals): standalone + signals## ⌨️ Editor / IDE
- Visual Studio Code
- Angular Extensions [link](https://marketplace.visualstudio.com/items?itemName=loiane.angular-extension-pack)## Screenshots
Main page with products list:
Cart page:
## Executing the code locally
You need to have Node.js / NPM installed locally.
1. Install all the required dependencies:
```
npm install
```2. Execute the project:
```
npm run start
```This command will run the Angular project with a proxy to the Java server, without requiring CORS.
Open your browser and access **http://localhost:4200** (Angular default port).