はてなブックマーク

この記事では Pi-hole を使って以下のような感じで自宅のネットワークの状態を確認できるようにします。うん、カッコいい！しかも実用性もちゃんとあります。 Pi-holeとは？ Pi-hole は広告ブロック機能がついた DNS サーバ兼 DHCP サーバです。自宅ネットワークのルータ等についている既存の DNS サーバや DHCP サーバを置き換える形で設置することで、ネットワーク内のすべての端末に広告ブロック効果をもたらしてくれます。端末ごとに広告ブロッカーを入れなくてもよいわけです。また上の画像ように項目が豊富でイカした管理画面がついており、状況を確認したり設定を変更したりなどの作業が簡単に行えます。 注意 この記事では最初の導入方法しか扱いません。それ以上のことは別の記事を見たり、管理画面からいじってみたりしてください。 ネットワークの構成を変えることによってネットに繋がらない等

どうもエラーを出すもしくはエラーが出るのが怖いという人がいるみたい。例えば改修を行うときに既存部分でエラーが出ないことを最優先にして増築を行いいびつな構造を生み出すとか、単純に例外を全然使わないとか。エラーが出ると、「うわ、エラーになった。手間かけさせやがって面倒だなぁ…」みたいな感覚があって、とにかく自分がコードを書くときも一切例外を投げないというスタンスをとりがちなのかもしれない。 私はここで、適切にエラーが出てくれるのはむしろ喜ばしいことであり、自分がコードを書くときも積極的にエラーを出すようにすべきだ、という主張をする。 関数定義のドキュメンテーションの一部 ある関数の中身で一番最初に書くべき処理は何か、それは引数のチェックをして条件を満たさなければエラーを出すことである。例えば文字列は特定の形式になってなければならないとか、数値に最大値最小値があるとか、これらは関数の入力の前提条

<form action="https://bank.example.com/transfer" method="post"> <input type="hidden" name="to" value="cracker" /> <input type="hidden" name="amount" value="¥10000000" /> <button>今すぐクリック！！！</button> </form> 問題は何の関係性もないmalicious.example.comのサイトから発せられたbank.example.comへのリクエストにbank.example.comの認証情報（Cookie）が付与されてしまうことです。これによってbank.example.comに対するユーザ認証付きの操作を第三者がそれと分からない形で実行させることができてしまうわけです。 そこで導入されたのがSet

この儀式は西暦2024年1月をもって封印されました。現在「補完策」なるものが提供されていますが、それがこの儀式に有効なのかは不明です。皆さん自身の手で確かめてください。 公衆電話からインターネットに接続できるらしい。その事実を知ったのは2024年1月21日だった。そして同じ日、その機能が無くなるのは2024年1月31日だと知った。 封印までの最期の10日間で公衆電話からのインターネット接続の儀式を行ってきた話。 序章 公衆電話を使ってインターネットに接続できると知ったのは2024年1月21日だった。 ダイヤルアップ接続という電話回線を使った接続方式で、これは一般人が初めてインターネットというものに触れられるようになった一番最初の接続方式と言っていいのだと思う。多くの人が自宅の固定電話の回線を使ってインターネットをしていた。現代では光ファイバーからのLANケーブルやWifi、移動端末なら4G

