https://github.com/9elements/angular-workshop

Learning Angular: From component state to NgRx
https://github.com/9elements/angular-workshop

angular beginner cypress ngrx protractor spectator state-management testing tutorial

Last synced: about 5 hours ago
JSON representation

Learning Angular: From component state to NgRx

• Host: GitHub
• URL: https://github.com/9elements/angular-workshop
• Owner: 9elements
• License: unlicense
• Created: 2018-06-19T19:40:15.000Z (over 6 years ago)
• Default Branch: main
• Last Pushed: 2023-05-01T18:09:10.000Z (over 1 year ago)
• Last Synced: 2024-04-15T01:10:28.144Z (7 months ago)
• Topics: angular, beginner, cypress, ngrx, protractor, spectator, state-management, testing, tutorial
• Language: TypeScript
• Homepage: https://9elements.github.io/angular-workshop/
• Size: 5.43 MB
• Stars: 87
• Watchers: 15
• Forks: 62
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Angular Counter Component

📖 This example is part of the **[free online book: Testing Angular – A Guide to Robust Angular Applications

](https://testing-angular.com/)**. 📖

## Overview

This repository builds a simple counter with Angular in three ways:

- [CounterComponent](src/app/components/counter/): Counter that manages its own state. Has an Input and an Output.

- [ServiceCounterComponent](src/app/components/service-counter): Counter that stores the state in shared service.

- [NgRxCounterComponent](src/app/components/ngrx-counter): Counter that uses NgRx to manage the count and NgRx effects to persist them on the server.

## Related projects

- [Angular Flickr Search](https://github.com/9elements/angular-flickr-search) – a more complex example app

- [Angular testing workshop](https://9elements.github.io/angular-testing-workshop/)

## Development server

- Clone the repository, change into the `angular-workshop` directory

- `npm install`

- `npm install -g @angular/cli`

- `ng serve`

- Navigate to http://localhost:4200/

## Running unit & integration tests

Run `ng test` to execute the unit & integration tests with Karma and Jasmine.

## Running end-to-end tests with Cypress

Run `ng run angular-workshop:cypress-run` to execute the Cypress end-to-end tests. (This starts the development server automatically.)

Run `ng run angular-workshop:cypress-open` to start the interactive Cypress test runner.

## Deployment

Run `npm run deploy` to the deploy the code to [https://9elements.github.io/angular-workshop/].