個人的なJavaScriptの情報収集の方法についてまとめてみます。 JSer.infoなどをやっているので、JavaScriptの情報については色々な情報源を見るようにしています。 JSer.infoの範囲の中での情報源については、次の記事でまとめています。 JSer.info 13周年: JavaScriptの情報源を整理する - JSer.info この記事では、少しスコープを広げてJavaScriptの情報収集についてまとめてみます。 かなりスコープが広がってしまうので、万人向けの方法ではなく、個人的な情報収集方法としてまとめています。 この記事では、膨大な情報の中から見つけるというアプローチをとっているので、人によって向き不向きがあると思います。 情報収集の方法 情報の元となる情報源はさまざまなサイトや人になると思います。 しかし、そのサイトや人ごとに見ていくというのはかなり大変

Cloudflare Pagesの`{name}.pages.dev`ドメインに自分だけアクセスできるようにアクセス制限をつける手順 Cloudflare Pagesの {name}.pages.dev ドメインに自分だけアクセスできるようにアクセス制限をつける手順です。 アプリケーション側の変更は不要で、Cloudflare Accessの機能を使ってアクセス制御ができます。 カスタムドメイン(Cloudflare DNS)を設定している場合の方法は色々ありますが、デフォルトで用意されている {name}.pages.dev ドメインに対して設定する手順についてです。 この手順がかなりややこしいので、設定方法メモ書きです。 プレビューブランチへのアクセス制御の有効化手順 Cloudflare Pagesでページを作る Settings -> Access policyでEnable ac

1Passwordを使って、ローカルにファイル(~/.configや.env)として置かれてる生のパスワードなどを削除した 最近、コミットはされないがローカルのディレクトリに置かれている.envのようなファイルから生のパスワードやAPI Tokenを削除しました。 これは、ローカルでマルウェアを実行した場合に、ローカルに置かれている生のパスワードやAPI Tokenを盗まれる可能性があるためです。 最近は、npm install時のpostinstallでのデータを盗むようなマルウェアを仕込んだりするソフトウェアサプライチェーン攻撃が多様化しています。 Compromised PyTorch-nightly dependency chain between December 25th and December 30th, 2022. | PyTorch What’s Really Goin

2022年のオープンソース活動の振り返り記事です。 今までの振り返りの一覧です。 今年のオープンソース活動振り返り @ 2021 | Web Scratch 今年のオープンソース活動振り返り @ 2020 | Web Scratch 今年のOSS活動振り返り @ 2019 | Web Scratch 今年のOSS活動振り返り @ 2018 | Web Scratch 今年のOSS活動振り返り @ 2017 | Web Scratch 今年のOSS活動振り返り @ 2016 | Web Scratch 今年のOSS活動振り返り @ 2015 | Web Scratch 今年のOSS活動振り返り @ 2014 | Web Scratch 2022年のGitHubのPublicなContributionsは7000~8000ぐらいを推移していました。 Privateリポジトリも含めると大体1.5

自分のパスワードやMFA(多要素認証)の管理方法についてまとめた記事です。 パスワード管理とTOTP(Time-based One-time Password)の管理として1Passwordを使い、MFA(多要素認証)の2要素目としてYubiKeyを2枚使っています。 パスワード管理とMFA管理を安全で使いやすくするのはかなり複雑で難しいため、完璧にやるのが難しいです。 そのため、その難しさから二要素認証を設定するべきアカウントも手間などから設定を省いてしまったり、管理方法に一貫性がありませんでした。 この記事では、パスワード管理/MFA管理の戦略を決めることで、どのサイトのどのアカウントのパスワード管理をあまり頭を使わなくてもできるようにするのが目的です。利便性と安全性のバランスを意識はしていますが、この記事のやり方が正解ではないので、各自の目的に合わせて読み替えると良いと思います。 用

Komesan: 指定したURLに関連するはてなブックマーク、Twitter、HackerNewsのコメントを表示する Komesanというはてなブックマーク、Twitter、HackerNewsをまとめて表示するサイトを作りました。 https://komesan.pages.dev/?url=https://pages.cloudflare.com HackerNewsはオプショナル: https://komesan.pages.dev/?url=https://pages.cloudflare.com&service=hackerNews ブックマークレットで実行する場合は、次のようなURLのブックマークを利用します。サイトの下部に同じものがおいてあります。 javascript:void(window.open("https://komesan.pages.dev/?url="+e

