Use this link for the short video demo.

 

The project updated to use ASP.NET Core 2.0 RTM and Angualr 4.2 with Visual Studio 2017 (Version 15.3.5 or newer)

SignalR (alpha) for ASP.NET Core 2.0 is used.

Please see this MSDN article for the additional information.

 

Also there is the ASP.NET Core project with SignalR 2.2.2 (The old version).

Introduction

This example demonstrates how you can use Visual Studio 2017 for build ASP.NET Core 1.x/2.x web application. For additional information about ASP.NET Core and Visual Studio 2017 see ASP.NET Future Release (Getting Started with ASP.NET vNext and Visual Studio "14").

Description

Wherein editing is done in real time. That is, users can instantly see the changes implemented by others. It is completely based on and meets the OWIN specification (Open Web Server Interface for. NET). This application created with using Visual Studio 2017 as ASP.NET Core application and uses SignalR and Angular 1/Angular 2 libraries. As far as the platform is related it uses Microsoft .NET Framework 4.6.x or .NET Core 2.0. It is designed to showcase the latest technology designed for building modern web applications. In this case, each component of the application is managed by users. This puts great flexibility and freedom of action.

Building the Sample

There are special requirements and instructions for building the sample.

1. Download source code.

2. Install the latest version of .NET Core 2.0 SDK (Visual Studio 2017 RTW Version 15.3.5 or newer).

 

3. Open project by Visual Studio 2017 and run it.

 

C#
Edit|Remove
using System; 
using System.Threading.Tasksusing Microsoft.AspNetCore.Builder; 
using Microsoft.AspNetCore.Hosting; 
using Microsoft.AspNetCore.Http; 
using Microsoft.AspNetCore.SpaServices.Webpack; 
using Microsoft.Extensions.Configuration; 
using Microsoft.Extensions.DependencyInjection; 
 
namespace RealTimeDataEditor 
{ 
    public class Startup 
    { 
        public Startup(IConfiguration configuration) 
        { 
            Configuration = configuration; 
        } 
 
        public IConfiguration Configuration { get; } 
 
        // This method gets called by the runtime. Use this method to add services to the container. 
        public void ConfigureServices(IServiceCollection services) 
        { 
            services.AddSignalR(); 
            services.AddMvc(); 
        } 
 
        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline. 
        public void Configure(IApplicationBuilder app, IHostingEnvironment env) 
        { 
            app.UseSignalR(routes => 
            { 
                routes.MapHub<ProductMessageHub>("ProductMessageHub"); 
            }); 
 
            if (env.IsDevelopment()) 
            { 
                app.UseDeveloperExceptionPage(); 
                app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions 
                { 
                    HotModuleReplacement = true 
                }); 
            } 
            else 
            { 
                app.UseExceptionHandler("/Home/Error"); 
            } 
 
            app.UseStaticFiles(); 
 
            app.UseMvc(routes => 
            { 
                routes.MapRoute( 
                    name: "default", 
                    template: "{controller=Home}/{action=Index}/{id?}"); 
 
                routes.MapSpaFallbackRoute( 
                    name: "spa-fallback", 
                    defaults: new { controller = "Home", action = "Index" }); 
            }); 
        } 
    } 
} 

 

More Information

For more information on Real Time Data Editor, see...