Skip to content

KyleMit/nestjs-vs-aspnet

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

14 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

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?