1Passwordを使って、ローカルにファイル(~/.configや.env)として置かれてる生のパスワードなどを削除した
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
メールの受信トレイを空にするInbox Zeroを始めた
Gmailをメーラーとして使ってますが、メールを開くのがいまだに苦手です。 これをどうにかしようと、メールをもっと気軽に消せる方法はないかなーと思ってInbox Zeroを思い出したのでやり始めました。 次の記事や動画を参考にしています。 Inbox Zero and the Inbox Zero Method — everything you need to know 【15分で完了】1度設定したら戻れない、受信トレイ0生活 | おかんの給湯室 My Complete Inbox Zero Workflow (in 2022)! - YouTube 基本的には、この動画を参考にして設定しました。 Inbox Zeroの設定方法 細かい設定は参考にした動画や記事の方に任せます。 Gmailの”設定”でやること 詳細タブ [ ] 自動表示 を有効化(アーカイブしたときに次のメールを自動で開く
[JavaScript] URLを文字列結合で組み立てないために、url-cheatsheetを作った
[JavaScript] URLを文字列結合で組み立てないために、url-cheatsheetを作った URLを文字列結合で組み立てると色々問題が起きやすいので、それを避けるためにURL APIやURLSearchParams APIでURLを組み立てるパターンをまとめたチートシートを作りました。 azu/url-cheatsheet: URL manipulation cheatsheet for JavaScript URLにユーザーが入力した文字列を含めるときはencodeURIComponentでエスケープする URLはプレーンな文字列ではなく構造化された文字列(文字の並びに意味がある文字列)として扱わないと、さまざまな問題を抱えやすいです。 たとえば、次のように文字列結合でURLを組み立てるとパストラバーサルの問題があります。 name に ../../adminのような文字列が
パスワード管理/MFA管理の戦略
自分のパスワードやMFA(多要素認証)の管理方法についてまとめた記事です。 パスワード管理とTOTP(Time-based One-time Password)の管理として1Passwordを使い、MFA(多要素認証)の2要素目としてYubiKeyを2枚使っています。 パスワード管理とMFA管理を安全で使いやすくするのはかなり複雑で難しいため、完璧にやるのが難しいです。 そのため、その難しさから二要素認証を設定するべきアカウントも手間などから設定を省いてしまったり、管理方法に一貫性がありませんでした。 この記事では、パスワード管理/MFA管理の戦略を決めることで、どのサイトのどのアカウントのパスワード管理をあまり頭を使わなくてもできるようにするのが目的です。利便性と安全性のバランスを意識はしていますが、この記事のやり方が正解ではないので、各自の目的に合わせて読み替えると良いと思います。 用
1Password for Open Source Projectsの申請をした
1Passwordは、オープンソースプロジェクトの開発者が無料で1Passwordを利用できる1Password for Open Source Projectsというものをやっています。 1Password for Open Source Projectsで申請が通ると、Teamプラン相当が無料(無期限)で利用できるようになります。 1PasswordのAccount(組織/チームのこと)に所属してるMemberは、それぞれ個人のパスワード管理機能とAccount(チーム)で共有するパスワード管理機能が利用できるようになります。 1Password/1password-teams-open-source: Get a free 1Password Teams membership for your open source project チームのための手間いらずで安全なパスワード管理 |
The Missing README: A Guide for the New Software Engineerを読んだ
The Missing README: A Guide for the New Software Engineerを読んだ The Missing READMEという新人ソフトウェアのためのエンジニアガイドの書籍を読んだ感想です。 The Missing README learning.oreillyで読める The Missing README: A Guide for the New Software Engineer 2021年8月10日 に出版された書籍 The Missing READMEはコード、設計、テスト、リファクタリング、例外処理やログ、依存管理、コードレビュー、CI/CD、インシデント対応、コミュニケーションやプロジェクト管理など幅広いことがすっきりとまとまってる感じの書籍です。 全体的に説明に出てくるコードは少なめです。逆を言えば特定のプログラミング言語に依存していな
JavaScriptの歴史については「JavaScript: The First 20 Years」を読む
JavaScript/ECMAScriptというプログラミング言語の歴史について書いた文章はWikipediaなどいろいろなものがあります。 その中でも、ECMAScript 2015のSpec EditorであるAllen Wirfs-Brockによって書かれた”JavaScript: The First 20 Years”が特におすすめです。 JavaScript: The First 20 Years JavaScript: The First 20 Years | Zenodo “JavaScript: The First 20 Years”はHOPL IV - History of Programming Languages向けに書かれたPaperです。 JavaScriptの誕生からECMAScriptの策定、ECMAScript/JavaScript各バージョンでの違い、ブラ
Markdownで年表的なタイムラインを管理するツール
mdlineというMarkdownでタイムライン(年表)を書いて、HTMLなどの形式にしたりできるパーサ、ジェネレーターなどのツールを書きました。 特定の記法で書いたMarkdownから年表的なタイムラインを作成するツール書いた。 $ npx mdline ./timeline.md -o timeline.html 現在はMarkdown to HTMLができる。https://t.co/7Vv0DUmYkX pic.twitter.com/oYJICloElA — azu (@azu_re) January 20, 2019 たとえば、次のようにECMAScriptのタイムライン(年表)をmdlineが決めたMarkdown形式で書きます。 （実際にはただのMarkdownなのですが、次のように 日付: タイトル とHeaderのレベルを合わせるとタイムラインとして扱う感じです) ##
JavaScriptの入門書を jsprimer.net で公開しました | Web Scratch
ここ数年書いているJavaScript入門本ですが https://jsprimer.net/ というURLで無料で公開しました。 まだ開発中です これからJavaScriptを始める人がES2015以降をベースにして学べる本 プログラミングをやったことがあるが、今のJavaScriptがよくわからないという人が、今のJavaScriptアプリケーションを読み書きできるようになるもの Webサイト: https://jsprimer.net/ リポジトリ: asciidwango/js-primer: JavaScriptの入門書 もともと公開してありましたが、jsprimer.net というドメインを取ったのでURLが変わっただけです。リダイレクトされているので既存のブックマークはリンク切れにはなりませんが、気になる人はブックマークしなおしてください。 またリポジトリ（asciidwan
LDRライクなRSSリーダのIrodr 1.0.0をリリースした | Web Scratch
InoreaderのPCフロントエンドとして動くRSSリーダのIrodrが十分安定したので1.0.0をリリースしました。 LDRライクなInoreaderクライントのIrodr 1.0.0リリース。https://t.co/oco0VlPbBDhttps://t.co/UTPYfW3FnW pic.twitter.com/GzKLSj9zeo — azu (@azu_re) September 30, 2018 Release Release 1.0.0 · azu/irodr IrodrはLDRライクな操作感を実現するために作成したInoreaderのフロントエンドです。 RSSの管理やRSSのクロールなどはInoreaderが行っていて、IrodrはAPI経由でRSSを取得しているだけです。 未読などはInoreaderと同期しているため、Inoreaderのウェブ版やモバイルアプリと
Clean ArchitectureとBuilding Evolutionary Architecturesを読んだ
Clean Architectureという本とBuilding Evolutionary Architecturesという本を最近読んだのでざっくりとしたメモ。（両方共2-3時間ぐらいでざっくりとしか読んでないので、解釈間違いは普通にありそうです） 両方共アーキテクチャに対するメタ的な視点な部分があるので、合わせて読むと面白いかも。 Clean Architecture(Clean Codeの人のシリーズ)という本を読んだ。 Clean Architecture: A Craftsman’s Guide to Software Structure and Design | InformIT PDFとかEpubとかMobiが買える Robert C. MartinのClean *シリーズでいわゆるクリーンアーキテクチャそのものだけを扱ったという内容ではない。 でもクリーンアーキテクチャについ
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でも歓迎) 前置きはこの辺までで、ここから本編。 この記
ページ上でずっと動いているsetTimeout、setInterval、requestAnimationFrameを見つけてパフォーマンス改善する
ページ上でずっと動いているsetTimeout、setInterval、requestAnimationFrameを見つけてパフォーマンス改善する 複雑なウェブアプリケーションになってくると、1つのページで複数のTimerなどを回すことがあります。 例えば、Twitterのようなアプリならば、ポーリングで更新するためにsetInvervalのようなタイマーを回します。 また、ゲームなどCanvasで描画を行うアプリケーションならば、メインループをrequestAnimationFrameで回します。 このように色々なタイマー系がありますが、アプリが多機能になっていくと色々なタイマーが同時に動くようになっていきます。 特に問題がなりやすいのが表示中だけタイマーを回すコンポーネントです。 よくあるのが次のようなmount時にtimerを開始して、unmount時にtimerを停止するコンポーネ
ECMAScriptの情報サイトを始めて1年経った
ECMAScript Daily そういえば、ECMAScript DailyというECMAScriptの情報サイトをやってます。 2015年12月ぐらいに始めたので、1年ぐらい経ってましたがそういえばブログ書いてないことに気づいたので書いています。 基本的にはJSer.infoのECMAScript特化版という位置づけで、基本的な更新スタンスはJSer.infoとは変わらないです。 週一とかではなくて、新しい情報がでたら直接更新のスタイルなので、Realtime JSer.info(JSer.infoのリアルタイム版)の方がより近いです。 記事自体もほぼリンクだけに近いので、Twitter(@EcmascriptDaily)で見たほうが分かりやすいかもしれません。 Follow @EcmascriptDaily 週1でまとめて見たい場合はECMAScript Dailyからメールマガジン
アーキテクチャをめぐるたび
タイトルに特に意味はありませんが、Alminを作る参考にしたものをまとめた感じの記事です。 スライド: 複雑なJavaScriptアプリケーションを考えながら作る話 リポジトリ: azu/large-scale-javascript: 複雑なJavaScriptアプリケーションを作るために考えること 主に書籍を並べていますがその他のスライドなどの参考資料は以下にまとめてあります。 large-scale-javascript/refs.md at master · azu/large-scale-javascript 自分用のメモなので、読んだ順で並べておきます。 右側の年は書籍の出た年です。 実践ドメイン駆動設計 @ 2013 一番最初に読んだDDD系の本。 この辺ででてくるレイヤーとか用語を把握した感じ。 けど、そこまでよく分かってない感じはする。 カウボーイが出てくるの読みにくい。
JavaScript Plugin Architectureというプラグイン設計について学ぶ無料の電子書籍を書いた
JavaScript Plugin ArchitectureというJavaScriptのプラグイン設計についての電子書籍を書きました。 この書籍はJavaScriptのライブラリやツールにおけるプラグインアーキテクチャについて見ていく事を目的としたものです。 以下の形式で読むことができます。 Web版 PDF形式 ePub形式 Mobi形式 GitHub上にソースコードも公開されているでので直接Markdownファイルを読むこともできます。 MarkdownよりはWeb版の方が見やすいのでそちらをオススメします。 Twitterのハッシュタグは#js_plugin_book 更新情報はRSSやリリースノートから見ることができます。 v1.0.0 最初に書くと決めたプラグインアーキテクチャが揃ったので1.0.0としてリリースしました。 JavaScript Promiseの本の時と同じく、継
[iOS] JavaScriptの話題を英語で聞く
あいかわらず英語ができなくて、読むのは時間かければできなくはないかもしれないで、リスニングが結構厳しい感じです。 あいかわらず英語の勉強が長続きしないので、JavaScriptのついでに英語のリスニングができると良さそうかなと思ったのと、移動中に聞けるといいなと思ってちょうどいいものを探していました。 JavaScriptのPodcastサイトでJavascript Jabber - DevChat.tvというサイトでは、Podcast(音声)とTranscript(文字起こし)が一緒に公開されています。 ゲストもBrendan EichだったりReactのPete Huntだったりやたら豪華なことが多いので、内容も面白いです。 このPodcastで英語を読みながら聞くと良さそうと思って最近結構聞いています。(ただし一つ一つが長い…) 動画でもいいようなきがするのですが、ちょうどいい題材が
JavaScriptのコードを分解してよく使われてる機能を分析する
今年のOSS活動振り返り @ 2015 | Web Scratchで JavaScript/ECMAScriptを改めてどう学べばいいのか考える azu/how-to-learn-es6とか#thinking_in_es6で考えてるやつ というのを今年考える事としてあげていました。 それを考えるために、既存のコードがどうなってるかを見てみるという話です。 具体的には既存のコードを見て、そこでどういう機能/構文が多く使われているのかが分かれば、どこを中心的に学ぶと結果が出やすくなるのではという感じです。 それを分析するためにazu/es-usage-rateというツールを書いた。 Installation 使い方 例えば、es-usage-rate自体がどういう構文を使って書かれてるかを見てみてます。 es-usage-rateは他のCLIと組み合わせて使う事を前提としてるので、 デフォルト
はてなブックマーク検索を作りながらFlux Utilsについて学ぶ
facebook/flux 2.1.0からFlux UtilsというStoreなどの実装が含まれるようになりました。 今回Flux Utilsを使って、指定したアカウントのはてなブックマークを検索するウェブアプリを書いてみました。 azu/hatebu-mydata-search azu.github.io/hatebu-mydata-search/ mydataのAPIがCORS対応してないのでJSONProxyを挟んでます。(なのでブックマークデータが多いアカウント名は避けたほうが…) これを作ってみてFlux Utilsについて思ったことを書いていきます。 Flux Utilsの紹介ページに、Flux Utilsの解説が書かれています。 簡単にまとめると以下の4つのクラスがFlux Utilsとして提供されています。 Store ベースとなるクラス ReduceStore Store
npmパッケージをExampleテストしよう
自分がそう呼んでいるだけなので、正式名称があるのかよくわかりませんが、 あるライブラリを公開する際に、exampleディレクトリにそのライブラリを使って実際に動くサンプルコードを作って、それを実行するテスト というのを示しています。 Go言語のExampleと近いような気がします。 testing - The Go Programming Language 以下のスライドでも簡単に解説してますが、この記事はExampleテストのメリットやNodeモジュールでのやり方について書いていきます。 ロジック、E2E、描画、音、動画、Example、文章 - 色々なJSテスト Exampleテストの利点 以下は思いついたExampleテストの良いところですが、これについて簡単に解説します。 始めるのが簡単 実際に動くサンプルコードが作成できる ドキュメントの一部になる package.jsonの設定
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
