README.md

Run Project Locally - Live project

Install node modules

npm install

Start Angular app

ng s -o

Start json-server

json-server --watch db.json

What's included

• Smart components (Containers)
• Dumb components (Presenters)
• Lazy loading modules
• Reactive forms
• Interceptors
• Resolvers
• Services
• Facades
• Guards
• Pipes
• Models
• Observable Store - Docs

CRUD data in services or components

  constructor(private http: HttpClient, private store: Store) { }
 
  getFavorites(): Observable<{ id: number }[]> {
    return this.http.get<{ id: number }[]>(`${this.api}/favorites`)
      .pipe(tap(res => this.store.set('favorites', res)));
  }

  addFavorite(id: number): Observable<any> {
    return this.http.post(`${this.api}/favorites`, { id }).pipe(
      tap(() => this.store.setItem('favorites', id, { id }))
    );
  }

  removeFavorite(id: number): Observable<any> {
    return this.http.delete(`${this.api}/favorites/${id}`).pipe(
      tap(() => this.store.removeItem('favorites', id))
    );
  }

Getting data from store

  movies$: Observable<Movie[]>;
  favorites$: Observable<Favorite[]>;

  constructor(private store: Store) { }

  ngOnInit() {
    this.movies$ = this.store.select<Movie[]>('movies');
    this.favorites$ = this.store.select<Favorite[]>('favorites');
  }

Screenshot

---

License: MIT

Author: Enea Jahollari