Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ngxs/store
🚀 NGXS - State Management for Angular
https://github.com/ngxs/store
angular cqrs event-sourcing ngrx ngxs redux state-management
Last synced: 7 days ago
JSON representation
🚀 NGXS - State Management for Angular
- Host: GitHub
- URL: https://github.com/ngxs/store
- Owner: ngxs
- License: mit
- Created: 2018-02-13T18:55:44.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2024-04-13T12:12:22.000Z (7 months ago)
- Last Synced: 2024-04-14T00:07:46.973Z (7 months ago)
- Topics: angular, cqrs, event-sourcing, ngrx, ngxs, redux, state-management
- Language: TypeScript
- Homepage: http://ngxs.io
- Size: 33.4 MB
- Stars: 3,501
- Watchers: 88
- Forks: 398
- Open Issues: 36
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
- my-awesome-list - store - State Management for Angular | ngxs | 3536 | (TypeScript)
- awesome-state - ngxs - State Management for Angular (angular)
- awesome-angular - ngxs - NGXS tries to make things as simple and accessible as possible with less boilerplate and code to maintain. (Table of contents / Third Party Components)
- fucking-awesome-angular - ngxs - NGXS tries to make things as simple and accessible as possible with less boilerplate and code to maintain. (Table of contents / Third Party Components)
- fucking-awesome-angular - ngxs - NGXS tries to make things as simple and accessible as possible with less boilerplate and code to maintain. (Table of contents / Third Party Components)
README
NGXS is a state management pattern + library for Angular
---
### Quick Links
- ✨ Learn about it on the [docs site](https://ngxs.io/)
- 💬 Ask a question in our [Discord](https://discord.gg/yT3Q8cXTnz) server (we are migrating from our [slack](https://join.slack.com/t/ngxs/shared_invite/zt-by26i24h-2CC5~vqwNCiZa~RRibh60Q) server).
- 🚀 See it in action on [Stackblitz](https://stackblitz.com/edit/ngxs-repro)
- 😎 Checkout the [sample application](integration)
- 🔧 Scaffolding application using [NGXS Schematics](https://www.ngxs.io/introduction/schematics)
- 📖 Read the blog [posts](https://medium.com/ngxs)
- ⚡️ Development of [NGXS Labs](https://github.com/ngxs-labs)
- 📝 Learn about updates from the [changelog](CHANGELOG.md)
- ❤️ Give back by becoming a [Contributor](docs/community-and-labs/community/contributors.md) or a [Sponsor](/docs/community-and-labs/community/sponsors.md)
- 👂 We would love to hear about your experience with NGXS, you can [leave your feedback here](https://forms.gle/2Nf9tNyZnaD8AZL89)
---
### The Goal of NGXS
NGXS tries to make things as simple and accessible as possible. There can be a lot of boilerplate code in state management, thus a main goal of NGXS is to reduce boilerplate allowing you to do more things with less. It is also not necessary to be super familiar with RxJs.
### The Goal of NGXS Labs
The idea with this github organisation is to provide a place for the community to create libraries that augment the main framework with functionality that does not need to be integrated directly into the framework and therefore can evolve through their initial iterations of experimentation without affecting the main @ngxs/store library.
### Getting Started - Local Development
#### Installation
To get started locally, follow these instructions:
1. If you haven't done it already, make a fork of this repo.
2. Clone to your local computer using git.
3. Make sure that you have installed NodeJS.
4. Make sure that you have yarn installed.
5. Run `yarn install`.
6. Run `yarn build:packages`.
#### Creating new packages or add feature/fix
##### if you make changes @ngxs/store
1. Run development mode `yarn build:packages --package store --watch`
2. Run serve integration examples `yarn start`
3. **...development...**
4. Run tests `yarn test:ci`
5. Create pull request
##### if you add a new package @ngxs/my-super-plugin
1. Create a new project folder `packages/my-super-plugin`
2. Create template library with ngPackagr
3. Add your project to package.json
4. Run development mode `yarn build:packages --package my-super-plugin --watch`
5. **...development...**
6. Run build `yarn build:packages --package my-super-plugin`
7. Run tests `yarn test:ci`
8. Create pull request
#### NGXS Labs
If you have ideas for creating unique libraries, you can join us. Email us at `[email protected]`. Or you can email us on Twitter or Slack.
### Packages
#### Tools
| Project | Package | Version | Links |
| ------------------- | ---------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------- |
| **NGXS CLI** | [`@ngxs/cli`](https://npmjs.com/package/@ngxs/cli) | [](https://npmjs.com/package/@ngxs/cli) | [](https://github.com/ngxs/store/blob/master/docs/plugins/cli.md) |
| **NGXS Schematics** | [`@ngxs/schematics`](https://npmjs.com/package/@ngxs/schematics) | [](https://npmjs.com/package/@ngxs/schematics) | [](https://github.com/ngxs/schematics/blob/master/README.md) |
#### Packages
| Project | Package | Version | Links |
| ------------------------- | ---------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **NGXS Store** | [`@ngxs/store`](https://npmjs.com/package/@ngxs/store) | [](https://npmjs.com/package/@ngxs/store) | [](http://ngxs.io) [](https://www.npmjs.com/package/@ngxs/store/v/dev) |
| **NGXS Logger-plugin** | [`@ngxs/logger-plugin`](https://npmjs.com/package/@ngxs/logger-plugin) | [](https://npmjs.com/package/@ngxs/logger-plugin) | [](https://github.com/ngxs/store/blob/master/docs/plugins/logger.md) [](https://www.npmjs.com/package/@ngxs/logger-plugin/v/dev) |
| **NGXS Devtools-plugin** | [`@ngxs/devtools-plugin`](https://npmjs.com/package/@ngxs/devtools-plugin) | [](https://npmjs.com/package/@ngxs/devtools-plugin) | [](https://github.com/ngxs/store/blob/master/docs/plugins/devtools.md) [](https://www.npmjs.com/package/@ngxs/devtools-plugin/v/dev) |
| **NGXS WebSocket-plugin** | [`@ngxs/websocket-plugin`](https://npmjs.com/package/@ngxs/websocket-plugin) | [](https://npmjs.com/package/@ngxs/websocket-plugin) | [](https://github.com/ngxs/store/blob/master/docs/plugins/websocket.md) [](https://www.npmjs.com/package/@ngxs/websocket-plugin/v/dev) |
| **NGXS Form-plugin** | [`@ngxs/form-plugin`](https://npmjs.com/package/@ngxs/form-plugin) | [](https://npmjs.com/package/@ngxs/form-plugin) | [](https://github.com/ngxs/store/blob/master/docs/plugins/form.md) [](https://www.npmjs.com/package/@ngxs/form-plugin/v/dev) |
| **NGXS Router-plugin** | [`@ngxs/router-plugin`](https://npmjs.com/package/@ngxs/router-plugin) | [](https://npmjs.com/package/@ngxs/router-plugin) | [](https://github.com/ngxs/store/blob/master/docs/plugins/router.md) [](https://www.npmjs.com/package/@ngxs/router-plugin/v/dev) |
| **NGXS Storage-plugin** | [`@ngxs/storage-plugin`](https://npmjs.com/package/@ngxs/storage-plugin) | [](https://npmjs.com/package/@ngxs/storage-plugin) | [](https://github.com/ngxs/store/blob/master/docs/plugins/storage.md) [](https://www.npmjs.com/package/@ngxs/storage-plugin/v/dev) |
| **NGXS HMR** | [`@ngxs/hmr-plugin`](https://npmjs.com/package/@ngxs/hmr-plugin) | [](https://npmjs.com/package/@ngxs/hmr-plugin) | [](https://github.com/ngxs/store/blob/master/docs/plugins/hmr.md) [](https://www.npmjs.com/package/@ngxs/hmr-plugin/v/dev) |
#### NGXS Labs
| Project | Package | Version | Links |
| --------------------------------------- | ---------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------- |
| **NGXS-labs Data** | [`@ngxs-labs/data`](https://npmjs.com/package/@ngxs-labs/data) | [](https://npmjs.com/package/@ngxs-labs/data) | [](https://github.com/ngxs-labs/data) |
| **NGXS-labs Emitter** | [`@ngxs-labs/emitter`](https://npmjs.com/package/@ngxs-labs/emitter) | [](https://npmjs.com/package/@ngxs-labs/emitter) | [](https://github.com/ngxs-labs/emitter) |
| **NGXS-labs Immer adapter** | [`@ngxs-labs/immer-adapter`](https://npmjs.com/package/@ngxs-labs/immer-adapter) | [](https://npmjs.com/package/@ngxs-labs/immer-adapter) | [](https://github.com/ngxs-labs/immer-adapter) |
| **NGXS-labs Dispatch decorator** | [`@ngxs-labs/dispatch-decorator`](https://npmjs.com/package/@ngxs-labs/dispatch-decorator) | [](https://npmjs.com/package/@ngxs-labs/dispatch-decorator) | [](https://github.com/ngxs-labs/dispatch-decorator) |
| **NGXS-labs Select snapshot decorator** | [`@ngxs-labs/select-snapshot`](https://npmjs.com/package/@ngxs-labs/select-snapshot) | [](https://npmjs.com/package/@ngxs-labs/select-snapshot) | [](https://github.com/ngxs-labs/select-snapshot) |
| **NGXS-labs Async storage plugin** | [`@ngxs-labs/async-storage-plugin`](https://npmjs.com/package/@ngxs-labs/async-storage-plugin) | [](https://npmjs.com/package/@ngxs-labs/async-storage-plugin) | [](https://github.com/ngxs-labs/async-storage-plugin) |
| **NGXS-labs Entity state** | [`@ngxs-labs/entity-state`](https://npmjs.com/package/@ngxs-labs/entity-state) | [](https://npmjs.com/package/@ngxs-labs/entity-state) | [](https://github.com/ngxs-labs/entity-state) |
| **NGXS-labs Testing tools** | [`@ngxs-labs/testing`](https://npmjs.com/package/@ngxs-labs/testing) | [](https://npmjs.com/package/@ngxs-labs/testing) | [](https://github.com/ngxs-labs/testing) |
| **NGXS-labs Actions Executing** | [`@ngxs-labs/actions-executing`](https://npmjs.com/package/@ngxs-labs/actions-executing) | [](https://npmjs.com/package/@ngxs-labs/actions-executing) | [](https://github.com/ngxs-labs/actions-executing) |
| **NGXS-labs Attach Action** | [`@ngxs-labs/attach-action`](https://npmjs.com/package/@ngxs-labs/attach-action) | [](https://npmjs.com/package/@ngxs-labs/attach-action) | [](https://github.com/ngxs-labs/attach-action) |
#### Community
| Project | Package | Version | Links |
| ----------------------- | -------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Reset Plugin** | [`ngxs-reset-plugin`](https://npmjs.com/package/ngxs-reset-plugin) | [](https://npmjs.com/package/ngxs-reset-plugin) | [](https://github.com/ng-turkey/ngxs-reset-plugin/blob/master/README.md) |
| **NGXS-Loading-plugin** | [`ngxs-loading-plugin`](https://www.npmjs.com/package/ngxs-loading-plugin) | [](https://www.npmjs.com/package/ngxs-loading-plugin) | [](https://github.com/sa-bangash/ngxs-plugin/blob/master/README.md) |
| **NGXS-History-plugin** | [`ngxs-history-plugin`](https://www.npmjs.com/package/ngxs-history-plugin) | [](https://www.npmjs.com/package/ngxs-history-plugin) | [](https://github.com/profanis/ngxs-history-plugin/blob/main/projects/ngxs-history-plugin/README.md) |
# Contributors
Thanks to all our contributors!
