Let's build a simple app with .net 6 asp.net core web api, react, and elastic apm.

2.4K Views

January 22, 22

スライド概要

「.NET 6 ASP.NET Core Web API、React、Elastic APM でシンプルなアプリを構築してみよう」
Elastic テクニカルプロダクトマーケティングマネージャー/エバンジェリスト
デジタル庁 ソリューションアーキテクト
鈴木 章太郎

ASP.NET Core 6 Web API を、今回は React フロントエンドと組み合わせ、超シンプルな CRUD アプリケーションを構築します。EF6 で Azure SQL Database を Code First で構築し、Web API は Azure App Services に、React アプリは AzureStatic Web App に、それぞれ公開し、APM で監視します。

profile-image

FPT ジャパン エグゼクティブエバンジェリスト 独立行政法人 国立印刷局 デジタル統括アドバイザー兼最高情報セキュリティアドバイザー Microsoft で13年間、テクニカルエバンジェリストとして .NET、C#、Visual Studio、Windows、iOS、Android、Microsoft Azure 等の開発者向け技術啓発活動 (DevRel) 。Dell、Accenture、Elastic、VMware 等での DevRel 後、2024年11月1日より現職で DevRel 活動を開始。NVIDIA との戦略的協業 AI GPU クラウド、Azure/AWS/GC 上の AI &データ関連サービスのマーケティング、プリセールス、教育、関連新規サービス開発。元内閣官房 IT 総合戦略室 政府 CIO 補佐官(兼務)、元デジタル庁 ソリューションアーキテクト(兼務)。

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

(ダウンロード不可)

関連スライド

各ページのテキスト
1.

.NET 6 ASP.NET Core Web API、 React、Elastic APM でシンプルなアプリを 構築してみよう 鈴⽊ 章太郎 Elastic テクニカルプロダクトマーケティングマネージャー/エバンジェリスト デジタル庁 省庁業務グループ ソリューションアーキテクト

2.

Shotaro Suzuki Twitter : @shosuz Elastic Technical Product Marketing Manager/Evangelist デジタル庁 省庁業務グループ ソリューションアーキテクト 元 Microsoft Technical Evangelist

3.

l l l アジェンダ l l l l l l API プロジェクトの作成 Entity Framework Core コード作成と最初の Database ⽣成 API エンドポイント⽣成 React プロジェクトの作成 Azure App Service にサーバを公開 Azure Static Web App + GitHub Actions に React を公開 CORS ポリシーの修正 Elastic APM によるアプリケーションの監視 まとめ

4.

今回は Visual Studio 2022 for Mac Preview で デモアプリを作成 加えて、 Azure Data Explorer、 GitHub Desktop for mac、 Visual Studio Code https://visualstudio.microsoft.com/ja/vs/mac/preview/

5.

今回のデモアプリのイメージ iOS / Android Mobile App Azure Static Web Apps Azure App Service React Web App ASP.NET 6 Web API Azure SQL Database React Native Elastic APM Agent CRUD 全⽂検索クエリ Elastic APM Agent Elastic APM Endpoint に送信 React Web App Elastic Cloud 検索・更新 UI Visual Studio 2022 for Mac https://f79...c67.japaneast .azure.elasticcloud.com:9243/ Azure Data Explorer 東⽇本リージョン マスターノード x 1 データノード x 2 ML ノード x 1 Azure サブスクリプション

6.

API プロジェクトの作成

7.
[beta]
.NET 6 Minimal APIs for Cloud Native Apps
Lightweight, single-file, cloud native APIs
var app = WebApplication.Create(args);
app.MapGet("/", () => "Hello World!");
app.Run();

Low ceremony, top-level C# programs
Easy to get started
Path to MVC

