私のJavaScriptの情報収集法 2024年版
個人的なJavaScriptの情報収集の方法についてまとめてみます。 JSer.infoなどをやっているので、JavaScriptの情報については色々な情報源を見るようにしています。 JSer.infoの範囲の中での情報源については、次の記事でまとめています。 JSer.info 13周年: JavaScriptの情報源を整理する - JSer.info この記事では、少しスコープを広げてJavaScriptの情報収集についてまとめてみます。 かなりスコープが広がってしまうので、万人向けの方法ではなく、個人的な情報収集方法としてまとめています。 この記事では、膨大な情報の中から見つけるというアプローチをとっているので、人によって向き不向きがあると思います。 情報収集の方法 情報の元となる情報源はさまざまなサイトや人になると思います。 しかし、そのサイトや人ごとに見ていくというのはかなり大変
Maintainer Month: なぜtextlintを作ったか
今では200以上のルールがある自然言語のLintツールであるtextlintがどのように作られたかを振り返る記事です。 6月はMaintainer MonthというイベントをGitHubが主催しています。 Maintainer Month is a reminder for the ecosystem to support, celebrate, and compensate open source maintainers. – Maintainer Month Maintainer Monthは、オープンソースのメンテナーが集まって情報共有したり、メンテナーを祝ったり、支援したりするイベントです。 メンテナーがどういうサポートを求めているかを知る、負荷が特定の箇所に集中するエコシステムはバランスが悪いのでそれを支援する方法を知るといったことを思い出すのがMaintainer Monthの
記憶に残らないものをメモするためにMemory Noteという仕組みを書いた
Memory NoteというプログラマブルなTodoアプリのミドルウェアを書きました。 ややこしいですが、大雑把に言えばReminder的なTodoリストを扱うREST APIをCloudflare Workersで動かす仕組みです。 Headless Todo Appという単語がしっくりくるのかもしれません。 単体だと何ができるのかよくわからないものですが、Todoサービスを自分用に作れる仕組みです。 対象ユーザーは主に自分ですが、Memory NoteのREADMEにセットアップ方法や関連するクライアントの実装も公開しています。 自分の場合は、iOSのショートカットから音声入力で、メモをGitHub Projectのボードにカードして記録しています。 この記録したメモを、iOSのWidgetsとしてホーム画面に出したり、AlfredのHotKeyでワンタッチで表示したり、部屋に電子ペー
自分のTweetsをインクリメンタル検索できるサービス作成キット と Tweetsをまとめて削除するツールを書いた
自分のTweetsをインクリメンタルに全文検索できるmytweetsを作りました。 また、自分のTweetsをtextlintや単語感情極性対応表や辞書ベースでフィルタリングしてまとめて削除するdelete-tweetsを作りました。 どちらもTwitterのアーカイブを使って今までのすべてのTweetsを対象にしています。 そのため、どちらも最初に次のドキュメントに従って、Twitterのデータアーカイブをダウンロードしておく必要があります。(申請から1日ぐらいかかります) 全ツイート履歴とツイートをダウンロードする方法 | Twitterヘルプ mytweets mytweetsは、Twilogやツイセーブのように自分のTweetsの履歴を全文検索できるサイトを作るツールキットです。 Twitterのデータアーカイブをインポートするので過去全ての履歴に対応していて、 また新しいTwee
寄付研究や慈善活動について研究するために色々な書籍や論文を読んだメモ書き
最近、寄付研究とかファンドレイジングというような分野があるので知って、それを調べるのに色々な書籍や論文を読んでいたのでメモ書き。 ワクチン開発周辺の寄付金事情 調べたこと考えたことメモ - 日々の記録 色々な書籍を通して寄付と慈善活動(Philanthropy)においては、次のコンテキストが出てくることが多い。 CharityとPhilanthropyを区別している チャリティ(Charity) = 問題を軽減する = 魚を与える 慈善活動(Philanthropy) = 問題を解決する = 魚の釣り方を教える 慈善事業とベンチャー アメリカでは特に慈善事業においてベンチャー精神の話がでてくる この2つは近い部分があると感じた 1981年にBill Draytonが起業家の概念を導入して、社会問題に取り組むために次のような概念を慈善活動に導入した 今まで組織ばかりにフォーカスしていたのを、
GitHub Issuesを個人用のTodo管理アプリとして使っている
個人的なタスク管理ツールとしてGitHub Issueを使うようにしてその仕組みを色々と作っているので、そのアーキテクチャについてのメモ書きです。 後述しますが、GitHubをベースとすることでプログラムでの拡張性が高いというのが特徴です。 セットアップが色々と必要になるためぱっと再現しやすい感じではなかったり一部未公開になってます。 需要があったらオープンソースとして公開できるように整えます。 GitHub Issuesとタスク管理ツールでの課題 自分の中で、タスク管理ツールとGitHub Issuesを両方使う場合に次の課題がありました。 自分のタスクの半分以上はGitHubに何かしら紐づく情報(オープンソース、ブログ、仕事)であったため、GitHub Issueとの二重管理感がある GitHub上で複数のリポジトリのタスクを管理するのが難しい 1つ目は、タスク管理ツールを使っても結局
VSCodeで音声読み上げでの文章デバッグする拡張 - vscode-read-aloud-text
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
Oculus GoのブラウザにPCからテキストデータを渡してフォームに入力できるブックマークレットとアプリ
Oculus GoのブラウザにPCからテキストデータを渡してフォームに入力できるツールを書きました。 擬似的にOculus GoのブラウザでPCのクリップボード貼り付けを行えるよという感じです。 azu/no-clipboard-app: Share your clipboard text to your device like Oculus Go. Oculus Goには日本語IMEやクリップボード機能がありません。 これはOculus Go上のブラウザでも同様です。 Oculus GoのブラウザについてのWeb開発者目線からのまとめ - Qiita Chromeがデフォルトです。Samsung Internet VRもapkをadb経由で入れると動きますがこちらもクリップボード機能はありません。 そのため、日本語を入力する手段がなかったり長いテキストをOculus Go上で入力するのは
ECMAScript 2015以降のJavaScriptの`this`を理解する
この記事はJavaScriptの入門書として書いているjs-primerのthisに関する部分をベースにしています。 またjs-primerでは書けなかった現在時点(2018年1月1日)でのブラウザの挙動についてを加えたものです。 次の場所にjs-primer版（書籍版）のthisについての解説があります。 この記事と違って実際にコードを実行しながら読めるので、学習ソースとしては書籍版を推奨します。 書籍版: 関数とthis · JavaScriptの入門書 #jsprimer また、バグ報告やPRも直接リポジトリにして問題ありません。 asciidwango/js-primer: JavaScriptの入門書 おかしい場所を選択した状態で右下にある”Bug Report”ボタンを押せば、簡単にtypoとかのバグを報告できます。(PRでも歓迎) 前置きはこの辺までで、ここから本編。 この記
NaNはNot a NumberだけどNumber型である話
この記事では、JavaScriptのNaNについて改めて学ぶという趣旨の話をします。 JavaScriptで、文字列などから数値へ値を変換したいことがあると思います。 典型的なケースでは、ユーザーに入力してもらった数字となる文字列を、Number型へ変換するというケースです。 この場合、Numberコンストラクタ関数やNumber.parseInt、Number.parseFloatなどが利用できます。(ここでは、Number.parseIntにしていますが、parseIntと同じです) // ユーザー入力を文字列として受け取る var input = window.prompt("数字を入力してください", "42"); // 文字列を数値に変換する var number = Number(input); console.log(typeof number); // => "number
performance.markでパフォーマンス計測する
JavaScriptである区間にかかった時間を計測する時に、次のようなコードを書いたことがあると思います。 const start = performance.now(); // 処理 // 色々な処理がすべて終わった doSome(() => { console.log(performance.now() - start); }) Performance Timelineのperformance.markとperformance.measureなどを使うと、ある区間の処理時間をもっと簡単に取ることができます。 APIについて詳しくは以下の記事を見るといいと思います。 User Timing API: あなたの Web アプリをもっと理解するために - HTML5 Rocks Performance.mark() - Web API インターフェイス | MDN 簡単に解説すると perf
今すぐ電子書籍(技術書)を書き始める方法と文章の自動チェック
電子書籍開発環境 Markdownで書く電子書籍開発環境というスライドで、GitBookとMarkdownで技術書(電子書籍)を書く話を紹介しました。 文章はtextlintで、コードはESLintとテストでチェックして、サンプルコードに対してテストを書けるプロジェクト構造について書かれています。 どのように表記揺れなどやコードの間違いを防ぎながら、書籍を開発していくかについて書いているので詳しくは上記のスライドを見て下さい。(スライドの下へスクロールすると文章版が載ってます) スターターキット 上記の設定をすぐに使えるようにスターターキット的なものを作りました。 azu/gitbook-starter-kit 実際にこのgitbook-starter-kitを電子書籍とした時の表示は以下で見ることができます。 GitBook Starter Kit - GitBook インストール 利用
ブラウザ毎のリリースノートや実装状況はどこを見ればいいかをまとめました
最近、Microsoft、Mozilla、Google、Appleといったブラウザベンダーが積極的に情報を発信するようになったのもあって、公式の情報でもどこを見ればいいのかがわからないという状況が起きてる気がします。 (主にSNSで流れてくるものを見るのがメインストリームになってるので、そういうことを気にしなくなったというのもあると思いますが) なので、ブラウザ毎にリリースノート(Changelog)、実装状況、公式のブログ、バグ報告の場所などをまとめました。 azu/browser-javascript-resource 更新がしやすようにGitHubのREADMEとして置いてるので、継続して見たい人はWatchをするなり、付け足したい情報や訂正したほうがいいものはPull RequestやIssueを送ってくださるといいと思います。 まとめてみると、Microsoft Edgeは一本道
ブラウザでビジュアルテストをするreftest-runnerを作った
概要 reftest-runnerというブラウザで描画内容やレイアウトといった表示結果をテストするためのライブラリを作りました。 要素技術としてはブラウザ、WebDriver API、レンダリングキャプチャ、画像Diffという感じです。 azu/reftest-runner 時間が無い人向け 以下のスライドに簡単にreftest-runnerやreftestとはなにか、どういうユースケースがあるのかが書いてあります。 reftest-runner-overview.pdf reftestとは reftest(Referrence Test)とは、2つのHTMLの表示結果(スクリーンショット)を比較することで表示結果が意図したものかをテストする方法です。 用意するHTMLとして以下の2種類を1セットとして用意して利用します。 テスト用HTML テストしたい機能を使って実装したHTML リファ
The Refactoring Tales - JavaScriptのリファクタリング本を読んだ
GitHub: jackfranklin/the-refactoring-tales 読んだ日付: 2015年1月11日 まだ4章の途中までしか書かれてないですが、ウェブ版は無料で読めてPDF版等は買えるようになるようです(6-7章ぐらい予定) The Refactoring Tales - JavaScript Playground またGitHubにソースが公開されています(ウェブページはまだ反映されてない感じのtypoの修正等がありました) 感想 1,2章はフロントのJavaScriptで、jQuery世界を例にjQueryでべったり書いてしまったものをどうやって分けていくかの話。 1章はとても読みやすくて完成度もあるので読んでみるといい気がします、2章のカヌーセルの話はもっと深くやっても良かったような気がします。 縦に並ぶ$を見かけるとつらい感じになりますが、まずは手が出しやすい場
status.modern.IEの見方
2014年5月ぐらいにInternet Explorerの機能別の開発状況が掲載されるstatus.modern.IEが正式公開されました。 Launching status.modern.ie & Internet Explorer platform priorities - IEBlog - Site Home - MSDN Blogs Internet Explorer Web Platform Status and Roadmap - status.modern.IE このサイトでは以下の5つのステータスで機能別の開発状況が載っています。 Not currently planned : 今のところ予定なし Under Consideration : 実装を検討、調査中 In Development : 開発中 Preview Release : プレビューリリース版に実装済み IE
ブックマークレットを作るコマンドラインツール
使い方 使い方は簡単で、ファイル名を渡すかパイプでJavaScriptコードを渡せば、javascript: から始まるブックマークレットとして使える文字列を返してくれます。 $ bookmarkletter code.js # or $ cat code.js | bookmarkletter # Broserifyと合わせるケース $ browserify code.js | bookmarkletter
ウェブの仕様は今どこにあるのか？
Webの仕様 ウェブの仕様といえば、W3CやWHATWG、IETFとかが思い浮かぶかもしれません。 これらの仕様が最近ではメーリングリストやIRCといった旧来のところだけではなく、GitHub上で議論されて策定が進められている事が増えています。(両方使ってるという話) この記事はそのような方法で進められてる仕様等についての紹介です。 ＊ 自分自身はそこまで仕様に対して強い興味があるわけではないので、もっと詳しい方が正しくまとめて頂きたいです。。 最初にMove The Web Forward | Guide to getting involved with standards and browser developmentを見ておくといいかもしれません。 JavaScriptの仕様 この動きが多く見られるのがJavaScript(ECMAScriptやDOM APIを含む)周りの仕様につい
GitHubでライブラリのリリースを見ていくためのツールや方法
GitHubでのリリース 前回、GitHubのRelease機能ついて書きましたが、これはリリースする側の自動化等についてでした。 git tagとGitHub ReleasesとCHANGELOG.mdの自動化について | Web Scratch 今度は、いわゆるライブラリユーザーだったりソフトウェアの利用者側から、 GitHubでリリースされるものをどう追っていくかについて書いていきたいと思います。 自分は、JSer.infoというJavaScriptの情報を見ていくサイトをやっているので、 JavaScriptのライブラリ等のリリース情報をどう追っていくかが中心になりますが、基本的にGitHubでリリースされてるならやり方は大きな違いはありません。 基本的には以下に色々書いていた内容のGitHubに関してをまとめた感じの記事となっています。 最近のJavaScript情報の探し方 ·
Greasemonkey2.0対応 - LDRFullFeed、LDR NG、ldr_keyhack_jkc+n
Greasemonkey2.0ではFirefoxの変更に合わせて、セキュリティ周りの変更がありました。 それにより、色々なGreasemonkeyがそのままだと動かなくなっています。 Changes to unsafeWindow for the Add-on SDK | Mozilla Add-ons Blog Greasespot: Greasemonkey 2.0 Release UserScriptのGreasemonkey 2.0対応 | monoの開発ブログ 動かない原因は大きく分けて2つあります。 @grant none がデフォルトになった unsafeWindowの挙動が変わった(Firefox側の変更) @grant none @grant - GreaseSpot Wiki UserScriptのGreasemonkey 2.0対応 | monoの開発ブログ に詳しい
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
