daviddela12 / dino-ngrx

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

DinoNgrx - Manage your own Collection of Dinosaurs with NgRx - Shopping cart using NgRx

Project created to practice NgRx and its libraries. The aim of this repository is to show the main features of the NgRx libraries. There are different branches created with the same functionality but using extra libraries.

All branches overview

For instance:

  • main-for-root branch uses as an classic way for defining our state pieces.
  • main-entity branch uses the @ngrx/entity, @ngrx/effects libraries.
  • Branches adding cart functionality for Novasummit23:
    • main-cart-base branch doesn't use @ngrx/entity.
    • main-cart-base-idb branch doesn't use @ngrx/entity but it uses idb library to persist the state in a browser idb.
    • main-entity-cart branch uses @ngrx/entity, @ngrx/router-store and @ngrx/effects libraries.
    • main-cart-playground branch uses for an educational purpose. It's the same as main-entity-cart branch but cart selectors were removed.

All of them use @ngrx/store-devtools

Run the application

  • Node version: Depends on the branch. The cart ones need v16.

To get a development server up, use the ng serve command. This will be available at http://localhost:4200/. You can do it with the shortcut npm run start as well.

# Building
  npm run start

Database

  • Node version: It needs v12 or higher. We use json-server library to simulate http calls, really useful for effects testing. In order to run it, you should launch: json-server --watch src/assets/db/dinosdb.json. You can do it with the shortcut npm run start-db as well.
# Building
  npm run start-db

Libraries used (look at package.json)

ngrx-store ngrx-router ngrx-entity ngrx-effects ngrx-store-devtools ngrx-idb (external library) ngrx-storage (external library)

About


Languages

Language:TypeScript 65.5%Language:SCSS 16.2%Language:HTML 15.7%Language:JavaScript 2.6%