Schematics

Summary

• Informations
• How to install
• Get started
  1. Installing the @paddls libraries
  2. Create module folders
  3. Create module files
  4. Replace the environment.ts
  5. Replace the app.module.ts

Informations

• Install the @paddls dependencies from npm
• Create @core, @shared and @system folders
• Create core.module.ts, shared.module.ts and system.module.ts
• Import configuration of Firebase in environment.ts
• Import NgxRepositoryModule, NgxHttpRepositoryModule and NgxFirestoreRepositoryModule in your app.module.ts

How to install

All you have to do is to install the schematics in your project. You have 2 methods.

npm :

npm install @paddls/schematics

or Angular CLI :

ng add @paddls/schematics

With the npm method, it will only install @paddls/schematics.
With the Angular CLI solution, it will install @paddls/schematics in your project and execute automatically all the tasks described below.

Get started

1. Installing the @paddls libraries

To install the @paddls libraries in your project you have to run

ng generate @paddls/schematics:add-paddls

It will ask you which version of the library you want to install, or it will install the latest version compatible depending on your Angular/RxJS version.

@paddls libraries	Description
@paddls/ngx-repository @paddls/ngx-http-repository @paddls/ngx-firestore-repository	Easily create a strongly typed data access layer
@paddls/rxjs-common	Helpful operators to use with RXJS
@paddls/ngx-common	Common functions to use in your Angular project
@paddls/ngx-serializer	Angular Wrapper of ts-serializer
@paddls/ts-serializer	Serialize/Deserialize JSON into typescript objects with decorators

Once installed, you could use the @paddls libraries in your Angular project.

2. Create modules folders

To create the @core, @shared and @system folders, you have to run

ng generate @paddls/schematics:add-modules

It will ask you which folders you want to create in your Angular project.

3. Create modules files

To create the core.module.ts, shared.module.ts and system.module.ts files, you have to run

ng generate @paddls/schematics:add-modules-files

Once executed, you will choose which file you want to create, it will be created in their respective folder. The files will be created thanks to templates included in this schematic.

4. Replace the environment.ts

If you want to include your Firebase configuration in your project, you have to run

ng generate @paddls/schematics:replace-environment

You will see this added in your environment.ts file

firebase: {
        apiKey: 'TODO',
        authDomain: 'TODO',
        databaseURL: 'TODO',
        projectId: 'TODO',
        storageBucket: 'TODO',
        messagingSenderId: 'TODO',
        appId: 'TODO',
        measurementId: 'TODO'
    }

All you have to do is to replace the TODO fields by your values to connect to your firebase project.

5. Replace the app.module.ts

If you want to include HTTP, Firebase and NgxRepository Modules in your app.module.ts and the providers to make Firebase work, you have to run this schematic.

ng generate @paddls/schematics:replace-app-module-file

It will ask you if you want to import the modules necessary for HTTP and/or Firebase.