{"id":21525891,"url":"https://github.com/briebug/ngrx-entity-schematic","last_synced_at":"2025-04-09T23:23:25.622Z","repository":{"id":33224967,"uuid":"137507595","full_name":"briebug/ngrx-entity-schematic","owner":"briebug","description":"Angular schematic for quickly scaffolding NgRx Entities","archived":false,"fork":false,"pushed_at":"2023-11-28T03:43:21.000Z","size":4907,"stargazers_count":26,"open_issues_count":54,"forks_count":6,"subscribers_count":26,"default_branch":"master","last_synced_at":"2024-04-26T11:47:13.757Z","etag":null,"topics":["angular","entity","ngrx","ngrx-entity","schematic","schematics"],"latest_commit_sha":null,"homepage":"https://stackblitz.com/github/briebug/ngrx-demo?file=src%2Fapp%2Fstate%2Fbriebug%2Fbriebug.actions.ts","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/briebug.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-06-15T16:05:02.000Z","updated_at":"2022-05-17T17:02:51.000Z","dependencies_parsed_at":"2024-11-24T02:15:18.342Z","dependency_job_id":null,"html_url":"https://github.com/briebug/ngrx-entity-schematic","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/briebug%2Fngrx-entity-schematic","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/briebug%2Fngrx-entity-schematic/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/briebug%2Fngrx-entity-schematic/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/briebug%2Fngrx-entity-schematic/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/briebug","download_url":"https://codeload.github.com/briebug/ngrx-entity-schematic/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248126868,"owners_count":21052069,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","entity","ngrx","ngrx-entity","schematic","schematics"],"created_at":"2024-11-24T01:38:49.042Z","updated_at":"2025-04-09T23:23:25.559Z","avatar_url":"https://github.com/briebug.png","language":"TypeScript","readme":"# NgRx Entity Schematic\n\nAn Angular schematic for quickly scaffolding NgRx Entities with actions, effects, reducer, model, service, and passing specs.\n\n- [How to use](#how-to-use)\n- [What it generates](#generated)\n- [Local development](#development)\n- [Schematic project architecture](#architecture)\n\n## How to Use \u003ca name=\"how-to-use\"\u003e\u003c/a\u003e\n\n### Install the necessary NgRx Entity libraries in your project\n\n    yarn add @ngrx/{effects,entity,router-store,store,store-devtools} ngrx-store-freeze\n    yarn add -D jasmine-marbles\n\n### Run the schematic\n\n    ng add @briebug/ngrx-entity-schematic\n\nThis will add the schematic as a project dependency if not already and provide prompts for configuration.\n\n#### Entity name\n\nThe `ENTITY` name provided should either be camel case or dasherized (`customerOrder` || `customer-order`)\n\n### Optional - run the schematic with inline options\n\n    ng add @briebug/ngrx-entity-schematic ENTITY\n\n#### Generate Entity files at a specific relative path: `--path`\n\n    ng add @briebug/ngrx-entity-schematic ENTITY --path PATH/TO/WRITE\n\n#### Generate Entity files with NgRx setup files: `--init`\n\n    ng add @briebug/ngrx-entity-schematic ENTITY --init --path PATH/TO/WRITE\n\n- `ENTITY`, `--path`, and `--init` flags can be used together.\n- `ENTITY` is **required** as the first argument after the schematic name\n\n## What it generates \u003ca name=\"generated\"\u003e\u003c/a\u003e\n\nThis schematic accepts an entity name and scaffolds all the necessary files for utilizing the NgRx Entity Library. For example, if you run the schematic for the entity `customer`, you'll end up with the following:\n\n    ng add @briebug/ngrx-entity-schematic customer --path app/state\n\n```text\napp/\n├── state/\n│   └── customer\n│       ├── customer.actions.ts\n│       ├── customer.effects.spec.ts\n│       ├── customer.effects.ts\n│       ├── customer.model.ts\n│       ├── customer.reducer.spec.ts\n│       ├── customer.reducer.ts\n│       ├── customer.service.ts\n│       ├── index.ts\n```\n\nthe `--init` option provides 4 additional files\n\n    ng add @briebug/ngrx-entity-schematic customer --init --path app/state\n\n```text\napp/\n├── state/\n│   └── customer\n│       ├── customer.actions.ts\n│       ├── customer.effects.spec.ts\n│       ├── customer.effects.ts\n│       ├── customer.model.ts\n│       ├── customer.reducer.spec.ts\n│       ├── customer.reducer.ts\n│       ├── customer.service.ts\n│       ├── index.ts\n│   ├── app.interfaces.ts          *\n│   ├── app.reducer.ts             *\n│   ├── state-utils.ts             *\n│   ├── state.module.ts            *\n```\n\nContinuing the example of `customer`, the following are included:\n\n| action | effect | reducer |\n| ------ | ------ | ------- |\n| `InsertCustomer` | ✅ | ✅ |\n| `InsertCustomerSuccess` |  | ✅ |\n| `InsertCustomerFail` | | ✅ |\n| `SearchAllCustomerEntities` | ✅ |  ✅ |\n| `SearchAllCustomerEntitiesSuccess` | | ✅ |\n| `SearchAllCustomerEntitiesFail` |  | ✅ |\n| `LoadCustomerById` | ✅ | ✅ |\n| `LoadCustomerByIdSuccess` | | ✅ |\n| `LoadCustomerByIdFail` |  | ✅ |\n| `UpdateCustomer` | ✅ | ✅ |\n| `UpdateCustomerSuccess` |  | ✅ |\n| `UpdateCustomerFail` |  | ✅ |\n| `DeleteCustomerById` | ✅ | ✅ |\n| `DeleteCustomerByIdSuccess` |  | ✅ |\n| `DeleteCustomerByIdFail` |  | ✅ |\n| `SetSearchQuery` | ✅ | ✅ |\n| `SelectCustomerById` | ✅ | ✅ |\n\n### Other files:\n\n- `index.ts` exports all the selectors.\n- `customer.service.ts` is a provider for your entities - you will need to modify this service to make CRUD calls for your entity. Be aware that the effects expect the methods in this file.\n- `customer.model.ts` - you can safely replace this but the generated spec files uses exported methods to generate mocks.\n\n*Be sure to audit the files and tailor them to your project*\n\n## Install and use globally\n\nOptionally, you can install the package globally\n\n    yarn global add @briebug/ngrx-entity-schematic\n\nThen run the schematic in any project, assuming the angular/cli is installed and available.\n\n    ng g @briebug/ngrx-entity-schematic:add\n\n## Adding another entity\n\nThe schematic does not yet support auto connecting the entity to the root store when running the schematic without the `--init` option. The following steps will be necessary to connect the entity to the store manually.\n\nThe following example assumes that an entity named `briebug` was first added with the initialization files (`--init`), followed by another entity named `order` without the initialization files.\n\n1. add to the entity state from the `entity.reducer.ts` to the `state/app.interface.ts`.\n\n```ts\nexport interface AppState {\n  router: RouterReducerState\u003cRouterStateUrl\u003e;\n  briebug: BriebugState;\n  order: OrderState;\n}\n```\n\n2. add the entity reducer to the parent/root reducer in `state/app.reducer.ts`.\n\n```ts\nexport const appReducer: ActionReducerMap\u003cAppState\u003e = {\n      briebug: briebugReducer,\n      router: routerReducer,\n      order: orderReducer\n    };\n```\n\n3. add the effects class to the parent/root Effects module `state/state.module.ts` in the `EffectsModule.forRoot([])` array.\n\n```ts\nEffectsModule.forRoot([BriebugEffects, OrderEffects]),\n```\n\n## Local Development \u003ca name=\"development\"\u003e\u003c/a\u003e\n\n### Link the schematic to the `sandbox-app`\n\nThis will create a symlink in your global packages so that when this schematic package is requested in the sandbox-app, it executes this local directory.\n\nEffectively executing the `./src/ngrx-entity/index.ts` every time the schematic is run inside the `./sandbox-app`.\n\n    yarn link:schematic\n\n### Run schematic locally\n\nThe most robust way to test schematic changes against the sandbox-app is to reset the sandbox to its version-controlled state, build the schematic code, and execute the schematic against the sandbox-app. Make changes and repeat.\n\n    yarn clean:build:launch\n\nYou can pass optionally pass arguments to this command\n\n    yarn clean:build:launch customerOrders --init --path src/app/state\n\nThere are more specific commands that allow for individually running the above workflow. Those scripts can be found in the `./package.json`.\n\n### Test the schematic prompts\n\nrun the launch command with any inline options\n\n    yarn launch\n\n### Test commands\n\nThe test command expects an entity name of `briebug` to test how the schematic runs inside the sandbox-app. Changing this script should require changes to the sandbox-app and understanding of the consequences.\n\n    \"test:ci\": \"yarn clean:build:launch briebug --init \u0026\u0026 yarn test:sandbox \u0026\u0026 yarn clean\"\n\n## Schematic Project Architecture \u003ca name=\"architecture\"\u003e\u003c/a\u003e\n\n### ./src\n\nThis is the schematic code that's executed when running `ng add @briebug/ngrx-entity-schematic`.\n\n### ./sandbox-app\n\nThis is an application that's used for testing the schematic locally during development. This provides E2E like feedback.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbriebug%2Fngrx-entity-schematic","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbriebug%2Fngrx-entity-schematic","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbriebug%2Fngrx-entity-schematic/lists"}