# Send Real-time Notifications via SignalR in ABP Project
SignalR is an open source library that adds real-time operation functionality to applications. Real-time web functionality enables server-side code to instantly send content to clients without refreshing the page. I'll show you how to add SignalR and use it to send notifications from backend. I'll implement this functionality in MVC template of ABP Framework.
## Implement Backend
@ -94,4 +95,4 @@ To do this easily, open your `Index.cshtml` which is in the Pages folder of your
Run your web project and in the Index page you'll see a button named as "Get Notification". Click the button and see the notification that comes from SignalR. This is a basic usage of SignalR notification system. You can implement it according to your own requirements.
Before v4.3, the "Manage Your Profile" link in the current user dropdown on the top bar redirected the user to MVC's profile management page. As of v4.3, the same link will land on a page in the Angular UI account module instead. So you have to install and implement the account module to your Angular project when you update the ABP to v4.3.
#### Account Module Implementation
Install the `@abp/ng.account` NPM package by running the below command:
```bash
npm install @abp/ng.account@next
```
> Make sure v4.3-rc or higher version is installed.
Open the `app.module.ts` and add `AccountConfigModule.forRoot()` to the imports array as shown below:
```js
// app.module.ts
import { AccountConfigModule } from '@abp/ng.account/config';
//...
@NgModule({
imports: [
//...
AccountConfigModule.forRoot()
],
//...
})
export class AppModule {}
```
Open the `app-routing.module.ts` and add the `account`route to `routes` array as follows:
#### Account Module Implementation for Commercial Templates
The pro startup template comes with `@volo/abp.ng.account` package. You should update the package version to v4.3-rc or higher version. The package can be updated by running the following command:
```bash
npm install @volo/abp.ng.account@next
```
> Make sure v4.3-rc or higher version is installed.
`AccountConfigModule` is already imported to `app.module.ts` in the startup template. So no need to import the module to the `AppModule`. If you removed the `AccountConfigModule` from the `AppModule`, you can import it as shown below:
```js
// app.module.ts
import { AccountConfigModule } from '@volo/abp.ng.account/config';
//...
@NgModule({
imports: [
//...
AccountConfigModule.forRoot()
],
//...
})
export class AppModule {}
```
Open the `app-routing.module.ts` and add the `account`route to `routes` array as follows:
maliming
5 years ago
