gistlyn/Configure.AppHost.cs

## appsettings.json
{
  "Logging": {
    "IncludeScopes": false,
    "Debug": {
      "LogLevel": {
        "Default": "Warning"
      }
    },
    "Console": {
      "LogLevel": {
        "Default": "Warning"
      }
    }
  }
}

## Configure.AppHost.cs
using Funq;
using ServiceStack;
using MyApp.ServiceInterface;

[assembly: HostingStartup(typeof(MyApp.AppHost))]

namespace MyApp;

public class AppHost : AppHostBase, IHostingStartup
{
    public void Configure(IWebHostBuilder builder) => builder
        .ConfigureServices(services => {
            // Configure ASP.NET Core IOC Dependencies
        });

    public AppHost() : base("MyApp", typeof(MyServices).Assembly) {}

    public override void Configure(Container container)
    {
        // Configure ServiceStack only IOC, Config & Plugins
        SetConfig(new HostConfig {
            UseSameSiteCookies = true,
        });
    }
}

## MyApp.csproj
<Project Sdk="Microsoft.NET.Sdk.Web">

  <PropertyGroup>
    <TargetFramework>net8.0</TargetFramework>
    <Nullable>enable</Nullable>
    <ImplicitUsings>enable</ImplicitUsings>
  </PropertyGroup>
  <ItemGroup>
    <Using Include="MyApp" />
    <Using Include="ServiceStack" />
  </ItemGroup>

  <ItemGroup>
    <Folder Include="wwwroot\" />
  </ItemGroup>

  <ItemGroup>
    <PackageReference Include="ServiceStack" Version="8.*" />
  </ItemGroup>

</Project>

## Program.cs
var builder = WebApplication.CreateBuilder(args);

var app = builder.Build();

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error");
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
    app.UseHttpsRedirection();
}
app.UseServiceStack(new AppHost());

app.Run();

## ServiceInterface\MyServices.cs
using System;
using ServiceStack;
using MyApp.ServiceModel;

namespace MyApp.ServiceInterface
{
    public class MyServices : Service
    {
        public object Any(Hello request)
        {
            return new HelloResponse { Result = $"Hello, {request.Name}!" };
        }
    }
}

## ServiceModel\Hello.cs
using ServiceStack;

namespace MyApp.ServiceModel
{
    [Route("/hello")]
    [Route("/hello/{Name}")]
    public class Hello : IReturn<HelloResponse>
    {
        public string? Name { get; set; }
    }

    public class HelloResponse
    {
        public string? Result { get; set; }
    }
}

