はてなブックマーク

Lit とは Web Components Lit による最小限の Web Components Lit プロジェクトの準備 my-element コンポーネントの作成 ビルドと実行 宣言型イベントリスナー まとめ Lit とは Google の Chrome チームにより始まった Polymer -> LitElement -> Lit と変遷した web components ベースのフロントエンドUIフレームワークです(LitElement 3.0 == Lit )。 lit.dev Lit is a simple library for building fast, lightweight web components. と謳われる通り、Web Components 構築用の軽量なライブラリになります。 Polymer は、Web Components の Polyfill ライブ

はじめに SOLID 原則 CUPID とは Composable(組み立て易い) Small surface area(小さな表面積) Intention-revealing(意図を明確に) Minimal dependencies(依存は最小限に) Unix philosophy(Unix哲学) A simple, consistent model(シンプルで一貫性のあるモデル) Single purpose vs single responsibility(単一目的 vs 単一責任) Predictable(予測通り) Behaves as expected(期待通りに動作する) Deterministic(決定論的) Observable(観察可能) Idiomatic(慣用的な) Language idioms(言語イディオム) Local idioms(ローカルなイディオム)

テキストエディタのデータ構造 Gap method Piece Table method Piece Table の構造 Piece Table の実装 Piece Table のメソッド まとめ テキストエディタのデータ構造 テキストエディタで採用されているデータ構造にはいろいろあります。 こちらの論文 Data Structures for Text Sequences では各種データ構造について比較検討されています。 多くは、Gap method や Piece table method をベースにしたものが多いのではないでしょうか(図で言う最下部の中心の丸印に当たります)。最近では Rope なども有名ですね。 Gap method Gap method では、現在のカーソル位置で、テキストバッファを2つに分割し Gap を間に挟み、カーソル位置に対する編集(テキスト追加/削除)を

はじめに プロジェクト作成 プロジェクト構成 コンポーネント レイアウト ページ ビルド Blog テンプレート Portfolio テンプレート Documentation テンプレート まとめ はじめに 先日1.0リリースとなった、静的サイトジェネレータのAstroの紹介です。 JSで作成したページをビルドして、JSを含まない早いサイトを生成し、必要な場合には React や Vue といった好きなフレームワークを簡単に組み込むことができるのが特徴になります。 プロジェクト作成 Node は、v14.18.0 以上、または v16.12.0 以上が必要です。 npm や yarn、pnpm で create astro でプロジェクトを作成します。 # npm $ npm create astro@latest # yarn $ yarn create astro # pnpm $ p

はじめに 概要 目標 非目標 動機 1リクエスト-1スレッド方式 非同期方式 仮想スレッドによる1リクエスト-1スレッド方式 説明 仮想スレッドとプラットフォームスレッドの使い分け 仮想スレッドの有効化 仮想スレッドにスレッドプールは不要 仮想スレッドの監視 仮想スレッドのスケジューリング 仮想スレッドの実行 メモリの使用とガベージコレクションとの相互作用 変更点の詳細 java.lang.Thread Thread-local variables java.util.concurrent Networking java.io Java Native Interface (JNI) Debugging (JVM TI, JDWP, and JDI) JDK Flight Recorder (JFR) Java Management Extensions (JMX) java.lang.Th

Multipass とは macOS でのインストール Windows でのインストール VM起動から終了まで 利用可能なOSイメージの一覧 VMのスペックを指定 ホストディレクトリをマウントする VMの情報を確認する Docker で Nginx を起動する cloud-init でVMを初期設定する Multipass とは Multipass は、macOS, Linux, Windows で使えるマルチプラットフォームの軽量なVMマネージャです。 macOSではHyperKit、Linux では KVM、WindowsではHyper-V を使用するため、最小限のオーバーヘッドでVMを実行することができます。 Ubuntu の開発元である Canonical社により提供されているため、VMイメージは Ubuntu に限られますが、コマンド1つで新鮮な Ubuntu 環境がすぐに利用可