Minimal code for minimal apps
• C#のトップレベルプログラムをベースに最⼩限のコードで ASP.NET Web API を構築する軽量な⽅法
• 従来のコントローラースタイルの Web API のようなコードなしにクラウドスケール API を簡単に構築可能
• プロジェクトが⼤きくなり始めたら、これらを ASP.NET MVC コントローラに移⾏することも可能
• パイプライン処理や単純な CRUD のような複雑さを必要としない API を迅速に構築するための選択肢

8.

ASP.NET Core Web API

9.

ASP.NET Core Web API Minimal API を使うので、真ん中のチェックは外す)

10.

ASP.NET Core Web API プロジェクト名は、aspnetserver (ソリューション名は任意)にする

11.

ASP.NET Core Web API この状態でデバッグ実⾏

12.

ASP.NET Core Web API この状態でデバッグ実⾏

13.

不要なコードを削除 – Program.cs (Startup.cs は廃⽌) • WeatherForecast 関連のソースコードを全て除去し保存 var builder = WebApplication.CreateBuilder(args); // Add services to the container. // Learn more about configuring Swagger/OpenAPI at https://aka.ms/aspnetcore/swashbuckle builder.Services.AddEndpointsApiExplorer(); builder.Services.AddSwaggerGen(); var app = builder.Build(); // Configure the HTTP request pipeline. if (app.Environment.IsDevelopment()) { app.UseSwagger(); app.UseSwaggerUI(); } app.UseHttpsRedirection(); app.Run();

14.

Entity Framework Core コード作成と 最初の Database ⽣成

15.

Data フォルダーの作成と Sealed Class 作成 Post クラスを Sealed で作成し継承できないようにする

16.

Post Class • attribute として System.ComponentModel.DataAnnotations を追加し、クラスを作成する using System.ComponentModel.DataAnnotations; namespace aspnetserver.Data { internal sealed class Post { [Key] public int PostId { get; set; } [Required] [MaxLength(100)] public string Title { get; set; } = string.Empty; [Required] [MaxLength(100000)] public string Content { get; set; } = string.Empty; } }

17.

NuGet Package 追加 • NuGet Package Manager 起動 • EntityFrameworkCore • EntityFrameworkCore.Design • EntityFrameworkCore.SQLServer を追加 • Entity Framework Core CLI ツールインストール dotnet tool install --global dotnet-ef

