Skip to content

Commit

Permalink
Migration from App Service to Azure Container Apps (#44)
Browse files Browse the repository at this point in the history
  • Loading branch information
justinyoo authored Jul 18, 2024
1 parent 066cc92 commit a4167c9
Show file tree
Hide file tree
Showing 41 changed files with 947 additions and 333 deletions.
51 changes: 13 additions & 38 deletions azure.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -10,48 +10,23 @@ workflows:
- azd: deploy --all

services:
appservice-dotnet:
host: appservice
containerapp-api-dotnet:
host: containerapp
language: csharp
project: ./dotnet/src/ApiApp
hooks:
prepackage:
posix:
shell: sh
continueOnError: false
interactive: true
run: dotnet publish -c Release
windows:
shell: pwsh
continueOnError: false
interactive: true
run: dotnet publish -c Release
appservice-node:
host: appservice
language: js
project: ./nodejs/webapi
staticapp-dotnet:
host: staticwebapp
containerapp-web-dotnet:
host: containerapp
language: csharp
project: ./dotnet/src/WebApp
dist: ./dotnet/publish/wwwroot
hooks:
prepackage:
posix:
shell: sh
continueOnError: false
interactive: true
run: dotnet publish -c Release -o ./dotnet/publish
windows:
shell: pwsh
continueOnError: false
interactive: true
run: dotnet publish -c Release -o ./dotnet/publish
# staticapp-node:
# host: staticwebapp
# language: js
# project: ./nodejs/src/web
# dist: build
containerapp-api-node:
host: containerapp
language: js
project: ./nodejs/webapi
# containerapp-web-node:
# host: containerapp
# language: js
# project: ./nodejs/src/web
# dist: build

hooks:
preup:
Expand Down
12 changes: 6 additions & 6 deletions dotnet/App.sln
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "src", "src", "{6FF202E5-B66
EndProject
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "ApiApp", "src\ApiApp\ApiApp.csproj", "{7C52F054-84F7-4B72-9C62-F66AC039E800}"
EndProject
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "WebApp", "src\WebApp\WebApp.csproj", "{5B5A7DC2-222B-4BBB-BAE6-96BF0ED051C6}"
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "WebApp", "src\WebApp\WebApp.csproj", "{B0EB9EBF-1226-43D2-B499-CD229ACA219C}"
EndProject
Global
GlobalSection(SolutionConfigurationPlatforms) = preSolution
Expand All @@ -19,17 +19,17 @@ Global
{7C52F054-84F7-4B72-9C62-F66AC039E800}.Debug|Any CPU.Build.0 = Debug|Any CPU
{7C52F054-84F7-4B72-9C62-F66AC039E800}.Release|Any CPU.ActiveCfg = Release|Any CPU
{7C52F054-84F7-4B72-9C62-F66AC039E800}.Release|Any CPU.Build.0 = Release|Any CPU
{5B5A7DC2-222B-4BBB-BAE6-96BF0ED051C6}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{5B5A7DC2-222B-4BBB-BAE6-96BF0ED051C6}.Debug|Any CPU.Build.0 = Debug|Any CPU
{5B5A7DC2-222B-4BBB-BAE6-96BF0ED051C6}.Release|Any CPU.ActiveCfg = Release|Any CPU
{5B5A7DC2-222B-4BBB-BAE6-96BF0ED051C6}.Release|Any CPU.Build.0 = Release|Any CPU
{B0EB9EBF-1226-43D2-B499-CD229ACA219C}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
{B0EB9EBF-1226-43D2-B499-CD229ACA219C}.Debug|Any CPU.Build.0 = Debug|Any CPU
{B0EB9EBF-1226-43D2-B499-CD229ACA219C}.Release|Any CPU.ActiveCfg = Release|Any CPU
{B0EB9EBF-1226-43D2-B499-CD229ACA219C}.Release|Any CPU.Build.0 = Release|Any CPU
EndGlobalSection
GlobalSection(SolutionProperties) = preSolution
HideSolutionNode = FALSE
EndGlobalSection
GlobalSection(NestedProjects) = preSolution
{7C52F054-84F7-4B72-9C62-F66AC039E800} = {6FF202E5-B660-454E-9EF4-78855241C703}
{5B5A7DC2-222B-4BBB-BAE6-96BF0ED051C6} = {6FF202E5-B660-454E-9EF4-78855241C703}
{B0EB9EBF-1226-43D2-B499-CD229ACA219C} = {6FF202E5-B660-454E-9EF4-78855241C703}
EndGlobalSection
GlobalSection(ExtensibilityGlobals) = postSolution
SolutionGuid = {616B42B0-6B21-4954-B21D-BEF0F3C827E5}
Expand Down
4 changes: 2 additions & 2 deletions dotnet/src/ApiApp/ApiApp.csproj
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@
</PropertyGroup>

<ItemGroup>
<PackageReference Include="Microsoft.AspNetCore.OpenApi" Version="8.0.4" />
<PackageReference Include="Swashbuckle.AspNetCore" Version="6.4.0" />
<PackageReference Include="Microsoft.AspNetCore.OpenApi" Version="8.0.7" />
<PackageReference Include="Swashbuckle.AspNetCore" Version="6.6.2" />
</ItemGroup>

</Project>
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
@page "/"
@using WebApp.UI
@using WebApp.Components.UI

<PageTitle>Home</PageTitle>

<h1>Hello, world!</h1>

Welcome to your new app.

<AvailablePetsComponent />
<AvailablePetsComponent @rendermode="InteractiveServer" />
34 changes: 25 additions & 9 deletions dotnet/src/WebApp.Extensions/Program.cs
Original file line number Diff line number Diff line change
@@ -1,15 +1,31 @@
using Microsoft.AspNetCore.Components.Web;
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;

using WebApp;
using WebApp.Components;
using WebApp.Extensions;

var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");
builder.RootComponents.Add<HeadOutlet>("head::after");
var builder = WebApplication.CreateBuilder(args);

builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
// Add services to the container.
builder.Services.AddRazorComponents()
.AddInteractiveServerComponents();

// Add pet store client
builder.Services.AddPetStoreClient();

await builder.Build().RunAsync();
var app = builder.Build();

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Error", createScopeForErrors: true);
// 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.UseStaticFiles();
app.UseAntiforgery();

app.MapRazorComponents<App>()
.AddInteractiveServerRenderMode();

await app.RunAsync();
12 changes: 0 additions & 12 deletions dotnet/src/WebApp/App.razor

This file was deleted.

20 changes: 20 additions & 0 deletions dotnet/src/WebApp/Components/App.razor
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<base href="/" />
<link rel="stylesheet" href="bootstrap/bootstrap.min.css" />
<link rel="stylesheet" href="app.css" />
<link rel="stylesheet" href="WebApp.styles.css" />
<link rel="icon" type="image/png" href="favicon.png" />
<HeadOutlet />
</head>

<body>
<Routes />
<script src="_framework/blazor.web.js"></script>
</body>

</html>
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
@inherits LayoutComponentBase

<div class="page">
<div class="sidebar">
<NavMenu />
Expand All @@ -14,3 +15,9 @@
</article>
</main>
</div>

<div id="blazor-error-ui">
An unhandled error has occurred.
<a href="" class="reload">Reload</a>
<a class="dismiss">🗙</a>
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -75,3 +75,22 @@ main {
padding-right: 1.5rem !important;
}
}

