Angular-and-Loopback-Integration.md

@@ -5,8 +5,10 @@
 There is one module that create an collection of API in typescript (used on Angular 5 or 6) from a Loopback server.
 
 
-This module is named [LoopBack SDK Builder](https://github.com/mean-expert-official/loopback-sdk-builder).
-To use this module on our project, you will need to up containers like
+This module is named [LoopBack SDK Builder](https://github.com/mean-expert-official/loopback-sdk-builder). Also, [this tutorial](https://angular-templates.io/tutorials/about/learn-how-to-build-a-mean-stack-application) show many features and detailed steps about how to use this tool.
+
+
+To use this module on our project, you will need to up containers like:
 ```bash
 $  docker-compose up
 ```
@@ -26,4 +28,74 @@ $  ./node_modules/.bin/lb-sdk server/server.js client/sdk
 
 The command will show many logs of the generated files on `client/sdk` directory.
 
-You can use this `sdk` directory on your Angular Project as we describe on .
+You can use this `sdk` directory on your Angular Project as we describe on.
\ No newline at end of file
+
+
+
+
+
+## Using Loopback SDK on your Angular project
+
+
+After you generated the `sdk` directory described on last section, you can put this on your Angular project.
+
+
+By instance, we will create our Angular App first on `client/` directory.
+```bash
+$  cd client
+$  ng new my-app
+```
+
+Now, we need put the generated `sdk` directory on Angular project.
+```bash
+$  mv sdk my-app/src/
+```
+
+
+First of all, you need to include some modules on your `client/my-app/src/app/app.module.ts`, so open it and insert the follow imports:
+```typescript
+// Import models services from Loopback SDK
+import { SalaApi } from '../sdk/services/custom/Sala';
+import { SecretarioApi } from '../sdk/services/custom/Secretario';
+
+//Import miscellaneous scripts from Loopback SDK
+import { SocketConnection } from '../sdk/sockets/socket.connections';
+import { SocketDriver } from '../sdk/sockets/socket.driver';
+import { SDKModels } from '../sdk/services/custom/SDKModels';
+import { LoopBackAuth } from '../sdk/services/core/auth.service';
+import { InternalStorage } from '../sdk/storage/storage.swaps';
+import { ErrorHandler } from '../sdk/services/core/error.service';
+
+//Module used to create connection with webservice
+//The SDK scripts will use this
+import { HttpClientModule } from '@angular/common/http';
+```
+
+Now, insert the `HttpClientModule` on imports of `app.module.ts`:
+```typescript
+...
+imports: [
+  ...
+  HttpClientModule
+ ],
+...
+```
+
+And the insert SDK modules on providers, that will be injected on others componnents:
+```
+...
+providers: [
+    ...,
+    SalaService,
+    SalaApi,
+    SecretarioApi,
+    HttpClientModule,
+    SocketConnection,
+    SocketDriver,
+    SDKModels,
+    LoopBackAuth,
+    InternalStorage,
+    ErrorHandler
+  ],
+...
+```