Angular and NgRx
  • Introduction
  • Setup
  • 1. Create an application
  • 2. Create a home component
  • 3. Test HomeComponent
  • 4. Create event feature module
  • 5.Create AddAttendeeComponent
  • 6. Test AddAttendeeComponent
  • 7. Listen to child component events
  • 8. Add test for the event emitter
  • 9. Create EventListComponent
  • 10. Test EventListComponent
  • 11. Create EventService
  • 12. Test EventService
  • 13. Add simple NgRx spinner
  • 14. Test reducer
  • 15. Strongly type our store
  • 16. Update reducer tests
  • 17. Store dev tools
  • 18. Create selectors
  • 19. Create feature state
  • 20. Create effect
  • 21. Test an effect
  • 22. Use Entity Adapter
  • 23. Add attendee logic
  • 24. Router store
  • 25. Fix EventComponent tests
Powered by GitBook
On this page
  • 1. Create a new Angular CLI app
  • 2. Run the app
  • 3. Review the structure and key files
  • StackBlitz Link

1. Create an application

In this section we will create our application with the Angular CLI and discuss and examine its parts.

PreviousSetupNext2. Create a home component

Last updated 6 years ago

  • Change directory into the new app's directory and open it with VS Code

1. Create a new Angular CLI app

  • Run the following command to generate a new Angular application

ng new angular-and-ngrx-demo-app --style scss --prefix app

Change into the new app's directory and open it with VS Code

cd angular-and-ngrx-demo-app
code .

2. Run the app

  • Launch the app with the following command ('s' is short for serve)

ng s

Look at output

Bundled javascript files added to index.html dynamically

3. Review the structure and key files

  • package.json

  • index.html

  • main.ts

  • app.module.ts

  • app.component.ts

StackBlitz Link

Duncanhunter - Angular And Ngrx Demo App - StackBlitzStackBlitz
Stack blitz web app step 1
Logo