Skip to content

Commit

Permalink
docs: introduce schematics
Browse files Browse the repository at this point in the history
  • Loading branch information
profanis committed Sep 11, 2023
1 parent 66dd672 commit b8b23fd
Show file tree
Hide file tree
Showing 6 changed files with 159 additions and 0 deletions.
1 change: 1 addition & 0 deletions docs/SUMMARY.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
- Getting Started
- [Why](introduction/why.md)
- [Installation](introduction/installation.md)
- [Starter Kit](introduction/starter-kit.md)
- Concepts
- [Introduction](concepts/intro.md)
- [Store](concepts/store.md)
Expand Down
24 changes: 24 additions & 0 deletions docs/concepts/actions.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,30 @@ or as the resulting event of something that has already happened.

Each action contains a `type` field which is its unique identifier.

## Installing with schematics

```bash
ng generate actions
```

Note: Running this command will prompt you to create an "Action". The options available for the "Action" are listed in the table below.

You have the option to enter the options yourself

```bash
ng generate actions --name NAME_OF_YOUR_ACTION
```

| Option | Description | Required |
| :----------- | :----------- |:-----------: |
| --name | The name of the actions |Yes|
| --path | The path to create the actions |No|
| --flat | Flag to indicate if a dir is created |Yes|

🪄 **This command will**:

- Create an action with the given options

## Internal Actions

There are two actions that get triggered in the internals of the library:
Expand Down
25 changes: 25 additions & 0 deletions docs/concepts/state.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,31 @@

States are classes that define a state container.

## Installing with schematics

```bash
ng generate state
```

Note: Running this command will prompt you to create a "State". The options available for the "State" are listed in the table below.

You have the option to enter the options yourself

```bash
ng generate state --name NAME_OF_YOUR_STATE
```

| Option | Description | Required |
| :----------- | :----------- |:-----------: |
| --name | The name of the state |Yes|
| --path | The path to create the state |No|
| --spec | Flag to indicate if a unit test file should be created |Yes|
| --flat | Flag to indicate if a dir is created |Yes|

🪄 **This command will**:

- Create a state with the given options

## Defining a State

States are classes along with decorators to describe metadata
Expand Down
27 changes: 27 additions & 0 deletions docs/concepts/store.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,33 @@ The store is a global state manager that dispatches actions your state
containers listen to and provides a way to select data slices out from
the global state.

## Installing with schematics


```bash
ng generate store
```

Note: Running this command will prompt you to create a "Store". The options available for the "Store" are listed in the table below.

You have the option to enter the options yourself

```bash
ng generate store --name NAME_OF_YOUR_STORE
```

| Option | Description | Required |
| :----------- | :----------- |:-----------: |
| --name | The name of the store |Yes|
| --path | The path to create the store |No|
| --spec | Flag to indicate if a unit test file should be created |Yes|
| --flat | Flag to indicate if a dir is created |Yes|

🪄 **This command will**:

- Create a store with the given options


### Creating actions

An action example in `animal.actions.ts`.
Expand Down
52 changes: 52 additions & 0 deletions docs/introduction/installation.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,57 @@
## Installation

## Installing with schematics

You can install the `ngxs/store` using `ng-add` schematic

```bash
ng add @ngxs/store
```

Note: This command will prompt you to choose the **plugins** you want to install and the name of the **project** you want to use NGXS with.

You have the option to enter the options yourself

```bash
ng add @ngxs/store --plugins DEVTOOLS,FORM --project angular-ngxs-project
```

| Option | Description | Default Value |
| :----------- | :----------- |:----------- |
| --project | Name of the project as it is defined in your angular.json | Workspace's default project |
| --plugins | Comma separate the plugins as appear below | |


### Plugins to optionally install using the schematics

- DEVTOOLS
- FORM
- HMR
- LOGGER
- ROUTER
- STORAGE
- STORE
- WEBSOCKET

You can find more information about plugins on the [plugins page](https://www.ngxs.io/plugins).


🪄 **This command will**:

- Update `package.json` dependencies with `@ngxs/store`
- Install dependencies by executing `npm install`

If your project is standalone one:

- Update the `providers` array of your selected project array with `provideStore()`

If your application is module based:

- Update the `imports` array of your `app.module.ts` with `NgxsModule.forRoot([])`


## Manual Installation

To get started, install the package from npm. The latest version (3.x) supports Angular/RxJS 6+, if you want support for Angular 5, use version 2.x.

```bash
Expand Down
30 changes: 30 additions & 0 deletions docs/introduction/starter-kit.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
# Starter Kit

The Starter Kit will generate and auto-configure Store, Actions, States and Selectors

## Installing with schematics

```bash
ng generate starter-kit
```

Note: Running this command will prompt you to create a "Starter-Kit". The options available for the "Starter-Kit" are listed in the table below.

You have the option to enter the options yourself

```bash
ng generate starter-kit --path YOUR_PATH
```

| Option | Description | Required |
| :----------- | :----------- |:-----------: |
| --path | The path to create the starter kit |No|
| --spec | Flag to indicate if a unit test file should be created |Yes|

🪄 **This command will**:

- Create Auth State, Actions and Selectors
- Create Dictionary State, Actions and Selectors
- Create User State, Actions and Selectors
- Create a Store and Configure the Auth, Dictionary and User states

0 comments on commit b8b23fd

Please sign in to comment.