Skip to content

Latest commit

Β 

History

History
472 lines (309 loc) Β· 6.78 KB

readme.md

File metadata and controls

472 lines (309 loc) Β· 6.78 KB
marp theme title description url
true
uncover
NestJS vs AspNET
Comparison of web server frameworks

AspNET vs NestJS

<style> .logos p { display: flex; justify-content: center; align-items: center; } .logos img { width: 124px; margin: 20px; } img {max-width: 100%} </style>

aspnet vs nestjs

with me, Kyle πŸ‘‹


ASP.​NET Core is a cross-platform .NET framework for building modern cloud-based web applications on Windows, Mac, or Linux.


A progressive Node.js framework for building efficient, scalable, and enterprise-grade server-side applications on top of TypeScript & JavaScript (ES6, ES7, ES8) πŸš€


Github

Fully Open Source - Free as in Freedom 😊


Docs

Well written docs πŸ“


Architecture

Evolutions of Prior Art πŸ›

  • aspnet - built on top of dotnet core
  • nestjs - built on top of node / express

Model View Controller

A common paradigm for your data πŸ› 

model view controller


Dependencies

What you'll need to get started πŸ’»


Dependencies (.net)

.NET SDK

dotnet tool install --global dotnet-aspnet-codegenerator
dotnet add package Microsoft.VisualStudio.Web.CodeGeneration.Design

Dependencies (nest)

Node JS

npm install @nestjs/cli -g

Getting Started

Hello World πŸ‘‹


Getting Started (.net)

dotnet new mvc -o aspnet

Getting Started (nest)

git clone https://github.com/nestjs/typescript-starter.git nestjs --depth 1
cd nestjs
npm install

Running Locally

Getting the project up and running πŸ‘©β€πŸ’»


Running Locally (.net)

dotnet run       # run once
dotnet watch run # run with watch

open http://localhost:5000

Running Locally (nest)

npm run start     # run once
npm run start:dev # run with watch

open http://localhost:3000

Entry Point


Entry Point (.net)

// Program.cs
public static void Main(string[] args)
{
    CreateHostBuilder(args).Build().Run();
}

public static IHostBuilder CreateHostBuilder(string[] args) =>
    Host.CreateDefaultBuilder(args)
        .ConfigureWebHostDefaults(webBuilder =>
        {
            webBuilder.UseStartup<Startup>();
        });

Entry Point (nest)

// main.ts
async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  await app.listen(3000);
}
bootstrap();

Create Controller


Create Controller (.net)

nest schematics

nest generate controller weather

Create Controller (nest)

aspnet-codegenerator

dotnet aspnet-codegenerator controller -name weather

Controllers


Controller (.net)

Add a controller

// Controllers/WeatherController.cs
[Route("weather")]
public class WeatherController : Controller
{
    [HttpGet]
    public IActionResult GetWeather()
    {
        return Content("Frightful");
    }
}

Controller (nest)

Controllers

// weather.controller.ts
@Controller('weather')
export class WeatherController {

  @Get()
  getWeather(): string {
    return 'Frightful';
  }
}

Model Binding


Model Binding (.net)

[HttpGet]
[Route("light")]
public IActionResult GetDaylight([FromQuery] int hour)
{
    var result = hour < 6 || hour > 18 ? "Dark" : "Light";
    return Content(result);
}

Model Binding (nest)

@Get('light')
getDaylight(@Query('hour') hour: number): string {
  console.log(hour);
  return hour < 6 || hour > 18 ? 'Dark' : 'Light';
}

Models


Models (.net)

public class Home
{
    public Home(string msg)
    {
        this.Message = msg;
    }
    public string Message { get; set; }
}

Models (nest)

@Injectable()
export class Home {
  message: string;

  constructor(msg: string) {
    this.message = msg;
  }
}

Views Setup

Neither solution comes with views in the bare bones setup.

Both are well supported


Views Setup (.net)

// startup.cs
public void ConfigureServices(IServiceCollection services)
{
    // ...
    services.AddMvcCore().AddRazorViewEngine();
    // ...
}

Views Setup (nest)

MVC for NestJS

npm install --save hbs
// main.ts
app.useStaticAssets(join(__dirname, '..', 'public'));
app.setBaseViewsDir(join(__dirname, '..', 'views'));
app.setViewEngine('hbs');

View Controllers


View Controllers (.net)

[Route("home")]
public class HomeController : Controller
{
    public IActionResult Index()
    {
        var model = new Home("Hi There!");
        return View(model);
    }
}

View Controllers (nest)

@Controller('home')
export class HomeController {
  @Get()
  @Render('index')
  root() {
    const model = new Home('Hello');
    return model;
  }
}

Views


Views (.net)

Razor Syntax

// views/home/index.cshtml
@model.Message

Views (nest)

Handlebars / hbs

<!-- views/home/index.hbs -->
{{message}}

Resources


Fin

Thanks ya'll! πŸŽ‰

Questions?