サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
都知事選
webbibouroku.com
[WPF,Prism] RegionManagerによる画面遷移方法まとめ 2021.09.20 C# C#, Prism, WPF Prism で RegionManager を使った画面遷移方法 Navigation Using the Prism Library for WPF | Prism WPF でよく使われるフレームワーク Prism の提供する RegionManager を使った画面遷移方法の使い方をまとめます。 今回は Prism のテンプレートを使用して作成したプロジェクトをサンプルとして用います。 Region の基本 Prism では Region という表示領域を管理し、そこに表示するコンポーネント(UserControll)を RegionManager という管理クラスで切り替えることができます。 例えば “ViewA” と “ViewB” という名前の U
[Python] pytest でモックを使う方法(pytest-mock) 2021.02.12 Python pytest, pytest-mock, Python, テスト pytest でモックを利用する pytest を利用してテストをコーディングする場合にモックを利用したい場合、pytest-mock というライブラリを使うと便利です。 pytest-mock は mock パッケージの薄いラッパーを提供します。 この記事では pytest-mock を使ったいろいろなモックの使い方を紹介します。 pytest の基本的な使い方は以下の記事にまとめてます。 [Pytest] pytest 入門、テストコードを書く方法 │ Web備忘録 モックを利用するとテスト用で一時的に処理を差し替えてくれます。モック化した箇所は対象のテスト中においてのみモックとして扱われ、それ以外のテストで
DI(依存性注入) とは 依存性の注入 – Wikipedia Dependency Injection は日本語で依存性注入、あるいは略して DI と呼ばれます。 DIはコンポーネント間における依存関係を薄くすることで、単体テストをやりやすくしたり、他機能への依存度を低下させてコンポーネント化を促進する狙いがあります。 この記事ではC#で ServiceCollection を使用したDIの実現方法をまとめます。 ServiceCollection で DI(依存性注入) 前述の通りテストしやすいコードや保守性、拡張性の高いコードを書くためには DI(依存性注入) を使うとよいです。 C#だと ServiceCollection クラスが提供されており、これを使って実現可能です。 ServiceCollection クラス (Microsoft.Extensions.Dependency
[Linux] ln シンボリックリンクとハードリンクの違いと作り方 2021.03.19 Linux Linux, ln, コマンド, シェル, シンボリックリンク, ハードリンク シンボリックリンクとハードリンクの違い Linux(Unix)ではファイルシステム上のファイルやディレクトリのデータとその名前を結びつけるリンクがあり、ハードリンクとシンボリックリンクの2種類があります。 Linux では ln コマンド使用するとリンクを作成できます。ここではシンボリックリンクとハードリンクの違いをまとめたのち、ln コマンドの簡単な使い方をまとめます。 シンボリックリンク(ソフトリンク) ソフトリンク – Wikipedia シンボリックリンク は Windows だとショートカット、Mac だとエイリアスのことです。本体であるファイルやディレクトリが位置する場所とは別に、その本体に対する
pytest とは pytest: helps you write better programs — pytest documentation pytest は Python のテストツールの1種です。Python には unittest とという標準ライブラリのテストツールがありますが、より Python らしくテストコードを書くことができるのが pytest の特徴です。 pytest は小規模なテストコードの作成から複雑なテストコードの拡張まで対応できる優秀なツールであり、Python のデファクトスタンダードとなっているテストツールでもあります。 pytest のインストール pip 経由で pytest をインストールします。 $ pip install pytest pytest テストコードの基本 pytest は test_*.py もしくは *_test.py という名
[Android] エミュレーターがフリーズしたり起動しないときの対処法 2019.04.06 Android Android, Android Studio, エミュレーター Android エミュレーターがフリーズした Android アプリ開発を行っている際、エミュレーターがフリーズして動かなくなることがありました。 具体的にはエミュレーター自体は立ち上がるのですが、操作を一切受け付けいないというような状況です。 この状態で操作を受け付けなくなってしまいました。 上のような状態でフリーズするのでアプリの動作が確認できずに困ってしまいました。調べてみると、Android Studio からエミュレーターを初期化しなければどうにもならないみたいです。 ということでその方法をまとめます。 Android エミュレーター初期化の手順 まずは、Android Studio を起動し AVD M
sed コマンドで改行コードを置換したり削除したい GNU sed – GNU Project – Free Software Foundation sed コマンドはテキストをフィルタリングしたり操作するためのコマンドです。テキストファイルから入力を受け取り、何らかの操作を実行し結果を出力します。直接操作結果でファイル内容を変更することも可能です。 今回は改行コード(CRLF, LF)を置換するために sed コマンドを使う方法をまとめます。 結論 先に結論だけ知りたい人は以下をどうぞ。 CRLF -> LF sed -i 's/\r//g' input.txt sed -i -z 's/\r\n/\n/g' input.txt LF -> CRLF sed -i 's/$/\r/g' input.txt sed -i -z 's/\n/\r\n/g' input.txt CRLF, L
シェルスクリプトで使用されるカッコいろいろ シェルスクリプト(コマンド)で使われるカッコにはそれぞれ異なる文法上の意味があります。ここでは8種類のカッコの使い方についてまとめます。 [] 角括弧、bracket、ブラケット [[]] 二重角括弧、double bracket、ダブルブラケット () 丸括弧、parenthesis、パーレン (()) 二重丸括弧、double parenthesis、ダブルパーレン $() ドル丸括弧、ドルパーレン $(()) ドル二重丸括弧、ドルダブルパーレン {} 波括弧、brace、ブレース ${} ドル波括弧、ドルブレース [] 角括弧、bracket、ブラケット [] ブラケットは test コマンドど等価のコマンドです。 【 test 】コマンド(基礎編)――ファイルの有無などを判定する:Linux基本コマンドTips(221) – @IT te
M1 macbook 初期設定と環境構築でやることまとめ [Node][Rust] 2021.04.12 Mac Apple, M1, Mac, 環境構築 M1 macbook の初期設定としてやることまとめ 先代 macbook の電源が壊れて充電できなくなったので新しい mac を購入することになりました。ということで M1 チップ搭載の新型 macbook air が手に入ったので必要な初期設定や環境構築をまとめます。 いろいろと設定したので忘れないようにまとめておきます。 とりあえず最終的に Node と Rust を動かしたいので、それを最終目標にして、その他最低限使いたいアプリケーションを入れていきます。 ちなみに Python も動かしたいですが、元から 3.8.2 と 2.7.16 が使用可能なので別途インストールはしません。もし開発用途で使用するなら、pyenv なりをイ
Python でタイムアウト Python で実装した処理が一定時間以上経過しても終了しない場合、強制的に終了するような制御(タイムアウト)を実装する方法をまとめます。実装方法は幾つかありますが、非同期処理なのか同期処理なのかで実装方法や挙動が変わってくるので注意が必要です。 非同期処理をタイムアウト制御する方法 高水準の API インデックス — Python 3.9.1 ドキュメント タイムアウトになるとタスクがキャンセルされる実装 まず非同期処理(awaitできる処理)については簡単です。標準ライブラリの asyncio で wait_for というタイムアウトが制御できる機能が提供されています。これを使えば指定時間内で非同期処理が終わらない場合、タイムアウト例外が発生し、実行中の処理が中断されます。 例えば次のような時間のかかる見込みのある非同期関数(heavy_work)が存在す
AtCoderで水色コーダーになりました AtCoderは毎週定期的に競技プログラミングコンテストを開催しているWebサービスです。 このAtCoderのコンテストにに2019年8月から取り組んでいます。ほぼ毎週末9時からコンテストが開催されます。できる限り参加すること27回、ついに水色コーダー(レート1200)になれました。約8か月の取り組みでした。 今回はAtCoderで水色になるまでやったことを振り返っていこうと思います。 レーティングの推移。 レーティングと精進の推移。11月以降は結構過去問やりこみました。グラフは AtCoder Scores で確認できます。 パフォーマンスの推移。AtCoder Performances で確認できます。 解いた問題数は 631、他にも yukicoder の問題や AOJ の問題も30-40問くらいはたぶん解いてます。 ざっとこんな感じです。
AMD CPU Ryzen で Android Emulator を実行させる方法 2019.05.01 Android AMD, Android, Hyper-V, エミュレーター AMD でも Android 開発をしたい 使用している開発用 PC の CPU が AMD である場合、Android Emulator を利用するのに設定が必要です。場合によっては Bios の設定をいじる必要があったりします。 設定に難儀したのでメモ代わりにまとめておきます。 この記事の Android 環境構築と部分的にはかぶります。 検証環境 Windows 10 Home AMD CPU (Ryzen 5 2600) Android Studio 3.4 以上の環境で Android Emulator を動作させます。 Android Studio をインストール & 設定 Download An
IPCとは Electronは、アプリケーション本体を管理している メインプロセス と、画面(html)を表示している レンダラプロセス の2種類のプロセスから構成されます。 基本的に、レンダラプロセスはブラウザなので通常の Javascript が使え、メインプロセスでは Node.js が使えます。したがってユーザーの操作をUIで受け取り、OSネイティブの機能を利用しようとすると、プロセス間での通信(IPC)が必要になります。 プロセス間通信 – Wikipedia イメージはこんな感じです。 引用: https://adamlynch.com/beyond-the-browser-from-web-apps-to-desktop-apps/ これはChromiumのプロセスの簡略図です。 メインプロセス 最初に起動するエントリポイントとなっているファイル、package.json の
Javascript で選択中の文字列を取得する window.getSelection – Web API インターフェイス | MDN ブラウザ上のコンテンツを選択状態にし、選択された文字列部分を取得するには、window.getSelection 関数を使います。 window.getSelection 関数は選択範囲を Selection オブジェクトとしてを取得します。Selection オブジェクトを toString で文字列にしてやると、選択範囲の文字列を取得できます。 const selectedText = window.getSelection().toString(); console.log(selectedText); 複数のDOMにまたがっていようと、選択された文字列のみを取得してくれます。 選択されているDOMを取得する selection – Web AP
ブラウザが吐く CORS エラーを無視したい APIを利用するWEBシステムなんかを開発しているときに割と遭遇しがちなのがCORSのエラーです。異なるドメイン間でのリソース共有に関するアクセス制限のエラーです。 No ‘Access-Control-Allow-Origin’ header is present on the requested resource. オリジン間リソース共有 (CORS) – HTTP | MDN このエラーについて、基本的にはサーバー側でリソース共有を可能にする設定を行う必要があります。 特定のドメインからのアクセスのみを許可する場合は以下のようにします。 Access-Control-Allow-Origin: "http://example.com" すべてのドメインからのアクセスを許可するにはワイルドカードを使ってしています。 Access-Contr
input type=”file”で選択できるファイルの拡張子を制限する方法 2018.12.26 HTML/CSS File, HTML, HTML5 <input type=”file”> で選択できるファイルの拡張子を制限する方法 <input type="file"> でファイルを選択できますが、この時選択できるファイルの種類(拡張子)を制御するには、accept 属性で拡張子もしくはMIMEを設定します。 複数の拡張子を設定もできますし、ワイルドカードを使うこともできます。以下一例です。 <!-- 拡張子 .pdf --> <input type="file" accept=".pdf"> <!-- MIME でテキストファイルを指定 --> <input type="file" accept="text/plain"> <!-- MIMEでワイルドカード指定(画像ファイル) -
縦に複数のデータを横並びで取得したい 縦にたくさん並んだデータについて、横に並べて一つの可カンマ区切りの列データとして取得したい場合があったのでその方法をまとめます。 RMDBは SQL Server です。FOR XML PATH('') を使って実現します。 例えば、部署と社員の関係を以下のようなリレーションで表現します。 部署マスタと社員マスタがあり、社員マスタには所属部署を表す部署IDを保持しています。 CreateTable 一応確認用のSQLを載せておきます. CREATE TABLE [dbo].[部署マスタ]( [ID] [int] NOT NULL, [部署名] [nvarchar](50) NOT NULL ) CREATE TABLE [dbo].[社員マスタ]( [ID] [int] NOT NULL, [部署ID] [int] NOT NULL, [氏名] [nv
Tyepscript のテスト環境(jest)構築 Jest · 🃏快適なJavaScriptのテスト Javascript のテスト用ツールはいろいろありますが、Facebook製の jest というテスト用フレームワークを使う方法をまとめます。 今回は Typescript で書かれたコードのテスト実装します。 jest とは Jest is a delightful JavaScript Testing Framework with a focus on simplicity. It works with projects using: Babel, TypeScript, Node, React, Angular, Vue and more! シンプルで Node とか React とか Typescript とかいろんな環境に対応したテストフレームワークです。 サンプル Get
Python から コマンドを実行する方法 Python から コマンドを実行する方法をまとめます。 subprocess で別のプロセスとして任意のコマンドを起動することが可能です。 subprocess — サブプロセス管理 — Python 3.7.4 ドキュメント 以下、Windows環境で試しているので mac, linux の人はコマンドをいい感じに変えて試してください。 単純な例 例えばメモ帳を Python から起動するには以下のように記述します。 import subprocess subprocess.Popen("notepad") subprocess.Popen() は引数にコマンドを受け取り、それを実行します。 Windows に組み込まれたコマンドを実行 Windows にあらかじめ組み込まれているコマンド(start や dir 等)は上記の方法ではうまく実
Angular5 の環境構築 Angular – クイックスタート Angular5 の開発環境を構築します。手順は上記公式サイトの手順に倣います。 Node.js と npm Download | Node.js Angular を使うには、Node.js と npm がインストールされている必要があります。 上記URLからNode.jsのLTS版をインストールしてください。npm は Node.js に付属するパッケージ管理ツールですので、Node.jsがインストールされると使えるようになります。 バージョンについて バージョンについては次のように書いてあります。 node 6.9.X 以上とnpm 3.x.x 以上がインストールされていることを確認してください。 ターミナルまたはコンソールで node -v と npm -v コマンドを使うことで確認できます。 古いバージョンをお使い
icacls.exeとは インテグリティ・コントロール・アクセス・コントロール・リスト(Integrity Control Access Control List)の略です。Windows Server 2003 Service Pack 2以降に搭載されているicaclsはファイルやフォルダのアクセス制御リストを表示、修正、バックアップ、復元したりなどができます。 つまるところ、icaclsコマンドを使うことでファイルのアクセス権限を変更することができます。 構文とサンプル icacls <FileName>[/許可 [: r] <Sid>: <Perm> [...][/<Sid> を拒否: <Perm> [...][/[:g|:d] 削除] <Sid> [...][/t][/c][/l][/q][/setintegritylevel <Level>: <Policy> [...]ica
[puppeteer] ヘッドレスブラウザの操作でスクレイピング、クローリング 2018.05.14 Javascript Javascript, スクレイピング, テスト puppeteer とは GitHub – GoogleChrome/puppeteer: Headless Chrome Node API puppeteer とは、GUIを操作することなく、プログラムからAPIでブラウザ(Chrome)を制御できる Node.js で作られた ライブラリ です。ヘッドレス(GUIなし)でも制御できるので高速です。 Node.jsのライブラリとして提供され、npm からインストールすることで puppeteer から操作することになる最新の Chromium がインストールされるので、環境構築も簡単です。 内部では Chromium が動くことになるので、Javascript も実行
Angular サーバーサイドレンダリング を Firebase Cloud Functions で動かす 2019.06.21 Angular Angular, Firebase, サーバーサイドレンダリング, サーバーレス Angular でサーバーサイドレンダリング Angular でサーバーサイドレンダリングを行う方法をまとめます。 基本 この記事 を参考にしていますが、うまくいかない個所もあったので、備忘録がてらやり方をまとめておきます。やり方も少しだけかえています。 Firebase を使ってサービスを構築する予定だったので、サーバーサイドには Firebase Cloud Functions を利用します。元記事には GCP のサービスを使う方法もあります。 Firebase の無料枠で試せます。 Firebase のアカウントの用意、NodeJS & Angular のイン
コンポーネントを任意のタイミングで再描画したい AngularでWebアプリを開発中、コンポーネントをある特定のタイミングで再描画したいという状況があったので、その方法を調べたのでメモしておきます。 例えば非同期処理でのバインドデータ更新など、データが変わっても変更検知をしてくれない時があったりします。 ChangeDetectorRef ChangeDetectorRef を使うことで、任意のタイミングで変更検知を発生させる事ができます。 例えば、コンポーネントの描画時に現在日時を表示するようなコンポーネントを作成してみます。 import { Component, OnInit, ChangeDetectorRef } from '@angular/core'; @Component({ selector: 'app-my-sample', template: ` <div>今の日時は
GO言語での gRPC 環境構築 Go言語がインストールされいてる前提です。go コマンドが使えればOKです。 gRPCのインストール Go言語での gRPC をインストールします。 $ go get -u google.golang.org/grpc protocのダウンロード .proto ファイルをコンパイルする protoc コマンドを使えるようにコンパイラをインストールします。 Releases · protocolbuffers/protobuf 上記URLからOS環境に合わせてダウンロードしてください。Windows OS(64bit)の場合、例えば protoc-3.8.0-rc-1-win64.zip です。バージョンは適宜最新版を落とします。 ダウンロードしたZIPファイルを解凍してできたディレクトリ直下にある /bin にパスを通します。 protocのGo用のプラグ
Let’s Encryptとは Let’s Encrypt 総合ポータル Let’s Encrypt は、無料で利用できる自動化されていてオープンな認証局(CA)です。公共の利益を図る目的で Internet Security Research Group (ISRG) が運営しています。 つまるところ、無償で使えるSSL証明書を提供してくれるオープンな機関です。一般的にHTTPSサイトを実現しようとするとランニングコストがかかってきますが、Let’s Encrypt を使えば無償で実現できます。 今回は、IIS(Windows Server)上に、Let’s Encrypt で HTTPSサイトを構築する方法を紹介します。本サイトはHTTPSに対応していますが、Let’s Encrypt を利用しています。そもそもSSLの仕組みとはなんぞやという人は以下の記事を参照してください。 SSL
PDFをページ内に埋め込んで表示するGoogle Docs Viewer(スマホ, PC) 2018.06.18 HTML/CSS Google Docs Viewer, PDF PDFをダウンロードせずブラウザに埋め込んで表示したい PDFのリンクをページ埋め込んだ場合、ビューワーが起動して別ページで表示されたり、ファイルのダウンロードが発生するのが普通です。 そうではなく、ページ内のコンテンツの一部として、PDFを埋め込んで表示したいことが良くあります。 今回は、ページ内にPDFを埋め込んで表示できる Google Docs Viewer の使い方をまとめます。 Google Docs Viewer Google Docs Viewer は、以下の16種類以上のファイルタイプをサポートしています。 画像ファイル (.JPEG .PNG .GIF .TIFF .BMP) ビデオファイル
WindowsでFlutter入門(開発環境構築~デバッグ実行まで) 2018.12.21 Flutter Dart, Flutter, アプリ, 環境構築 Flutter とは Flutter とは、Google によって開発されているオープンソースのモバイルアプリケーションフレームワークです。iOS/Android 両方のプラットフォームのアプリを1ソースで開発できる、クロスプラットフォーム対応のフレームワークです。 Flutter で開発されたアプリは、Chrome や Android と同じく、ハードウェアアクセラレーションに対応した Skia 2D グラフィック エンジンを活用します。そのため、Ionic などのハイブリッドアプリと比べ高速な動作が期待できます。 Google Developers Japan: Flutter 1.0: Google のポータブル UI ツールキ
Javascriptで連想配列を定義 連想配列(あるいは辞書型やハッシュテーブル)は、従来のJavascriptの機能として直接的には提供されていませんでした。代わりに、Javascriptでは連想配列の機能を実現するためにObjectを使っていました。 // 連想配列を定義 var dictionary = { "a": 100, "b": 200, "c": 300 }; // データの追加・更新 dictionary.d = 400; dictionary["e"] = 500; // データの削除 delete dictionary.a; delete dictionary["b"]; // データの参照 var d = dictionary.d; var e = dictionary["e"]; console.log(d, e) // 400, 500 // データの列挙 va
次のページ
このページを最初にブックマークしてみませんか?
『Web備忘録 | プログラミングを中心に技術的な事柄を忘れないように書き残します。』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く