JavaScript標準でgroupBy関数が実装されています。2023年11月現在Safari以外の主要なブラウザで実装済みで、SafariもTechnology Previewのようです。 （現在MDNの日本語の記事は古い情報のままになっており、現行と異なるので注意！ →更新していただきました。ありがとうございます！） Proposal の Stage はすでに 4 / Finished なので規格として確定済みです。 基本的な使い方 よくあるgroupByです。配列（Iterable）とキーを抽出する関数の二つを指定すると、キーで配列をグループ化します。 const ret = Object.groupBy([ { name: '山田太郎', address: '東京' }, { name: '山田次郎', address: '愛知' }, { name: '山田三郎', addre

const obj = { hoge: [new Date(2023, 3, 12), 1], fuga: 'foo' }; const objClone = structuredClone(obj); // ディープコピー obj.hoge[1] = 10; console.log(objClone.hoge[1]); // 1 objClone.hoge[0].setFullYear(2050); console.log(obj.hoge[0].getFullYear()); // 2023

TypeScriptによる型のある世界は生のJavaScriptでも体験できます。JSDocを使えば良いのです。JSDocを使えば型が付与された、しかし正真正銘のJavaScriptコードが書けます。JSDocはJavaScript実行環境にとってはただのコメントなので当然ブラウザでそのまま動きます。tscによる変換の儀式は不要で、型チェックだけを行うことになります。 その型チェックもVSCodeを使っていればTypeScriptをインストールしなくても勝手にやってくれるので、小さなプロジェクトならこれで十分だと思います。VSCodeを使っている前提にはなりますが、その場合なんのセットアップや変換もなく型のあるJavaScriptを扱えます。 JSDocによる型付けは割と強力で一般的な場面ではほとんど不自由しません。しかし比較的よく使う型宣言なのに今まで唯一できないことがありました。それが

【JavaScript】setTimeoutから返るIDは絶対0じゃないし、clearTimeoutに0を渡しても何もしないJavaScriptsetTimeoutsetInterval 超小ネタです。JavaScriptのタイマー系関数にsetTimeoutとsetIntervalがあります。これらは返り値として数値型のタイマーIDを返し、このタイマーIDをclearTimeout及びclearIntervalに渡すことでタイマーをキャンセルできます。 このタイマーIDは0よりも大きいことが保証されています。またclearTimeoutまたはclearIntervalに無効なタイマーIDを渡しても何もしないことも保証されています。（以下参照） なのでタイマーを使っていないときはタイマーIDに0を代入しておけば、clearTimeoutを使うときに毎回タイマーを起動しているかをチェックする

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? SurrealDBというRust製データベースを知ったので紹介します。このデータベースはすごいです。リレーショナル、ドキュメント、グラフ、あらゆる種類のデータ構造を扱うことができ、かつインメモリ、単一ノード、分散環境、全てで動かすことができます。さらにHTTPやWebSocketによるアクセスと柔軟なユーザ認証、認可機能とがDB本体に内包されており、ブラウザから直に接続するWebDBとしても使えます。とにかくなんでもできる夢のデータベースといった感じです。 特徴 機能を挙げていたら多くなりすぎたので、特に面白い部分を挙げます。 配列やオ

例えばWebサイトのバックエンドでアップロードされたファイルを/storage/フォルダ内に入れているとする。その場合、Gitではアップロードされた/storage/内の各ファイルは無視したいが、/storage/フォルダ自体は残しておきたいということがよくある。しかしGitで管理できるのはファイルだけなので、ファイルが一つも入っていないフォルダをGitで表現することはできない。そのために.gitkeepというダミーの空ファイルを作成してGitで管理することでフォルダを保持するということが頻繁に行われている。 ここではそのような場面でこれまでよく解説されている.gitignoreの書き方とは異なる、より柔軟で単純な書き方を発見したので解説する。 結論 保持したいフォルダ構造を作成。ここでは/storage/フォルダ以下のフォルダ構造をgitで保持したいとする。 各末端のフォルダに空のファイ

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? ほとんど静的でバックエンドのいらないサイトでも、唯一バックエンドが必要な部分がお問合せフォームだったりします。このお問合せフォーム等からのメール送信の機能をクラウドサービスとして行ってくれるのがここで紹介するEmailJSです。このサービスを使うことでGUIでポチポチ設定するだけでメール送信機能ができ、自分でプログラムを書いてバックエンドを組む必要がなくなります。 特徴 ブラウザからREST APIでサービスのURLに直接アクセスしメールを送信できる、REST APIをラップしたJavaScriptのSDKもある 予めサービスの管理画面

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?