Volta とは インストール 公式インストーラ(*nix) Homebrew 公式インストーラ(Windows) volta install で Node エンジンを導入する volta list で現在のツールチェーンを一覧する volta pin でバージョンを固定する コマンドラインツールのグローバルなインストール まとめ Volta とは 数ある Node バージョン管理ツールの一つ 2020年12月にVolta1.0がリリースされ、現在のバージョンは v1.0.5 で比較的新しい Rust 製で早い package.json の内容を読み、自動でバージョン切り替えを行う node や yarn のバージョンをプロジェクト毎に固定できる グローバルパッケージを安全に使うことができる インストール 他の Node バージョン管理ツールを使っている場合は、あらかじめアンインストールし

はじめに Convenience Script を利用したインストール インストールに必要なパッケージ導入 docker パッケージリポジトリの登録 dockerEngineのインストール docker デーモンの起動 docker コンテナの実行 一般ユーザで docker コマンドを利用する docker-compose のインストール docker デーモンの起動 はじめに Docker Desktop for Windows の代替として、WSL2 上の Ubuntu-20.04 に docker を導入する手順です。 short version は以下となります。 # 事前準備 $ sudo apt update $ sudo apt install -y apt-transport-https # dockerパッケージリポジトリ追加 $ curl -fsSL https://

はじめに nginx のプロセス docker で nginx を導入する nginx の構成 nginx コマンド nginx の基本設定 location ディレクティブのマッチング アクセス制限を行う はじめに Docker による nginx の導入と、nginx の基本設定についての説明です。 nginx のプロセス nginx は master プロセスでソケットのリスンを行います。 ソケットで待ち受けた接続は、worker プロセスに引き渡され、 accept と送受信といったネットワークI/O処理を行います。 master プロセスは root ユーザで起動し、worker プロセスは一般ユーザ(nginx や www など)で起動します。 worker プロセスでは、epoll や kqueue などを利用した I/O の多重化により、1つのプロセスで複数のクライアントと

はじめに スクリプトファイルの命名 Kotlin と Groovy の言語上の考慮事項 Gradle init によるプロジェクト生成 プラグインの適用 プラグインの設定 タスクの構成 タスクの作成 依存の指定 よくある設定 はじめに Gradle 5.0 よりGradle Kotlin DSL が提供され、groovy によるビルドスクリプトを Kotlin で記載できるようになりました。 Kotlin でビルドスクリプトを書くことで、IDEによるサジェストやコードジャンプなどの恩恵を十分に受けることができますし、タイプセーフでありリファクタリングなども容易となるので、これから Groovy のビルドスクリプトを書くのであれば Gradle Kotlin DSL を使うべきです。 ここでは、Groovy DSL と Kotlin DSL の違いと Kotlin DSL でビルドスクリプト

はじめに JDK 16 で導入された stream.toList() Collectors.toList() の API と実装 stream.toList() の API と実装 stream.toList() には安易に切り替えられない はじめに JDK 16 で追加された stream.toList()。 タイプ量が減るのは良いのですが、API 設計から見た場合、多少の気持ち悪さが残ります。 そして、.collect(Collectors.toList()) から .toList() へは、単純に置き換えることができないよ という話です。 JDK 16 で導入された stream.toList() JDK 16 で Stream に stream.toList() が追加されました。 今までは Collectors を使う必要があり、以下のように書いてきました。 List<Strin

はじめに Java Object Layout (JOL)とは JOL の導入 JOL の使い方 GraphLayout ClassLayout VM まとめ はじめに Java にはオブジェクトが使用するメモリ容量を得る演算子がありません。 例えば、C や C++ における sizeof であったり、Rust における std::mem::sizeof を使えばオブジェクトのサイズを照会でき、メモリ効率に関する情報を得ることができます。 一方、Java ではオブジェクトのメモリ使用量を得ることは簡単ではありません。 Java ではポインタ演算を使用しないため、オブジェクトのメモリ構造を意識する必要は現実的には少ないです。 しかし、例えばオブジェクトをキャッシュした場合のメモリ使用量については、具体的なヒープメモリへのインパクトを見積もりたいといった場合もあるでしょう。 Java オブジェ

