Skip to content

Commit 73784dc

Browse files
committed
feat(README): added more examples
1 parent fc2cd30 commit 73784dc

File tree

1 file changed

+81
-2
lines changed

1 file changed

+81
-2
lines changed

README.md

Lines changed: 81 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,8 +45,6 @@ To use **ngx-fastboot**, import the `fast` function and call it with your Angula
4545

4646
### Example
4747

48-
49-
5048
#### Before
5149

5250
```typescript
@@ -89,6 +87,87 @@ fast(bootstrapApplication, AppComponent, {
8987
});
9088
```
9189

90+
#### Provider example
91+
92+
In the following example, we demonstrate how to define and export an array of providers that include both Provider and EnvironmentProviders. This array can be used with ngx-fastboot to dynamically load and resolve these providers during application bootstrap, optimizing the initial load performance.
93+
94+
```typescript
95+
import { provideHttpClient } from '@angular/common/http';
96+
import { EnvironmentProviders, Provider, provideZoneChangeDetection } from '@angular/core';
97+
import { ReactiveFormsModule } from '@angular/forms';
98+
99+
export default [
100+
provideHttpClient(),
101+
ReactiveFormsModule,
102+
provideZoneChangeDetection({ eventCoalescing: true }),
103+
] satisfies Array<Provider | EnvironmentProviders>;
104+
```
105+
106+
### Sentry Integration Example
107+
This example shows how to integrate Sentry with ngx-fastboot for error monitoring and performance tracing in your Angular application.
108+
109+
sentry.config.ts
110+
```typescript
111+
import { APP_INITIALIZER, EnvironmentProviders, ErrorHandler, Provider } from '@angular/core';
112+
import { Router } from '@angular/router';
113+
import {
114+
browserTracingIntegration,
115+
createErrorHandler,
116+
init,
117+
replayIntegration,
118+
TraceService,
119+
} from '@sentry/angular-ivy';
120+
121+
export function initSentryConfig() {
122+
init({
123+
dsn: '<your-dsn>',
124+
integrations: [browserTracingIntegration(), replayIntegration()],
125+
...etc
126+
});
127+
console.info('Sentry initialized.');
128+
}
129+
130+
export default [
131+
{
132+
provide: ErrorHandler,
133+
useValue: createErrorHandler({
134+
showDialog: false,
135+
logErrors: true,
136+
}),
137+
},
138+
{
139+
provide: TraceService,
140+
deps: [Router],
141+
},
142+
{
143+
provide: APP_INITIALIZER,
144+
useFactory: () => () => {},
145+
deps: [TraceService],
146+
multi: true,
147+
},
148+
] satisfies Array<Provider | EnvironmentProviders>;
149+
```
150+
151+
main.ts
152+
```typescript
153+
import { AppComponent } from './app.component';
154+
import { bootstrapApplication } from '@angular/platform-browser';
155+
import { fast } from 'ngx-fastboot';
156+
157+
fast(bootstrapApplication, AppComponent, {
158+
providers: [
159+
() => import('./app/configs/sentry.config'),
160+
],
161+
})
162+
.then(async () => {
163+
return import('./app/configs/sentry.config').then((config) => config.initSentryConfig());
164+
})
165+
.catch((err) =>
166+
console.error(err),
167+
);
168+
169+
```
170+
92171
## API
93172

94173
### `fast`

0 commit comments

Comments
 (0)