## wwwroot\index.html
<html>
<head>
    <title>My App</title>
    <style>
        body { padding: 1em 1em 0 1em; }
        body, input[type=text] { font: 32px/36px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif }
        input { padding:.25em .5em; margin-right:.5em; }
        a { color: #007bff }
        #result { display:inline-block;color:#28a745; }
        pre { background: #f1f1f1; padding: 1em; }
    </style>
</head>
<body>

<h2><a href="/ui/Hello">Hello</a> API</h2>
<input type="text" id="txtName" onkeyup="callHello(this.value)">
<div id="result"></div>

<script src="/js/require.js"></script>
<script src="/js/servicestack-client.js"></script>
<script src="/types/js"></script>
<script>
var { JsonServiceClient, Hello } = exports

var client = new JsonServiceClient();
function callHello(name) {
    client.get(new Hello({ name }))
        .then(function(r) {
            document.getElementById('result').innerHTML = r.result;
        });
}

callHello(document.querySelector('#txtName').value = 'World')
</script>

<div style="font-size:20px;line-height:26px">

    <h3>View in API Explorer</h3>
    <ul>
        <li>
            <a href="/ui/Hello">Call API</a>
        </li>
        <li>
            <a href="/ui/Hello?tab=details">View API Details</a>
        </li>
        <li>
            <a href="/ui/Hello?tab=code">Browse API Source Code</a>
        </li>
    </ul>

    <h3>Using JsonServiceClient in Web Pages</h3>

    <p>
        The easiest way to call your APIs in a webpage is to include your JavaScript DTOs <b>/types/js</b> and built-in
        UMD <a href="https://docs.servicestack.net/servicestack-client-umd">@servicestack/client</a> library:
    </p>

<pre>&lt;script src="/js/require.js"&gt;&lt;/script&gt;
&lt;script src="/js/servicestack-client.js"&gt;&lt;/script&gt;
&lt;script src="/types/js"&gt;&lt;/script&gt;</pre>

    <p>
        We can then import and use the library and DTO types:
    </p>

    <pre>var { JsonServiceClient, Hello } = exports

var client = new JsonServiceClient()
client.api(new Hello({ name }))
    .then(function(api) {
        if (api.succeeded)
            console.log(api.response)
    })
</pre>

    <h3>Using @servicestack/client in npm projects</h3>


    <p>
        Update your App's
        <a href="https://docs.servicestack.net/typescript-add-servicestack-reference">TypeScript DTOs</a> and
        compile to JS (requires <a href="https://www.typescriptlang.org/download">TypeScript</a>):
    </p>

    <pre>$ x scripts dtos</pre>

    <h3>Including @servicestack/client &amp; Typed DTOs</h3>

    <p>
        Where you'll be able to use your APIs typed DTOs with ServiceStack's generic **JsonServiceClient**
    </p>

    <pre>$ npm install @servicestack/client</pre>
    <pre>import { JsonServiceClient } from '@servicestack/client'
import { Hello } from './dtos'

let client = new JsonServiceClient()
let api = await client.api(new Hello({ name }))
if (api.succeeded)
    console.log(api.response.result)
</pre>

    <p>
        Typed DTOs generated using
        <a href="https://docs.servicestack.net/typescript-add-servicestack-reference">TypeScript Add ServiceStack Reference</a>
    </p>
</div>

</body>
</html>
	{
	"Logging": {
	"IncludeScopes": false,
	"Debug": {
	"LogLevel": {
	"Default": "Warning"
	}
	},
	"Console": {
	"LogLevel": {
	"Default": "Warning"
	}
	}
	}
	}
	using Funq;
	using ServiceStack;
	using MyApp.ServiceInterface;

	[assembly: HostingStartup(typeof(MyApp.AppHost))]

	namespace MyApp;

	public class AppHost : AppHostBase, IHostingStartup
	{
	public void Configure(IWebHostBuilder builder) => builder
	.ConfigureServices(services => {
	// Configure ASP.NET Core IOC Dependencies
	});

	public AppHost() : base("MyApp", typeof(MyServices).Assembly) {}

	public override void Configure(Container container)
	{
	// Configure ServiceStack only IOC, Config & Plugins
	SetConfig(new HostConfig {
	UseSameSiteCookies = true,
	});
	}
	}
	<Project Sdk="Microsoft.NET.Sdk.Web">

	<PropertyGroup>
	<TargetFramework>net8.0</TargetFramework>
	<Nullable>enable</Nullable>
	<ImplicitUsings>enable</ImplicitUsings>
	</PropertyGroup>
	<ItemGroup>
	<Using Include="MyApp" />
	<Using Include="ServiceStack" />
	</ItemGroup>

	<ItemGroup>
	<Folder Include="wwwroot\" />
	</ItemGroup>

	<ItemGroup>
	<PackageReference Include="ServiceStack" Version="8.*" />
	</ItemGroup>

	</Project>
	var builder = WebApplication.CreateBuilder(args);

	var app = builder.Build();

	// Configure the HTTP request pipeline.
	if (!app.Environment.IsDevelopment())
	{
	app.UseExceptionHandler("/Error");
	// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
	app.UseHsts();
	app.UseHttpsRedirection();
	}
	app.UseServiceStack(new AppHost());

	app.Run();
	using System;
	using ServiceStack;
	using MyApp.ServiceModel;

	namespace MyApp.ServiceInterface
	{
	public class MyServices : Service
	{
	public object Any(Hello request)
	{
	return new HelloResponse { Result = $"Hello, {request.Name}!" };
	}
	}
	}
	using ServiceStack;

	namespace MyApp.ServiceModel
	{
	[Route("/hello")]
	[Route("/hello/{Name}")]
	public class Hello : IReturn<HelloResponse>
	{
	public string? Name { get; set; }
	}

	public class HelloResponse
	{
	public string? Result { get; set; }
	}
	}
	<html>
	<head>
	<title>My App</title>
	<style>
	body { padding: 1em 1em 0 1em; }
	body, input[type=text] { font: 32px/36px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif }
	input { padding:.25em .5em; margin-right:.5em; }
	a { color: #007bff }
	#result { display:inline-block;color:#28a745; }
	pre { background: #f1f1f1; padding: 1em; }
	</style>
	</head>
	<body>

	<h2><a href="/ui/Hello">Hello</a> API</h2>
	<input type="text" id="txtName" onkeyup="callHello(this.value)">
	<div id="result"></div>

	<script src="/js/require.js"></script>
	<script src="/js/servicestack-client.js"></script>
	<script src="/types/js"></script>
	<script>
	var { JsonServiceClient, Hello } = exports

	var client = new JsonServiceClient();
	function callHello(name) {
	client.get(new Hello({ name }))
	.then(function(r) {
	document.getElementById('result').innerHTML = r.result;
	});
	}

	callHello(document.querySelector('#txtName').value = 'World')
	</script>

	<div style="font-size:20px;line-height:26px">

	<h3>View in API Explorer</h3>
	<ul>
	<li>
	<a href="/ui/Hello">Call API</a>
	</li>
	<li>
	<a href="/ui/Hello?tab=details">View API Details</a>
	</li>
	<li>
	<a href="/ui/Hello?tab=code">Browse API Source Code</a>
	</li>
	</ul>

	<h3>Using JsonServiceClient in Web Pages</h3>

	<p>
	The easiest way to call your APIs in a webpage is to include your JavaScript DTOs <b>/types/js</b> and built-in
	UMD <a href="https://docs.servicestack.net/servicestack-client-umd">@servicestack/client</a> library:
	</p>

	<pre><script src="/js/require.js"></script>
	<script src="/js/servicestack-client.js"></script>
	<script src="/types/js"></script></pre>

	<p>
	We can then import and use the library and DTO types:
	</p>

	<pre>var { JsonServiceClient, Hello } = exports

	var client = new JsonServiceClient()
	client.api(new Hello({ name }))
	.then(function(api) {
	if (api.succeeded)
	console.log(api.response)
	})
	</pre>

	<h3>Using @servicestack/client in npm projects</h3>


	<p>
	Update your App's
	<a href="https://docs.servicestack.net/typescript-add-servicestack-reference">TypeScript DTOs</a> and
	compile to JS (requires <a href="https://www.typescriptlang.org/download">TypeScript</a>):
	</p>

	<pre>$ x scripts dtos</pre>

	<h3>Including @servicestack/client & Typed DTOs</h3>

	<p>
	Where you'll be able to use your APIs typed DTOs with ServiceStack's generic JsonServiceClient
	</p>

	<pre>$ npm install @servicestack/client</pre>
	<pre>import { JsonServiceClient } from '@servicestack/client'
	import { Hello } from './dtos'

	let client = new JsonServiceClient()
	let api = await client.api(new Hello({ name }))
	if (api.succeeded)
	console.log(api.response.result)
	</pre>

	<p>
	Typed DTOs generated using
	<a href="https://docs.servicestack.net/typescript-add-servicestack-reference">TypeScript Add ServiceStack Reference</a>
	</p>
	</div>

	</body>
	</html>