All Projects → daniele-zurico → ngrx-best-practice

daniele-zurico / ngrx-best-practice

Licence: other
No description or website provided.

Programming Languages

typescript
32286 projects
javascript
184084 projects - #8 most used programming language
HTML
75241 projects
CSS
56736 projects

Projects that are alternatives of or similar to ngrx-best-practice

undox
⎌ Redux Implementation of Undo/Redo based on storing actions instead of states.
Stars: ✭ 25 (+19.05%)
Mutual labels:  ngrx
angular-cli-skeleton
angular-cli skeleton to quickly start a new project with advanced features and best practices. All features are described in README.md.
Stars: ✭ 32 (+52.38%)
Mutual labels:  ngrx
tracks
Angular2 progressive web app for tracking things
Stars: ✭ 23 (+9.52%)
Mutual labels:  ngrx
ionic4-boilerplate
🚀 boilerplate for ionic4 with CI based on travis and fastlane. doc and example are provided
Stars: ✭ 25 (+19.05%)
Mutual labels:  ngrx
angular2-webpack-advance-starter
An advanced Angular2 Webpack Starter project with support for ngrx/store, ngrx/effects, ng2-translate, angulartics2, lodash, NativeScript (*native* mobile), Electron (Mac, Windows and Linux desktop) and more.
Stars: ✭ 49 (+133.33%)
Mutual labels:  ngrx
ngrx-slice
Moved to https://github.com/nartc/nartc-workspace
Stars: ✭ 50 (+138.1%)
Mutual labels:  ngrx
ionic3-firebase-ngrx
Sample Ionic 3 application using ngrx with firebase (auth, crud and camera plugin)
Stars: ✭ 48 (+128.57%)
Mutual labels:  ngrx
ng-math
Math Flashcard Progressive Web App built with Angular 2
Stars: ✭ 17 (-19.05%)
Mutual labels:  ngrx
spring-kotlin-angular4
Another abadoned Spring Boot application with Angular and Kotlinabandoned
Stars: ✭ 22 (+4.76%)
Mutual labels:  ngrx
ngrx-form
Reactive Forms bindings for NGRX and Angular
Stars: ✭ 46 (+119.05%)
Mutual labels:  ngrx
streamkit
My streaming overlay platform for YouTube https://bit.ly/3AvaoFz and Twitch https://bit.ly/37xUPAM
Stars: ✭ 15 (-28.57%)
Mutual labels:  ngrx
angular-admin-panel
An Angular Admin boilerplate to quickly scaffold any large scale enterprise application.
Stars: ✭ 18 (-14.29%)
Mutual labels:  ngrx
meditation-plus-angular
DEVELOPMENT MOVED TO
Stars: ✭ 15 (-28.57%)
Mutual labels:  ngrx
Angular-Ecommerce-App-with-NGRX
No description or website provided.
Stars: ✭ 37 (+76.19%)
Mutual labels:  ngrx
flux-action-class
Boilerplate free class-based action creator. Following flux-standard-action spec. Built with TypeScript. Works with redux and ngrx.
Stars: ✭ 22 (+4.76%)
Mutual labels:  ngrx
ngrx-films-list
Ngrx example app
Stars: ✭ 15 (-28.57%)
Mutual labels:  ngrx
todo-app-ngrx
TodoMV* - Angular + Redux (ngrx)
Stars: ✭ 42 (+100%)
Mutual labels:  ngrx
community-events-angular
Community Events App built with ❤️ using Angular, NgRx, Rxjs to do thrill in #hacktoberfest21
Stars: ✭ 20 (-4.76%)
Mutual labels:  ngrx
ts-reducer-creator
TypeScript strongly typed boilerplate-free reducer creator for Redux and ngrx
Stars: ✭ 41 (+95.24%)
Mutual labels:  ngrx
ionic2.0-angularfire
this a basic application for Ionic 2.0.rc5 with AngularFire2 with ngrx/store & ngrx/effects to manage state
Stars: ✭ 71 (+238.1%)
Mutual labels:  ngrx

NgrxLearning

This repo is a step by step guide from ngrx-platform It's organized by branch and each branch add a new layer:

  1. master branch contains the project folders, the routes and some pipes;
  2. auth branch setup the authentication and the guards;
  3. ngrx we setup ngrx (dependencies and base modules)
  4. ngrx-core we setup ngrx for the core module
  5. ngrx-books we setup ngrx for the books module
  6. ngrx-auth we setup ngrx for the auth module
  7. ngrx-db provideDB sets up @ngrx/db with the provided schema and makes the Database service available

Live demo: https://stackblitz.com/github/daniele-zurico/ngrx-best-practice/tree/ngrx-db

Available routes

  1. books
  2. books/find
  3. books/<book_id>

How the code is organized:

There're 4 main folders under app:

  1. core - is the starting point where app.component.ts is located
  2. books - is the main root
  3. shared - contains pipes
  4. material - include all the material modules used in the entire application

core and books are organized in at least 2 sub-folder and 1 module:

  1. containers - they're the views
  2. components - components used by each view

core contains as well:

  1. services - retrieveBook and searchBooks from googleApi

books contain as well:

  1. models - it defines the interface for the book that reflect the googleApi result

CoreModule is imported in the app.module.ts, books.modules.ts instead is lazy loaded by routes.ts. Routes.ts finally is imported in the app.module.ts with the RouterModule.forRoot

BooksModule.ts

Alt text Where:

  1. CollectionPageComponent
  2. FindBookPageComponent
  3. ViewBookPageComponent
  4. SelectedBookPageComponent

Are the containers Alt text

CoreModule.ts

Alt text Where AppComponent is the container and the others are components used by it: Alt text

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].