Quick Start


Back End

Install Packages

Nuget: Install-Package EntitySignal.Server

Configure Startup.cs

Add AddEntitySignal() as a service in the ConfigureServices function

public void ConfigureServices(IServiceCollection services)
{
  //Normal stuff here
  services.AddSignalR();
  services.AddHttpContextAccessor();
  services.AddEntitySignal();
}

Map a EntitySignalHub with SignalR to /dataHub endpoint.

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
  app.UseEndpoints(endpoints =>
  {
    endpoints.MapHub<EntitySignalHub>("/dataHub");
  });

  //or do this for asp.net core 2.x
  //app.UseSignalR(routes =>
  //{
  //  routes.MapHub<EntitySignalHub>("/dataHub");
  //});
}

Use Entity Signal Data Context

Replace IdentityDbContext with EntitySignalIdentityDbContext or DbContext with EntitySignalDbContext.

Add a EntitySignalDataProcess dependency injection and pass into the base class.

public class ApplicationDbContext : EntitySignalIdentityDbContext
{
  public ApplicationDbContext(DbContextOptions<ApplicationDbContext> options,
    EntitySignalDataProcess entitySignalDataProcess)
      : base(options, entitySignalDataProcess)
  {
  }
}

Create Subscribe Endpoint

The below function subscribes to all changes of type Message

[HttpGet]
public ActionResult<IEnumerable<Message>> SubscribeToAllMessages()
{
  _entitySignalSubscribe.Subscribe<Message>();

  return _db.Messages.ToList();
}

The below function subscribes to all changes of type Message where the ID is odd.

[HttpGet]
public IEnumerable<Message> SubscribeToOddIdMessages()
{
  var userContainer = _entitySignalSubscribe.Subscribe<Message>(x=> x.Id % 2 == 1);

  return _db.Messages
    .Where(userContainer.Query)
    .ToList();
}

Front End (VanillaJs)

Install Packages

NPM: npm install entity-signal or download from GitHub

Add Javascript Files To Html After SignalR

<script src="https://cdn.jsdelivr.net/npm/@aspnet/signalr@1.1.2/dist/browser/signalr.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/entity-signal@1.0.2/dist/entitySignal.js"></script>

Create Client and Begin Syncing Data

var client = new EntitySignal.Client();
var syncedList;
client.syncWith("/SubscribeToAllMessages").then(function(x){
  syncedList = x;
  });

Not using VanillaJs?

Configure Front End Using AngularJs

Configure Front End Using React

Configure Front End Using Vue