18.
[beta]
AppDbContext 作成
• Azure SQL Database 上に AppDB を⽣成しつつ Seed を作成
using Microsoft.EntityFrameworkCore;
namespace aspnetserver.Data
{
internal sealed class AppDBContext : DbContext
{
public DbSet<Post> Posts {get; set;}
protected override void OnConfiguring(DbContextOptionsBuilder dbContextOptionsBuilder)
=> dbContextOptionsBuilder.UseSqlServer("Server=tcp:spaappdev.database.windows.net,1433;
Initial Catalog=AppDb;Persist Security Info=False;UserID=shotaro;Password=(password)#;
MultipleActiveResultSets=False;Encrypt=True;TrustServerCertificate=False;Connection Timeout=30;");
protected override void OnModelCreating(ModelBuilder modelBuilder)
{
Post[] postsToSeed = new Post[6];
for (int i = 1; i <= 6; i++)
{
postsToSeed[i - 1] = new Post
{
PostId = i,
Title = $"Post {i}",
Content = $"これは投稿{i}で、⾮常に興味深い内容です。私はまた、YouTube ビデオを鑑賞するのが好きで、購読している."
};
}
modelBuilder.Entity<Post>().HasData(postsToSeed);
}
}
}

19.

dotnet ef migrations add dotnet ef migrations add 1stMigration -o "Data/Migrations"

20.
[beta]
Entity Framework による DB 作成とサンプルデータ確認
using Microsoft.EntityFrameworkCore.Migrations;
#nullable disable
namespace aspnetserver.Data.Migrations
{
public partial class _1stMigration : Migration
{
protected override void Up(MigrationBuilder migrationBuilder)
{
migrationBuilder.CreateTable(
name: "Posts",
columns: table => new
{
PostId = table.Column<int>(type: "int", nullable: false).Annotation("SqlServer:Identity", "1,
Title = table.Column<string>(type: "nvarchar(100)", maxLength: 100, nullable: false),
Content = table.Column<string>(type: "nvarchar(max)", maxLength: 100000, nullable: false)
},
constraints: table =>
{
table.PrimaryKey("PK_Posts", x => x.PostId);
});
migrationBuilder.InsertData(
table: "Posts",
columns: new[] { "PostId", "Content", "Title" },
values: new object[,]
{
{ 1, "これは投稿 1 で、⾮常に興味深い内容です。私はまた、YouTube ビデオを鑑賞するのが好きで、購読している.", "Post
{ 2, "これは投稿 2 で、⾮常に興味深い内容です。私はまた、YouTube ビデオを鑑賞するのが好きで、購読している.", "Post
{ 3, "これは投稿 3 で、⾮常に興味深い内容です。私はまた、YouTube ビデオを鑑賞するのが好きで、購読している.", "Post
{ 4, "これは投稿 4 で、⾮常に興味深い内容です。私はまた、YouTube ビデオを鑑賞するのが好きで、購読している.", "Post
{ 5, "これは投稿 5 で、⾮常に興味深い内容です。私はまた、YouTube ビデオを鑑賞するのが好きで、購読している.", "Post
{ 6, "これは投稿 6 で、⾮常に興味深い内容です。私はまた、YouTube ビデオを鑑賞するのが好きで、購読している.", "Post
});
}
protected override void Down(MigrationBuilder migrationBuilder)
{
migrationBuilder.DropTable(
name: "Posts");
}
}
}

1"),

1"
2"
3"
4"
5"
6"

},
},
},
},
},
}

21.

dotnet ef database update dotnet ef database update Azure Data Studio

22.

DB操作のためのレポジトリ (PostsRepositry.cs) 作成 using Microsoft.EntityFrameworkCore; namespace aspnetserver.Data { internal static class PostsRepository { internal async static Task<List<Post>> GetPostsAsync() { using (var db = new AppDBContext()) { return await db.Posts.ToListAsync(); } } internal async static Task<bool> UpdatePostAsync(Post postToUpdate) { using (var db = new AppDBContext()) { try { db.Posts.Update(postToUpdate); return await db.SaveChangesAsync() >= 1; } catch (Exception e) { return false; } internal async static Task<Post> GetPostByIdAsync(int postId) { using (var db = new AppDBContext()) { return await db.Posts .FirstOrDefaultAsync(post => post.PostId == postId); } } internal async static Task<bool> CreatePostAsync(Post postToCreate) { using (var db = new AppDBContext()) { try { await db.Posts.AddAsync(postToCreate); } } internal async static Task<bool> DeletePostAsync(int postId) { using (var db = new AppDBContext()) { try { Post postToDelete = await GetPostByIdAsync(postId); db.Remove(postToDelete); return await db.SaveChangesAsync() >= 1; } catch (Exception e) { return false; } return await db.SaveChangesAsync() >= 1; } catch (Exception e) { return false; } } } } } } }

23.

API エンドポイント⽣成

24.

Program.cs 修正 – MapGet 追加(全て) • using aspnetserver.Data を追加し、クラスを作成する using aspnetserver.Data; --app.MapGet("/get-all-posts", async () => await PostsRepository.GetPostsAsync()) .WithTags("Posts Endpoints"); app.Run();

25.
[beta]
Program.cs 修正 – Swagger 修正
• SwaggerDoc を作成する
using aspnetserver.Data;
--builder.Services.AddSwaggerGen(swaggerGenOptions =>
{
swaggerGenOptions.SwaggerDoc("v1", new OpenApiInfo
{ Title = "ASP.NET Core 6 Web API React Sample", Version = "v1" });
});

• Swagger UI を開発環境以外でも 表⽰するように書き換える
app.UseSwagger();
app.UseSwaggerUI(swaggerUIOptions =>
{
swaggerUIOptions.DocumentTitle = "ASP.NET Core 6 Web API React Sample";
swaggerUIOptions.SwaggerEndpoint("/swagger/v1/swagger.json",
"超シンプルな Post モデルを提供する Web API.");
swaggerUIOptions.RoutePrefix = string.Empty;
});

• launchSettings.json の "launchUrl": "swagger" ⾏をコメントアウトする
理由︓HTTP Local Host のみ(起動 URL なし)でアプリが起動し、次にポート番号なしで Swagger が起動するため

26.
[beta]
Program.cs 修正 – MapGet(postId) 追加
• MapGet(postId)、MapPost、MapPut、MapDelete
app.MapGet("/get-post-by-id/{postId}", async (int postId) =>
{
Post postToReturn = await PostsRepository.GetPostByIdAsync(postId);
if (postToReturn != null)
{
return Results.Ok(postToReturn);
}
else
{
return Results.BadRequest();
}
}).WithTags("Posts Endpoints");

27.
[beta]
Program.cs 修正 – MapPost 追加
• MapGet(postId)、MapPost、MapPut、MapDelete
app.MapPost("/create-post", async (Post postToCreate) =>
{
bool createSuccessful = await PostsRepository.CreatePostAsync(postToCreate);
if (createSuccessful)
{
return Results.Ok("作成しました︕");
}
else
{
return Results.BadRequest();
}
}).WithTags("Posts Endpoints");

28.
[beta]
Program.cs 修正 – MapPut 追加
• MapGet(postId)、MapPost、MapPut、MapDelete
app.MapPut("/update-post", async (Post postToUpdate) =>
{
bool updateSuccessful = await PostsRepository.UpdatePostAsync(postToUpdate);
if (updateSuccessful)
{
return Results.Ok("更新しました︕");
}
else
{
return Results.BadRequest();
}
}).WithTags("Posts Endpoints");

29.
[beta]
Program.cs 修正 – MapDelete 追加
• MapGet(postId)、MapPost、MapPut、MapDelete
app.MapDelete("/delete-post-by-id/{postId}", async (int postId) =>
{
bool deleteSuccessful = await PostsRepository.DeletePostAsync(postId);
if (deleteSuccessful)
{
return Results.Ok("削除しました︕");
}
else
{
return Results.BadRequest();
}
}).WithTags("Posts Endpoints");

30.

実⾏結果確認 • MapGet(postId)、MapPost、MapPut、MapDelete が表⽰され、試せる

31.

React プロジェクトの作成

32.

React シングルページアプリケーションの作成 • Terminal でルートフォルダに移動 • コマンドでフォルダと React プロジェクトを⽣成する npx create-react-app reactclient cd reactclient npm start • React ディレクトリに移動し git 関連を削除(全体で作成するため)し、VSCode を起動 sudo rm -r.git code ./

33.

Visual Studio Code の起動と設定 • Terminal を開き下記のコマンドを打つ npm install --save -cross-env • 実⾏ (port 3000) npm start

34.
[beta]
Visual Studio Code の拡張機能追加とファイルの整理
• 拡張機能を追加(任意)
•
•
•

•

Bracket Pair Colorizer 2 v0.2.2
Prettier
VS Code ES7
React/Redux/React-Native/JS
snippets
Material Icon Theme

• 不要なファイルの削除
•
•
•
•
•
•

setupTests.js
reportWebVitals.js
logo.svg
index.css
App.Test.js
App.css

• Index.js の編集
•

制限モード削除

ReactDOM.render(<App />,document.getElementById('root'));
•

reportWebVitals();、import reportWebVitals from ʻ./reportWebVitalsʻ;、import './index.css'; 削除

35.
[beta]
CORS ポリシーの追加
• Server – Program.cs
builder.Services.AddCors(options =>
{
options.AddPolicy("CORSPolicy",
builder =>
{
builder
.AllowAnyMethod()
.AllowAnyHeader()
.WithOrigins("http://localhost:3000",
"https://appname.azurestaticapps.net/");
});
});

36.

React アプリで実装する内容と実⾏結果 • Bootstrap の追加 • 投稿をテーブルで表⽰ • サーバープロジェクト側の CORS ポリシー追加 • テーブルにデータを表⽰ • API エンドポイント付き定数 ファイル • データ新規追加フォーム コンポーネントの作成 • データ更新フォーム コンポーネントの作成 • データの削除

37.

Azure App Service にサーバを公開

38.

Visual Studio 2022 for mac で Azure に公開 • Wizard を使⽤してホスティングプランは F1- Free に変更しながら deploy https://aspnet6webapireactsample.azurewebsites.net/index.html

39.

Azure Static Web App + GitHub Actions で React を公開

40.

Azure Static Web Apps • 静的サイトに最適化されたホスティング環境 • CI/CD を GitHub Actions と統合 • Azure Functions によるサーバーレス API の統合 Microsoft Azure www

41.

Azure Static Web Apps の機能 Web API + リッチな Web UI を実現する機能を提供 • • • • • • GitHub 統合 統合 API サポート Web アプリケーションの構築 静的サイトの発⾏ Web アプリケーションのデプロイ 認証プロバイダーの統合 • Azure Active Directory、Facebook、 Google、GitHub、 Twitter

42.

JavaScript / C# による静的 Web サイトの開発・ホスト https://... + JS https://... + Blazor

43.

Azure Static Web App と GitHub Actions ワークフロー • Azure Static Web Apps では、必要なすべての Azure リソースのプロビジョニングが ⾃動的に実施 • アプリをホストする前、変更を⾏う際、アプリをビルドするためのリポジトリへのコミットま たは pull request によって⾏う必要あり • Azure Static Web Apps の主な機能としてアプリケーションをビルドして発⾏するため の GitHub Actions ワークフローを設定できる • Azure Static Web Apps リソースを作成すると、GitHub Actions ワークフローが 作成される • ワークフローはすぐにトリガーされ、アプリのビルドと発⾏が⾏われる • リポジトリ内の監視対象ブランチに変更を加えるたびに、ワークフローがトリガーされる

44.

Azure Static Web Apps 2つの⾃動化された側⾯ 1.アプリを構成する基になる Azure リソースのプロビジョニング 2.アプリケーションをビルドして発⾏する GitHub Actions ワークフロー • Azure Static Web Apps で Web にアプリを発⾏すると、 Web アプリとスケーラブルな API のホストが⾼速になる • GitHub Actions によって提供される統合ビルドおよびデプロイ ワークフローが得られる

45.

Static Web Apps インスタンスを GitHub に接続 • Static Web Apps インスタンスを作成する には、GitHub にサインインし、アプリのコード が含まれているリポジトリを指定 • アプリを⾃動的にビルドしてデプロイできるよう に、リポジトリ内に3つのフォルダーパスを指定 • アプリのビルド出⼒はアプリケーションのビルド 出⼒ディレクトリへの相対パス • 例︓ビルドされた資産を my-app/dist フォル ダーに出⼒するアプリが my-app にある場合、 この場所には dist を指定 • ビルドの詳細画⾯でビルドのプリセットを選択 • React を選択すると⾃動的に • アプリの場所 • アプリのビルド出⼒の場所 • API の場所 の3つに値が⼊⼒される 今回は / 直下ではなくて /reactclient にしないと動かない ので注意︕

46.

GitHub Actions を使⽤してソースコードから静的資産へ • GitHub リポジトリにはソース コードが格納され、発⾏する 前にビルドする必要あり • Static Web Apps インスタンスを作成すると、⾃動的にリ ポジトリに GitHub Actions ワークフローが作成される • このワークフローによって、追跡するように選択したブランチに 対して変更内容をプッシュしたり、pull request を作成し たりするたびに、アプリがビルドされる。これにより、ソースコー ドが静的資産に変換され、Azure によって提供される • ビルドが完了すると、アクションによって資産がデプロイされる • その GitHub アクションはリポジトリ の .github/workflows フォルダーに追加される • 必要に応じて、このファイルを確認または変更できる • リソースの作成時に⼊⼒した設定は、GitHub アクションの ファイルに保存される

47.

Azure Functions と統合された API • API が必要な場合 • Azure Functions プロジェクトとしてリポジトリ 内に実装できる • API は⾃動的にデプロイされ、Static Web Apps インスタンスによってホストされる • GitHub Actions ワークフローによって、指定 したフォルダーの名前でリポジトリ内の API が 検索される • 通常、API アプリは api または functions と いう名前のフォルダーに配置されるところ、好きな 名前を付けることができる • 指定したフォルダー内に API が検出され ない場合 • API は発⾏されず、アプリのみ発⾏される 例︓ https://docs.microsoft.com/ja-jp/learn/modules/publish-static-web-app-api-preview-url/3-build-api

48.

GitHub Actions を使⽤してソースコードから静的資産へ • GitHub リポジトリの [Actions](アクション) ページに移動し、ビルドおよびデプロイアクションの 状態を確認できる • • • • Visual Studio Code エディターで 例︓my-first-static-web-app を右クリックし[ポータルで開く] [Azure Static Web Apps CI/CD] を選択 ci: add Azure Static Web Apps workflow file のようなタイトルのついた最上位のコミットを選択 左にある [Build and Deploy Job]リンクを選択。ここから、ビルド時にアプリの進⾏状況を確認できる

49.

Web サイトを表⽰する • GitHub アクションによって Web アプリのビルドと発⾏が完了すると実⾏中のアプリを参照して 確認できる • Azure portal の [URL] リンクを選択して、ブラウザーでアプリにアクセス

50.

CORS ポリシーの修正

51.
[beta]
CORS ポリシーの修正
• Server – Program.cs
builder.Services.AddCors(options =>
{
options.AddPolicy("CORSPolicy",
builder =>
Azure Static Web Apps に
{
デプロイ後に決まるので最初は
builder
~appname.azurestaticapps.
.AllowAnyMethod()
net ~ 等にしておく︕
.AllowAnyHeader()
.WithOrigins("http://localhost:3000",
"https://pine-tree-04bf7ae98.2.azurestaticapps.net/");
});
});

• Client – Constants.js
const API_BASE_URL_DEVELOPMENT = 'https://localhost:7293';
const API_BASE_URL_PRODUCTION = 'https://net6webapireactsample.azurewebsites.net/';

52.

Elastic APM によるアプリケーションの監視

53.

今回のデモアプリのイメージ iOS / Android Mobile App Azure Static Web Apps Azure App Service React Web App ASP.NET 6 Web API Azure SQL Database React Native Elastic APM Agent CRUD 全⽂検索クエリ Elastic APM Agent Elastic APM Endpoint に送信 React Web App Elastic Cloud 検索・更新 UI Visual Studio 2022 for Mac https://f79...c67.japaneast .azure.elasticcloud.com:9243/ Azure Data Explorer 東⽇本リージョン マスターノード x 1 データノード x 2 ML ノード x 1 Azure サブスクリプション

54.

Elastic Cloud に CORS を設定 • elasticsearch.yml # Note that the syntax for user settings can change between major versions. # You might need to update these user settings before performing a major version upgrade. # # Slack integration for versions 7.0 and later must use the secure key store method. # For more information, see: # https://www.elastic.co/guide/en/elasticsearch/reference/current/actionsslack.html#configuring-slack (中略) # from: Watcher http.cors.enabled: true http.cors.allow-credentials: true http.cors.allow-origin: "*" http.cors.allow-headers: X-Requested-With, X-Auth-Token, Content-Type, Content-Length, Authorization, Access-Control-Allow-Headers, Accept # # HipChat and PagerDuty integration are also supported. To learn more, see the documentation.

55.

APM Real User Monitoring JavaScript Agent Reference • 概要 • • https://www.elastic.co/guide/en/apm/agent/rum-js/5.x/index.html React Integration • https://www.elastic.co/guide/en/apm/agent/rum-js/5.x/reactintegration.html#react-integration npm install @elastic/apm-rum-react –save import { ApmRoute } from '@elastic/apm-rum-react’ import { withTransaction } from '@elastic/apm-rum-react'

56.

Elastic Cloud → Kibana で APM モニタリング https://cloud.elastic.co/home

57.

まとめ

58.

まとめ l l l l l l l l API プロジェクトの作成 Entity Framework Core コード作成と最初の Database ⽣成 API エンドポイント⽣成 React プロジェクトの作成 Azure App Service にサーバを公開 Azure Static Web App + GitHub Actions に React を公開 CORS ポリシーの修正 Elastic APM によるアプリケーションの監視

59.

リソース • チュートリアル: ASP.NET Core で Minimal Web API を作成する https://docs.microsoft.com/ja-jp/aspnet/core/tutorials/min-web-api?view=aspnetcore-6.0&tabs=visual-studio • Entity Framework Core ツールのリファレンス - .NET Core CLI https://docs.microsoft.com/ja-jp/ef/core/cli/dotnet • Create React App: https://reactjs.org/docs/create-a-new-react-app.html • ASP.NET Core で React プロジェクト テンプレートを使⽤する https://docs.microsoft.com/ja-jp/aspnet/core/client-side/spa/react?view=aspnetcore-6.0&tabs=visual-studio • Install Bootstrap to React: https://create-react-app.dev/docs/adding-bootstrap/ • GitHub Actions のワークフロー構⽂ https://docs.github.com/ja/actions/using-workflows/workflow-syntax-for-github-actions

60.

Elastic リソース • 公式ドキュメント • APM https://www.elastic.co/guide/index.html https://www.elastic.co/jp/apm/ • クラウドネイティブ アプリでの Elasticsearch • Configuration on .NET Core https://docs.microsoft.com/ja-jp/dotnet/architecture/cloudnative/elastic-search-in-azure https://www.elastic.co/guide/en/apm/agent/dotnet/current/co nfiguration-on-asp-net-core.html • Azure での検索データ ストアの選択 • ASP.NET Core Quick Start https://docs.microsoft.com/ja-jp/azure/architecture/dataguide/technology-choices/search-options • Elastic APM Agent https://www.elastic.co/guide/en/apm/agent/index.html https://www.elastic.co/guide/en/apm/agent/dotnet/current/set up-asp-net-core.html

61.

Elastic Community Conference on Feb. 11-12, 2022 https://sessionize.com/elastic-community-conference/ Japan Track が公開予定︕ (⽇本からスピーカー4社5名が 登壇予定)

62.

Elastic Meetup https://www.meetup.com/ja-JP/Tokyo-Elastic-Fantastics/events/283113192/

63.

Developers Summit 2022 https://event.shoeisha.jp/devsumi/20220217/session/3724/ デジタルカスタマーエクスペリエンスの向上 - Enterprise Search と Observability Web サイトやモバイルアプリをスムースに運営し、購⼊からカスタマーサポートまで顧客との繋がりを⼤切にするには、検索機能や可観測性の強化が、カスタマーエクスペリエンス向上のための 秘策です。Elastic はオープンでフリーな超⾼速検索エンジンとデータの出⼊⼒インターフェースから構成され、あらゆるパブリッククラウドにデプロイできる、業界をリードする検索・分析プラット フォームです。Elastic により企業や個⼈は魅⼒的な顧客 Web サイト体験やモバイルアプリ体験を提供できます。このセッションでは、Elastic による実装をサンプルアプリのデモを交えなが らご紹介していきます。

64.

Thank you for your attention!