#blazor-error-ui {
background: lightyellow;
bottom: 0;
box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
display: none;
left: 0;
padding: 0.6rem 1.25rem 0.7rem 1.25rem;
position: fixed;
width: 100%;
z-index: 1000;
}

#blazor-error-ui .dismiss {
cursor: pointer;
position: absolute;
right: 0.75rem;
top: 0.5rem;
}
Original file line number Diff line number Diff line change
@@ -1,24 +1,25 @@
<div class="top-row ps-3 navbar navbar-dark">
<div class="container-fluid">
<a class="navbar-brand" href="">WebApp</a>
<button title="Navigation menu" class="navbar-toggler" @onclick="ToggleNavMenu">
<span class="navbar-toggler-icon"></span>
</button>
</div>
</div>

<div class="@NavMenuCssClass nav-scrollable" @onclick="ToggleNavMenu">
<input type="checkbox" title="Navigation menu" class="navbar-toggler" />

<div class="nav-scrollable" onclick="document.querySelector('.navbar-toggler').click()">
<nav class="flex-column">
<div class="nav-item px-3">
<NavLink class="nav-link" href="" Match="NavLinkMatch.All">
<span class="bi bi-house-door-fill-nav-menu" aria-hidden="true"></span> Home
</NavLink>
</div>