個人的なタスク管理ツールとしてGitHub Issueを使うようにしてその仕組みを色々と作っているので、そのアーキテクチャについてのメモ書きです。 後述しますが、GitHubをベースとすることでプログラムでの拡張性が高いというのが特徴です。 セットアップが色々と必要になるためぱっと再現しやすい感じではなかったり一部未公開になってます。 需要があったらオープンソースとして公開できるように整えます。 GitHub Issuesとタスク管理ツールでの課題 自分の中で、タスク管理ツールとGitHub Issuesを両方使う場合に次の課題がありました。 自分のタスクの半分以上はGitHubに何かしら紐づく情報(オープンソース、ブログ、仕事)であったため、GitHub Issueとの二重管理感がある GitHub上で複数のリポジトリのタスクを管理するのが難しい 1つ目は、タスク管理ツールを使っても結局

vscode-read-aloud-textという文章を読み上げるVisual Studio Codeの拡張機能を作りました。 azu/vscode-read-aloud-text: VSCode extension that read aloud text like Markdown and text etc… Read Aloud text - Visual Studio Marketplace vscode-speechを元にしていますが、vscode-read-aloud-textは文章の構造をパースしてから読み上げたり、読み上げている部分をハイライト表示する機能が追加されています。 Markdownなどをパースして、コードブロックなどは読み上げない textlintのプラグインを再利用してるので、現在対応しているのはMarkdown、Txt、Re:Viewのみ 読み上げるのはHe

この記事はJavaScriptの入門書として書いているjs-primerのthisに関する部分をベースにしています。 またjs-primerでは書けなかった現在時点(2018年1月1日)でのブラウザの挙動についてを加えたものです。 次の場所にjs-primer版（書籍版）のthisについての解説があります。 この記事と違って実際にコードを実行しながら読めるので、学習ソースとしては書籍版を推奨します。 書籍版: 関数とthis · JavaScriptの入門書 #jsprimer また、バグ報告やPRも直接リポジトリにして問題ありません。 asciidwango/js-primer: JavaScriptの入門書 おかしい場所を選択した状態で右下にある”Bug Report”ボタンを押せば、簡単にtypoとかのバグを報告できます。(PRでも歓迎) 前置きはこの辺までで、ここから本編。 この記

ECMAScript勉強会 に参加してきたのでその時のメモです。 久々に結構難しい内容が多かった気がする。 ECMAScript勉強会 ECMAScript概要 – rika_t ECMAScript Study #1 Overview 途中参加 newがあるのはなぜ プリミティブな型もメソッドやプロパティを持てるようにしたいため、ラッパーでラップしてた。 globalオブジェクト globalオブジェクトは必ずしもwindowではない オブジェクトとクラス 内部的には[[Class]]というクラスという文字列がでてきてた。 ES6から内部的にClassというものがなくなってきてる。 リテラル記法やコンストラクタを使って様々なオブジェクトを表現してる NativeBrandという名前になってる prototype 仕様書にのってるprototypeの図はわかりにくい 変数宣言 “var”キ

JavaScriptに対応してるIDEのメモまとめ。 Aptana 有名どころでEclipseのプラグインとしても使えます。 IDEらしくちょっと重たいけど、整形やデバッグやスニペットなど大抵の機能が入ってる。 IDE内でブラウザプレビューができて便利。 最近のバージョンだとFirefoxのプレビュー機能がデフォルトで入ってないので別途プラグインを入れる必要がある。 Aptana Studio 2.0.3－Firefoxプレビュータブ – ゆちの備忘録 WebStorm JavaScript EditorにJavaScript関係の対応について書いてある。 HTMLとかまぜこぜでも補完ができてる。 追記:ちょっと触ってみたら実は凄かった 追記2:使い勝手などをまとめて見ました。 最強のJavaScript IDE 「WebStorm」を使ってみた Komodo IDE デバッグ系機能がない

JavaScript対応のIDEをまとめてみたの続きのようなもので、その中で紹介していたWebStormが素晴らしいので別途紹介。 WebStormはHTML(5)+CSS+JavaScriptに対応してるIDEで、Windows, Mac OS、Linux上で動作します。 有料のソフトウェアですが、オープンソースライセンスがあったり体験版は45日間使えるのでとりあえず試してみましょう。 この記事の続編(アップデート版)を書きました 特徴 とにかく膨大な機能が載ってるので全てを紹介するのは無理があるため、凄いと思ったところを掻い摘んで紹介。 主にJavaScriptを書くエディタとして使っていますが、CSSやHTMLも普通のIDEより書きやすいです。 基本的にWebStormで日本語に関する問題は少なめです。一部IMEの変換候補が出てくる場所がずれたり、プラグインで日本語がダメだったりする