はじめに sonatype で JIRAアカウント作成 New Project の issue 登録 GnuPG の導入 GnuPG による鍵の生成 公開鍵を鍵サーバへ登録 秘密鍵をエクスポート Gradle プラグインの導入 build.gradle の設定 リポジトリへの公開 まとめ はじめに Maven Central Repository へライブラリを登録する手順です。 意外と古い情報しか見当たらなく、少し面倒な作業なのでこちらで紹介します。 大きくは、以下の流れになります。 sonatype の JIRA で issue を通してリポジトリ作成を依頼 GnuPG で jar を署名できる環境を作成 Gradle プラグインでリポジトリへ登録 Repository Manager で Maven Central Repository へリリース 順に見ていきましょう。 sonat

はじめに 郵便番号と住所の割当についての注意点 郵便番号データのカラム定義 複数行に分割されるレコード 町域名の編集 "以下に掲載がない場合" "・・の次に番地がくる場合" "・・一円" カンマ区切りされた町域名 地割 町域名がカッコ付きで補足されるパターン （全域）,（丁目）（各町）（番地）（無番地）（その他） （○○屋敷） ビルの記載 （地階・階層不明）（X階） ・・を除く） ・・を含む） ・・その他） ・・以下） ・・以上） ・・以内） ・・以降） ・・以外） ・・」以外 ・・番地以上 カッコの取り扱い JPostal はじめに 郵便番号の入力に応じて、都道府県や市区町村を入力補完したいといったよくあるユースケースがあります。 このときに辞書データの候補となるのが、日本郵便の公開する郵便番号データ ken_all.csv です。 しかしこのデータは悪評高きことで有名で、システムで使う

 はじめに プログラミングモデルの変遷 ソケット ソケットによるサーバ実装 スレッドプールを利用したサーバ実装 ブロッキングI/Oの課題 ノンブロッキングI/O I/O多重化(multiplexing) バッファ操作 I/O多重化を使ったサーバ実装 非同期チャネル NIO2 によるエコーサーバ まとめ はじめに Java でネットワークプログラミングを行うのであれば Netty を使えば良いのですが、Netty に至るまでの標準APIの変遷についての話題は知っておいて損はない内容だと思います。 いまさら書く必要のある内容では無いかもしれませんが、とりまとまった情報源も乏しいため、Java標準APIを利用したネットワークプログラミングについて説明していきます。 プログラミングモデルの変遷 Java でネットワークプログラミングを行うには、JDK1.4 以前では Socket を使ったシンプ

JEP 286: Local-Variable Type Inference ローカル変数宣言型推論の注意点 4つの原則 7つのガイドライン 「インターフェースを使ったプログラミング」についてはローカル変数では重視しなくてよい ダイヤモンド<> やジェネリックメソッドにおける var 利用は注意すること リテラルにおける var 利用は注意すること var の利用例 まとめ blog1.mammb.com JEP 286: Local-Variable Type Inference Java 10 によりローカル変数宣言で型推論(type inference)が可能となり var により型定義を省略できるようになりました。 C++ での auto、C# での var、Scala での var/val、Go での := のように大抵の言語ではローカル変数型推論をサポートしており、Java は

はじめに Node のインストール プロジェクトの初期化 TypeScript コンパイラの導入 TypeScript の設定 Hello TypeScript DOM 操作 まとめ はじめに 簡単なサンプルを交えて TypeScript の始め方について紹介します。 Node のインストール Node (と npm ) がインストールされているものとします。未導入の場合は以下を参照してください。 blog1.mammb.com ここでは現在の最新の LTS(Long Term Support) 版として以下を使います。 $ node -v v12.18.0 $ npm -v 6.14.4 プロジェクトの初期化 TypeScript コンパイラは npm パッケージとして公開されています。 最初にプロジェクトディレクトリを作成し、npm で初期化(package.jsonファイルを作成)し

はじめに データベースの準備 SchemaSpy の準備 SchemaSpy の起動 SchemaSpy のドキュメント Redmine のデータベースドキュメント まとめ はじめに SchemaSpy は、既存のデータベースからデータベースのドキュメントをHTMLで出力するJava製のツールです。 ここでは SchemaSpy の使い方について簡単に紹介します。 データベースの準備 何でもいいのですが、ここでは Spring petclinic を例にしてデータベースドキュメントを生成してみます。 リポジトリから git clone します。 $ git clone https://github.com/spring-projects/spring-petclinic.git $ cd spring-petclinic Docker で MySql を起動します。 $ docker ru

