Marp で上詰めにする方法

Marp でスライド作るのを色々試してるのですが、全体的にコンテンツを上下方向で中央寄せになってるのが気になりました。 なんとなく上からコンテンツを詰めていくようにしてほしい。ということで section タグに以下のようなスタイルを当てることでパワポのように上からコンテンツを配置するようになりました。 section { justify-content: start; } 元のように中央寄せにしたい場合は justify-content: center; にすれば OK です。

ReactiveProperty v6.0.2 をリリースしました

しました。 Release v6.0.2 · runceel/ReactiveProperty · GitHub メジャーバージョンが上がってます ということで、1 つ破壊的変更があります。 これまで WPF では EventToReactiveCommand と EventToReactiveProperty を使うのに Blend SDK のアセンブリの Behavior を使用していました。 この Blend SDK は Visual Studio 2019 から同梱されなくなっていて、公式の NuGet パッケージもない状態になりました。そのため、それを置き換える OSS の Beha…

ASP.NET WebForm に Vue.js を入れてみよう

Vue.js は Progressive なので出来るでしょう。 プロジェクトの作成 ASP.NET WebForm のプロジェクトを作ります。凄く久しぶりなのですが、普通に ASP.NET Web Application のプロジェクトテンプレートの中の選択肢にありました。 Scripts フォルダーに vue.js をコピーして下準備完了です。 Default.aspx の変更 このページは Vue.js で作る！という意気込みで行くなら簡単です。Scripts フォルダーに default.js を追加して、以下のような感じで Default.aspx を編集します。 <%@ Page …

WPF の TreeView で任意の項目が表示されるようにスクロールする

