タスク管理を行うSPAを"C#で"作ってみた / I made a task management SPA "in C#".

タスク管理を行うSPAを"C#で"作ってみた / I made a task management SPA "in C#".

2020/05/09(土)第4回バーチャル学生LT On YouTube LIVE
Connpass -> https://student-lt.connpass.com/event/174185/
作ったToDoリストアプリ -> https://todomanager-7196c.web.app/

748cf16e1d5fdb508f9725cd91fe1768?s=128

Atria

May 09, 2020
Tweet

Transcript

  1. タスク管理を行うSPAを "C#で"作ってみた。 Blazor WebAssembly を用いたSPA開発 Speaker:@AtriaSoft 2020/05/09(土)第4回バーチャル学生 LT On YouTube

    LIVE
  2. スライドの撮影 SNSへの投稿OK Speaker : @AtriaSoft Speaker:@AtriaSoft

  3. Atria(あとりあ)です。 • 公立はこだて未来大学B2 – 北海道にある情報系大学! • C#が大好き なんでもC#で書く悪い癖持ち • 最近Blazorにドハマリしています

    • オンライン授業まだ慣れてない • 早く大学行って精進したい @AtriaSoft http://atriasoft.work/ Atria64 Speaker:@AtriaSoft
  4. Atria(あとりあ)です。 • 公立はこだて未来大学B2 – 北海道にある情報系大学! • C#が大好き なんでもC#で書く悪い癖持ち • 最近Blazorにドハマリしています

    • オンライン授業まだ慣れてない • 早く大学行って精進したい @AtriaSoft http://atriasoft.work/ Atria64 Speaker:@AtriaSoft
  5. Speaker:@AtriaSoft

  6. Atria(あとりあ)です。 • 公立はこだて未来大学B2 – 北海道にある情報系大学! • C#が大好き なんでもC#で書く悪い癖持ち • 最近Blazorにドハマリしています

    • オンライン授業まだ慣れてない • 早く大学行って精進したい @AtriaSoft http://atriasoft.work/ Atria64 Speaker:@AtriaSoft
  7. オンライン授業、どうですか? Speaker:@AtriaSoft

  8. オンライン授業、どうですか? 直接触れられない分 課題の管理が難しくなった アクセスしなきゃいけない ページが多い 学習プラットフォームが 統一されてない 授業の存在を忘れてた…

  9. オンライン授業、どうですか? 直接触れられない分 課題の管理が難しくなった アクセスしなきゃいけない ページが多い 学習プラットフォームが 統一されてない 授業の存在を忘れてた… さまざまな 問題がある

  10. 全部まとめる “オレオレ”タスク管理ツールがほしい Speaker:@AtriaSoft

  11. 作ろう Speaker:@AtriaSoft

  12. Speaker : @AtriaSoft Blazorで Webアプリ作ってみた Speaker:@AtriaSoft

  13. Speaker : @AtriaSoft Blazor Speaker:@AtriaSoft

  14. Blazor Speaker : @AtriaSoft C# でSPA開発ができる今熱いフレームワーク! • オープンソースのフレームワーク • かなり新しい技術

    • Razor構文で記述できる(ASP.NET利用者に優しい) • 豊富な.NET資産を使える(多くのライブラリやNuGet) Speaker:@AtriaSoft
  15. Blazor Speaker : @AtriaSoft C# でSPA開発ができる今熱いフレームワーク! • オープンソースのフレームワーク • かなり新しい技術

    • Razor構文で記述できる(ASP.NET利用者に優しい) • 豊富な.NET資産を使える(多くのライブラリやNuGet) シングルページアプリケーション (Single Page Application) 単一のWebページでアプリケーションを構成する 設計構造の名称 「なんかいい感じのやつ」と捉えておけばいいと思います Speaker:@AtriaSoft
  16. できたもの Speaker:@AtriaSoft

  17. 円グラフで進捗状況を表示 その他雑多な機能ふたつ Speaker:@AtriaSoft

  18. タスクの状況は このように確認できる Speaker:@AtriaSoft

  19. アプリについての 説明ページも作成 Speaker:@AtriaSoft

  20. スマートフォンなど 小さい画面にも対応 アプリケーションのURL https://todomanager-7196c.web.app/ PWA対応はできてません (頑張れば対応できます) Speaker:@AtriaSoft

  21. Blazorの”ポテンシャル” 感じますよね? Speaker:@AtriaSoft

  22. どういう仕組みなの? Speaker:@AtriaSoft

  23. JavaScriptの代わりに .NETでUIを構築している DOM Speaker:@AtriaSoft

  24. DOM JavaScriptの実装無しで SPA開発が可能 JavaScriptの代わりに .NETでUIを構築している Speaker:@AtriaSoft

  25. DOM JavaScriptの実装無しで SPA開発が可能 ただし複雑なことを やるならJavaScriptの実装が必要… JavaScriptの代わりに .NETでUIを構築している Speaker:@AtriaSoft

  26. DOM JavaScriptの実装無しで SPA開発が可能 ただし複雑なことを やるならJavaScriptの実装が必要… 逆を取れば、 JavaScriptを呼び出せばなんだってできる JavaScriptの代わりに .NETでUIを構築している Speaker:@AtriaSoft

  27. Blazorの紹介 Speaker:@AtriaSoft

  28. Blazorで用いる“Razor構文”は C#とhtml/cssの融合系 • Razor->レイザー(かっこいいね) • “@”を起点として C#コードを混ぜて記述できる • 条件分岐や 繰り返しはお手のもの

    • ラムダ式だって使えちゃう • 慣れるとめちゃくちゃ便利 Speaker:@AtriaSoft
  29. UIコンポーネントが充実 • 標準でBootstrapが使える • 今回の開発には Radzen-Blazorを使った。 – なんと無料! • .NETにはNuGet

    があるので導入が超簡単 Speaker:@AtriaSoft
  30. Blazorが可愛がられている .NET Conf Focus on Blazor Blazorオンリーイベント、MSがかなり力入れてる

  31. Blazorの未来 BlazorはWebからDesktop+Mobileへ Speaker:@AtriaSoft

  32. [News]Blazorでモバイルネイティブ? • Mobile Blazor Bindings – まだ試験段階 – Blazorの感覚でモバイルネイティブアプリが作れる –

    それもクロスプラットフォームで作れる • 新規開拓分野 • (走らせた感想)結構ちゃんと動いた • 興味を持ってほしい ※2020/05/09時点での情報です Speaker : @AtriaSoft Speaker:@AtriaSoft
  33. Blazorまとめ • Blazorを使うと”C#”でSPA開発が可能 – フロントエンド、バックエンドをC#で一貫して書ける • 豊富な.NETの資産を利用できる • 難しいことしなければC#の知識だけで組めるかも •

    C#からJavaScriptを呼び出すこともできる – つまり理論上不可能なことがない(はず) • 将来性があり、めちゃくちゃ熱い – 派遣握れるポテンシャルある気がする Speaker:@AtriaSoft
  34. Blazorまとめ • Blazorを使うと”C#”でSPA開発が可能 – フロントエンド、バックエンドをC#で一貫して書ける • 豊富な.NETの資産を利用できる • 難しいことしなければC#の知識だけで組めるかも •

    C#からJavaScriptを呼び出すこともできる – つまり理論上不可能なことがない(はず) • 将来性があり、めちゃくちゃ熱い – 派遣握れるポテンシャルある気がする Speaker:@AtriaSoft
  35. Blazorまとめ • Blazorを使うと”C#”でSPA開発が可能 – フロントエンド、バックエンドをC#で一貫して書ける • 豊富な.NETの資産を利用できる • 難しいことしなければC#の知識だけで組めるかも •

    C#からJavaScriptを呼び出すこともできる – つまり理論上不可能なことがない(はず) • 将来性があり、めちゃくちゃ熱い – 派遣握れるポテンシャルある気がする Speaker:@AtriaSoft
  36. Blazor流行れ Speaker:@AtriaSoft

  37. タスク管理を行うSPAを "C#で"作ってみた。 Blazor WebAssembly を用いたSPA開発 Speaker:@AtriaSoft 2020/05/09(土)第4回バーチャル学生 LT On YouTube

    LIVE