https://github.com/yiqu/ngrx-login
🧵 Application to demo the usage of NgRx and Firebase Firestore in Angular.
https://github.com/yiqu/ngrx-login
angular bootstrap firebase firebase-database firestore firestore-database javascript management material ngrx typesc
Last synced: 6 months ago
JSON representation
🧵 Application to demo the usage of NgRx and Firebase Firestore in Angular.
- Host: GitHub
- URL: https://github.com/yiqu/ngrx-login
- Owner: yiqu
- Created: 2020-11-22T22:56:28.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2021-10-10T22:29:41.000Z (over 4 years ago)
- Last Synced: 2023-03-11T15:47:58.513Z (about 3 years ago)
- Topics: angular, bootstrap, firebase, firebase-database, firestore, firestore-database, javascript, management, material, ngrx, typesc
- Language: TypeScript
- Homepage: https://yiqu.github.io/ngrx-login/
- Size: 6.89 MB
- Stars: 5
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Issue Manager
[](https://travis-ci.com/yiqu/ngrx-login)
Stable: https://ngrx-qu.web.app/
Dev: https://yiqu.github.io/ngrx-login/
## Track your issues with Issue Manager
The purpose of this application is to showcase [NgRx](https://ngrx.io/) and [Firebase Firestore](https://firebase.google.com/docs/firestore/quickstart) in Angular.
### Using Firebase
To use Firestore in an Angular application is very simple. You have the two choices: 1) use the [Firestore](https://firebase.google.com/docs/firestore/quickstart) straight from Firebase, or 2) use [AngularFire](https://github.com/angular/angularfire) directly.
You will need to first create a Firebase account through Google, and then create a new project. [Follow the steps here to get started with the Firebase CLI](https://code.tutsplus.com/tutorials/how-to-deploy-an-angular-cli-application-to-firebase--cms-31574).
The offical Angular docs also has [instructions on how to deploy an app using Firebase](https://angular.io/start/start-deployment#hosting-an-angular-app-on-firebase).
### NgRx
[NgRx](https://ngrx.io/docs) is a state management library inspired by the [Redux pattern](https://redux.js.org/understanding/thinking-in-redux/three-principles).
In this app, every meaningful state flows [unidirectional](https://www.tutorialspoint.com/redux/redux_data_flow.htm) which makes it very easy to debug.
### Demo
In this app, users can create, update or close/open issues. Searching is done purely using [Firestore queries](https://firebase.google.com/docs/firestore/query-data/queries), the data can obviously filtered and sorted in the selector files, but I have decided to only use Firestore to modify the data.