<div class="nav-item px-3">
<NavLink class="nav-link" href="counter">
<span class="bi bi-plus-square-fill-nav-menu" aria-hidden="true"></span> Counter
</NavLink>
</div>

<div class="nav-item px-3">
<NavLink class="nav-link" href="weather">
<span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Weather
Expand All @@ -27,13 +28,3 @@
</nav>
</div>

@code {
private bool collapseNavMenu = true;

private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;

private void ToggleNavMenu()
{
collapseNavMenu = !collapseNavMenu;
}
}
Original file line number Diff line number Diff line change
@@ -1,5 +1,18 @@
.navbar-toggler {
background-color: rgba(255, 255, 255, 0.1);
appearance: none;
cursor: pointer;
width: 3.5rem;
height: 2.5rem;
color: white;
position: absolute;
top: 0.5rem;
right: 1rem;
border: 1px solid rgba(255, 255, 255, 0.1);
background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked {
background-color: rgba(255, 255, 255, 0.5);
}

.top-row {
Expand Down Expand Up @@ -46,36 +59,45 @@
padding-bottom: 1rem;
}

.nav-item ::deep a {
.nav-item ::deep .nav-link {
color: #d7d7d7;
background: none;
border: none;
border-radius: 4px;
height: 3rem;
display: flex;
align-items: center;
line-height: 3rem;
width: 100%;
}

.nav-item ::deep a.active {
background-color: rgba(255,255,255,0.37);
color: white;
}

.nav-item ::deep a:hover {
.nav-item ::deep .nav-link:hover {
background-color: rgba(255,255,255,0.1);
color: white;
}

.nav-scrollable {
display: none;
}

.navbar-toggler:checked ~ .nav-scrollable {
display: block;
}

@media (min-width: 641px) {
.navbar-toggler {
display: none;
}

.collapse {
.nav-scrollable {
/* Never collapse the sidebar for wide screens */
display: block;
}

.nav-scrollable {

/* Allow sidebar to scroll for tall menus */
height: calc(100vh - 3.5rem);
overflow-y: auto;
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
@page "/counter"
@rendermode InteractiveServer

<PageTitle>Counter</PageTitle>

Expand Down
36 changes: 36 additions & 0 deletions dotnet/src/WebApp/Components/Pages/Error.razor
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
@page "/Error"
@using System.Diagnostics

<PageTitle>Error</PageTitle>

<h1 class="text-danger">Error.</h1>
<h2 class="text-danger">An error occurred while processing your request.</h2>

@if (ShowRequestId)
{
<p>
<strong>Request ID:</strong> <code>@RequestId</code>
</p>
}

<h3>Development Mode</h3>
<p>
Swapping to <strong>Development</strong> environment will display more detailed information about the error that occurred.
</p>
<p>
<strong>The Development environment shouldn't be enabled for deployed applications.</strong>
It can result in displaying sensitive information from exceptions to end users.
For local debugging, enable the <strong>Development</strong> environment by setting the <strong>ASPNETCORE_ENVIRONMENT</strong> environment variable to <strong>Development</strong>
and restarting the app.
</p>

@code{
[CascadingParameter]
private HttpContext? HttpContext { get; set; }

private string? RequestId { get; set; }
private bool ShowRequestId => !string.IsNullOrEmpty(RequestId);

protected override void OnInitialized() =>
RequestId = Activity.Current?.Id ?? HttpContext?.TraceIdentifier;
}
File renamed without changes.
Loading

0 comments on commit a4167c9

Please sign in to comment.