というネタを見つけたのでやってみます。久しぶりの WPF ネタ！因みにせっかくなので .NET Core 3.0 Preview 7 で VS2019 Preview 使ってやってみます。 表示用データはこれ！ using System; using System.Collections; using System.Collections.Generic; using System.Text; namespace TreeViewScrollSample { public class Person { public string Name { get; set; } public IEnume…

Marp を使ってスライドを作ってみる

三宅さんに教えてもらったものを使ってみました。 https://t.co/G5w8TNlpEiですね— k-miyake (@kazuyukimiyake) July 21, 2019 Marp というものですが、調べてて気を付けないといけないなと思ったのは最近作り直されたみたいなので、何か調べるときは新しいほうを当たるようにしたほうがよさそうです。 各種機能はこちらから。 marpit.marp.app ちょっと見た目カスタマイズしたい！ テーマ作ることも出来るみたいなのですが、まだ VSCode の拡張機能のテーマ対応は絶賛作り中みたいです。なので、今回は style で指定する方法でやっ…

Marp 使う時に見るもの

marpit.marp.app

縦横スクロールつきのテーブルを Web で使いたい

むか～～しむかし、Flash や Silverlight みたいなブラウザープラグイン系のリッチクライアントアプリケーションのプラットフォームと HTML 5 が覇権を争ってた時代がありました。私はブラウザープラグイン寄りの人で「DataGrid コントロールがあるだけでプラグイン系のほう使うわ」って思ってました。 やりたかったことは 表形式でデータを表示したい 表を縦横スクロールしたい スクロールしても固定列や固定行はスクロールしないで欲しい JavaScript で頑張ることで当時でもできてましたが、結構しんどかったら重めだったりと何かと問題がおきがちだった気がするので例えば <DataG…

Azure API Management を使って Azure Functions に認証つけてみた

とりあえず API Management + Azure AD B2C による認証をトライしてみようと思います。 あ、注意点としては、この手順を実施しても Azure Functions 自体は認証キーによる認証で保護してるだけなので、認証キーばれたら叩かれる感じではあります。 Azure AD B2C 作ろう Azure ポータルから Azure Active Directory B2C を作ります。 まず 新しい Azure AD B2C テナントを作成します から作成します。 作成時に国とリージョン選びますが日本はないので、ここらへんのドキュメントを参考に… docs.microsoft…

続：Postman 使ってたけど VSCode の REST Client に乗り換えた

超適当に書いた記事に限ってブクマが伸びる件について。400超えって…。 REST Client って自分の用途的には、非常にシンプルな REST API を Visual Studio Code を使う機会が多い環境で別途ソフトウェアを立ち上げることなくテストできて、しかもテキストファイルに保存しておけるという点がポイント高い感じでした。 blog.okazuki.jp とまぁブクマがたまると何がいいって自分ならこうしてるという意見がたくさん拾える！！ということで気になったものをいくつか試してみたいと思います。 Chrome の Copy as cURL Chrome の開発者ツールの Net…

全てサーバーレス + 全て C# で SPA

DB に Cosmos DB を使って Azure Functions を使って少ないコードで読み書きする API を作って API Management で CORS の設定と Open API の定義を作って Blazor で AutoRest で生成したクライアントを使って API を呼ぶ SPA を作ってストレージアカウントの静的 Web サイトに置いて動かしてみました。 以下のような感じの構成ですね。 動いてるところはこんな感じ。この動画ではわかりませんが、ちゃんとクライアントサイド Blazor です。 youtu.be コードは下に置いてますが、ARM Template などは用…

REST API のテストに Postman 使ってたけど Visual Studio Code の REST Client に乗り換えた

くっ、名前だけ知ってたけどこんなの便利だとは…！！ marketplace.visualstudio.com Azure API Management の Visual Studio Code 拡張機能で API のテスト呼び出しに REST Client が使われてるので使い始めてみたのですが「あっ、ハイ。便利っすね…」という感想しか出てこないくらい便利でした。 普通に HTTP のリクエストをテキストで用意しておくと Send Request 押すだけでレスポンスを出してくれる…。 先人の方々が沢山紹介してくれてる記事があるので詳しい使い方とか推しのポイントはそちらを見るとわかりやすいと思…

Azure の機能を使った野良ハンズオン資料の紹介

id:himanago さんの Qiita (Qiita のアカウントは @himarin269) の記事にいくつか Azure を使ったハンズオン資料があります。 全てサーバーレスサービスで Web アプリ作成 DB に Cosmos DB、API に Azure Functions、Web アプリのホストに Storage Account を使ったサーバーレス構成での Web アプリを作るハンズオンです。 Jazug Night でやるつもりのデモと、ほぼ同じ構成でびっくりしました（使う言語とかは違うけど…） qiita.com Amazon Alexa, Google Assistant…

TypeScript で Jest 使ってみた

TypeScript(というか JavaScript) のユニットテストって何がいいのかなぁというのがわからなかったので、とりあえず自分の観測範囲でよくみる感じの Jest 試してみました。 とりあえずシンプルに以下のコマンドをうってコンソールで始めてみようと思います。 npm init -y tsc --init npm i -D jest npm i -D @types/jest npm i -D @types/node tsconfig.json に "outDir": "./dist", を設定してビルド結果が dist フォルダーに出るようにします。そして package.json …

Vue.js で Router 使ってみよう

Router 使うと簡単に画面遷移するアプリ作れるってことで試してみましょう。 まぁ、Vue.js は公式ドキュメントがとてもよくて、さらには日本語もあって読みやすい！！なので、公式みたらわかるようになってるのですが、とりあえず試してみたログということで。 ちなみに Vue Router のドキュメントはこちら router.vuejs.org Router のないプロジェクトを Vue CLI で作ろう とりあえずサクッと作ります。Router のない TypeScript のプロジェクトを作りました。とりあえず現状の最新の Vue CLI 3.9.2 でやってます。 $ vue creat…

Windows デスクトップアプリ開発と消えた Prism for Windows (Prism は消えてないよ)

これの続きです。 blog.okazuki.jp Prism for Windows(UWP) って書いてるけど MVVM アプリって何で作ったらいいんだっていう感じのコメントがついてるので事実だけを淡々と Prism は以下のプラットフォーム向けに提供されていた WPF Xamarin.Forms UWP これがこうなった WPF Xamarin.Forms 以上 UWP...? UI テクノロジーという意味では、今後開発リソースが注がれる Windows UI Library がメインストリームとなるという感じです。OSS で GitHub 上で開発されています。 ロードマップも出ています…

C# で完全サーバーレスで SPA とバックエンドを作れるようになりますね

Azure API Management の従量課金プランが GA しました。 azure.microsoft.com つまり… Azure Storage Account の静的 Web サイトホスト機能で SPA をホスト Azure Functions の HttpTrigger で処理を作成 Azure API Management で Azure Functions を SPA 向けに公開 Azure Cosmos DB にデータをストア つまり、以下のような感じですね。 全部サーバーレスでいける！！ まぁ、でも実際にはステージング環境とかを、この構成で準備するの個人的にだるいんで …

Prism for Windows(UWP) が消えてた

github.com ということで近い将来 Prism 7 系で UWP サポートは無いということで…。 コメントへの返信 ブクマで疑問文投げてくる人に公式で返信する手段が欲しいところ。あるのかな？ もう、UWP は Windows 10 の唯一のデスクトップアプリ開発の投資先ではなくなった (今後は OSS の Windows UI Library で UWP, WPF, Win32, etc.. を対象に機能が追加される) ので、もしデスクトップアプリ開発をするのでしたら自分のスキルセットと使いたい機能へのアクセスのしやすさを鑑みて好きなのを使うといいと思います。

Bot Framework SDK 4.4.3 時点でのボット作成の最小手順からダイアログまで

Bot Framework SDK (Bot Builder SDK?) v4 で v3 から大きく実装方法が変わったわけですが、結構 v4.1, 4.2, 4.3, 4.4... と進んでいくうちに、意外と v4 当初の作り方が非推奨になったりしてしょんぼりすることがあったので v4.4.3 時点での Bot Framework SDK の推奨っぽい土台作りを見てみようと思います。 ASP.NET Core は現段階での LTS の 2.1 を使ってみます。 ASP.NET Core Web アプリケーションから始めてみる Bot Framework のプロジェクトテンプレートは最初から設定…