はじめに 依存 ワークブックの新規作成 既存ワークブックのオープン ブックの保存 シートの作成 シートの取得 行の取得 行と列の移動 セルの取得 セルへの値設定 セル値の文字列取得 行とセルの走査 値が設定されている範囲の取得 罫線の設定 セルスタイルプロパティ フォントの設定 背景色の設定 入力規則(プルダウンリスト)の設定 式の設定 カラム幅の自動調整 はじめに Apache POI のよく使う API の簡易チートシートです。 3 系、4系 で API 使い方が変わってきています。 ここでは 4系 を対象とします。 依存 拡張子 xlsx 形式を扱う場合は poi-ooxml が必要 implementation 'org.apache.poi:poi:4.1.2' implementation 'org.apache.poi:poi-ooxml:4.1.2' ワークブックの新規作成

はじめに 匿名クラスの this 参照 lambda の this 参照 lambda コードの展開 lambda で自身を参照する はじめに lambda は、匿名クラスの単なる構文糖ではなく、その実現方法の違いから発生するいくつかの違いがあります。 ここでは、lambda ブロックにおける this 参照の違いについて説明します。 匿名クラスの this 参照 匿名クラス内部で this 参照をすれば、それは匿名クラス自身を指し示します。 public class Main { public void run() { Runnable r = new Runnable() { @Override public void run() { System.out.println(this.getClass().toString()); } }; r.run(); } public stati

ANTLR とは ANTLR の導入 ANTLR の実行 ANTLR による構文解析 ANTLR の文法ファイルと生成ファイルの関係 まとめ ANTLR とは ANTLR (ANother Tool for Language Recognition) は構文解析器を生成するパーサジェネレータで、yacc や JavaCC などと同じ類いのものです。 BNF のような文法定義から、ソースコードなどを処理するコードを生成します。 プログラム言語の入力部であったり、DSL や コード解析、設定ファイルの読み込みなどの構造を持った入力テキストの処理を簡単に実現することができます。 例えば、Hibernate の HQL(Hibernate Query Language) では ANTLR による構文解析が使われています。 ここでは、ANTLR 4 の使い方について簡単に見ていきます。 ANTLR

はじめに Github 管理の .gitignore テンプレート .gitignore の作成 まとめ はじめに Git を利用する際 .gitignore にファイルやディレクトリを指定することで、リポジトリ管理の対象から除外することができます。 例えば Windows の場合のThumbs.db や macOS の .DS_Store といったプラットフォーム別の制御ファイルであったり、各種エディタの一時ファイルやログ・ファイルなどは、うっかりリポジトリに登録しないように予め .gitignore に定義してリポジトリ管理の対象から除外すべきです。 色々な環境やツールを考慮した .gitignore ファイルを定義するのも以外と大変です。 ここでは、Github の公開するテンプレートから簡単に .gitignore ファイルを作成する方法を紹介します。 Github 管理の .gi

はじめに <input> 要素の disabled 属性 と readonly 属性の違い readonly 属性が有効なのはテキストコントロールに限られる <select> 要素の readonly 属性 readonly 属性が効かないコントロールで readonly を模倣する4つの方法 (1) option 要素を disabled 指定する (2) select コントロールの操作を無効化する (3) disable 指定して hidden で値を送信する (4) disable 指定して Submit 時に有効化する まとめ はじめに HTML 要素の disabled 属性と readonly 属性は、うっかりと間違った使い方をしてしまいがちです。 この記事では属性の挙動の違いを説明し、編集不可コントロールの正しい扱い方について見ていきます。 なお、ここでは以下の HTML

mdBook とは mdBook の導入 mdBook の始め方 mdBook でビルドする mdBook のコマンド mdBook での作業 mdBook で Rust コードを実行 mdBook とは Markdown 形式できれいなドキュメントを作成するためのツールです。 チャプター別に執筆した Markdown ファイルから、以下のようなオンラインドキュメントを簡単に作成することができます。 mdBook でビルドすると book ディレクトリに HTML や CSS、JS ファイルが生成されるので、ディレクトリごと Github Pages などに配備すればオンラインでドキュメントを公開することもできます。 同様のツールに gitbook-cli という Node ベースのものがありますが、mdBook は Rust 製で、なにしろ速いのがメリットです。 mdBook の導入 R