タグ

ブックマーク / efcl.info (21)

  • 私のJavaScriptの情報収集法 2024年版

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

    私のJavaScriptの情報収集法 2024年版
  • npm/yarn/pnpm/bunを同じコマンドで扱える ni のzsh実装を書いた

    niという npm/yarn/pnpm/bun を同じコマンドでインストール/アンストールコマンドを実行できるツールがあります。 antfu/ni: 💡 Use the right package manager 仕組み的には、各パッケージのロックファイルやCorepackで決められたpackageManagerフィールドの値から、どのパッケージマネージャを使うかを判断しています。 たとえば、package-lock.jsonがあるプロジェクトなら npm を使ってるので、niコマンドは npm のコマンドを実行します。 また、packageManagerフィールドがyarn@<version>になっている場合は、niコマンドは yarn コマンドを実行します。 なぜこういうツールが必要になるかというと、npm や yarn などのパッケージマネージャは、それぞれのパッケージマネージャの

    npm/yarn/pnpm/bunを同じコマンドで扱える ni のzsh実装を書いた
  • パスワード管理/MFA管理の戦略

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

    パスワード管理/MFA管理の戦略
  • 1クリックで始めるGitHubリリース as a ブログ

    GitHubリリースという、GitHubでタグに対してリリースノートを書ける機能があります。 このリリースノート機能は、パーマネントリンクもあるし、Markdownも書けるし、画像もアップロードできるし、絵文字でリアクションもできるし、RSSもあるし、通知機能もあるし、GitHub Discussion連携すればコメントも書けるし、全文検索もついてくるしこれブログとして使えるんじゃないかと思いました。 そういう発想から、GitHubリリースノートをブログとして運用するためのちょっとしたブログシステムを作って使っています。 次のリポジトリが実際に動いてるものです。 azu/book-review: を読んだ感想を書くブログです。 リリースの一覧を見るとの感想の記事が並んでいます。 Releases · azu/book-review Release 伴走型支援: 新しい支援と社会のカタチ

    1クリックで始めるGitHubリリース as a ブログ
  • 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の

    Maintainer Month: なぜtextlintを作ったか
  • JavaScript Primer 2.0 - ECMAScript 2020に対応した入門書を公開しました

    ECMAScript 2020の変更に対応したJavaScriptの入門書としてJavaScript Primer 2.0.0を公開しました。 JavaScript Primerのウェブサイトから閲覧できます。 ウェブサイト: https://jsprimer.net/ サマリIssue: ECMAScript 2020の対応 · Issue #1145 · asciidwango/js-primer 変更内容の詳細はリリースノートを参照してください。 Release 2.0.0: ECMAScript 2020対応 · asciidwango/js-primer 2.0.0の目的 JavaScript Primerは、継続的にメンテナンスするためにOSSとして開発しています。 ECMAScriptの仕様は年に一度アップデートされていて、現実でのJavaScriptの使われ方も変化していく

    JavaScript Primer 2.0 - ECMAScript 2020に対応した入門書を公開しました
  • JavaScript Primerを出版しました!/JavaScript Primerはなぜ書かれたのか?

    この3つの原則は書籍の構成にも現れています。 第一部の基文法で「書き方」を学び、第二部のユースケースで「作り方」を学べるようになっています。 「学び方」は、章としてではなく全体的な流れとして取り入れることにしました。 なぜなら、「学び方」自体は学びたいことによっても異なる方法を取る場合があります。 そのため、「学び方」で個別の章とするよりは、他の章で「書き方」や「作り方」と一緒に見たほうがよいと考えたためです。 たとえば、基文法などの学び方にはMDNのようなリファレンスサイトを見たほうがいいし、 アプリケーションの作り方は実際のサイトなどを参考にしたほうがよいためです。 第一部と第二部がどのように書かれたのかをざっくりと振りかえってみます。 第一部: 基文法 第一部: 基文法はJavaScriptの基的な文法について扱っています。 プログラミングの入門書で文法については避けること

    JavaScript Primerを出版しました!/JavaScript Primerはなぜ書かれたのか?
  • textlintで日本語の文章をチェックする

    textlintMarkdownなどテキスト向けのLintツールで、テキスト版ESLintみたいな感じのツールです。 JavaScriptでルールを書けるテキスト/Markdownの校正ツール textlint を作った | Web Scratch 最近azu/JavaScript-Plugin-Architectureという小さな書籍を書いていて、色々簡単に使えるような仕組みを追加しています。 この記事では簡単なtextlintの導入方法について紹介します。 公式サイトには一部ルールを含むオンラインデモが公開されています。 textlint · The pluggable linting tool for text and markdown ドットインストールにてNode.jsのインストール、textlintの利用方法、エディタとの連携などのチュートリアルが公開されています。Node.

    textlintで日本語の文章をチェックする
  • 歌舞伎座.tech#6「VirtualDOMとReact」 アウトラインメモ

    歌舞伎座.tech#6「VirtualDOMとReact」 - connpass に参加して来たのでメモ。 すべてのCSSに死を!これはJSerの叫び!- @kyo_ago スライド: CSSに死を!これはJSerの叫び! #kbkz_tech CSSが辛い CSSはカプセル化とか継承とか、プログラムからの概念がそのまま持ってこれない ReactStyle js-next/react-style JS内にStyleを埋め込むことができる そのままオブジェクト的に入れられる Template Stringsと合わせればその場でCSSを入れることができる styles=にスタイルを入れる セレクタをあまり考えなくていい style属性でスタイリングする 擬似要素、擬似クラスが全滅 :hover :active などが使えない。 CSSの継承などの概念が消える 自分で頑張る必要がある ユーザプレ

    歌舞伎座.tech#6「VirtualDOMとReact」 アウトラインメモ
  • 東京Node学園祭2014 アウトラインメモ

    東京Node学園祭2014 に参加してきたのでその時のメモ 企業JavaScript飯 #企業JavaScript飯というご飯イベントをNode学園祭のお昼に(勝手に)やってました。 @teppeis、@ahomu、@kyosuke、Layzie (敬称略)で企業内でのJavaScript状況ですかという感じの話をしてきました。 質問テーマのスライド: https://github.com/azu/slide/raw/gh-pages/nodefest2014/lunch.pdf という感じのテーマを元に話をしてきました。 参加していただいた皆さん興味深いお話ありがとうございました。 最近企業のJavaScript(er)ってどんな感じになってて、どういうものを求めているのかに興味を持ってるので、面白い話があったらお話きかせて下さい。(to @azu_re にmention) どうやったら

    東京Node学園祭2014 アウトラインメモ
  • power-assertでJavaScriptのテストをする ブラウザ編

    power-assertという単純なアサーションでも、テストが失敗した時に分かりやすい情報を出せるテストライブラリ/ツールについての記事です。 前回、power-assertの使い方 Node.js編 | Web scratchではpower-assertの動作やNode.jsプロジェクトでの簡単な導入方法について解説しました。 前回のpower-assert + gulpで紹介したプロジェクトをそのまま使っていくので、見ていない場合はそちらから見ていたほうがいいかと思います。 今回は、ブラウザでのpower-assertの動かし方とデバッグについて書いていきたいと思います。 今回扱う実行環境 Node.js <= 前回 ブラウザ Browserify 前回やったこと まずは前回紹介したgulp + power-assertのプロジェクトを元にやっていきます。 azu/power-asse

    power-assertでJavaScriptのテストをする ブラウザ編
  • ウェブの仕様は今どこにあるのか?

    Webの仕様 ウェブの仕様といえば、W3CやWHATWG、IETFとかが思い浮かぶかもしれません。 これらの仕様が最近ではメーリングリストやIRCといった旧来のところだけではなく、GitHub上で議論されて策定が進められている事が増えています。(両方使ってるという話) この記事はそのような方法で進められてる仕様等についての紹介です。 * 自分自身はそこまで仕様に対して強い興味があるわけではないので、もっと詳しい方が正しくまとめて頂きたいです。。 最初にMove The Web Forward | Guide to getting involved with standards and browser developmentを見ておくといいかもしれません。 JavaScriptの仕様 この動きが多く見られるのがJavaScript(ECMAScriptやDOM APIを含む)周りの仕様につい

    ウェブの仕様は今どこにあるのか?
  • JavaScript Promiseの本を書きました | Web Scratch

    JavaScript Promiseのという無料で読める電子書籍を書きました。 タイトルそのままで、JavaScriptのPromiseについて書いた書籍です。 書籍の目的 この書籍を読むことで学べる事として、次の3つを目標にして書きました。 Promiseについて学び、パターンやテストを扱えるようになる事 Promiseの向き不向きについて学び、何でもPromiseで解決するべきではないと知る事 ECMAScript6 Promiseの基をよく学び、発展した形を自分で形成できるようになる事 Promiseは、次のECMAScriptの言語仕様として策定が進められていて既に多くのブラウザに実装されています。 Promiseについて扱う書籍ですが、この機能はjQuery.Deferred()やAngularJSの$qやBluebird等の類似の機能が既にあるため扱ったことがあるかもしれま

    JavaScript Promiseの本を書きました | Web Scratch
  • 桜JSでご飯を食べながらLT大会をした

    #桜JSでご飯をべてきた #桜JS – Togetterまとめ さくらのクラウドのCLIについて – azu SAKURA(Internet Cloud).js CLIがnode.jsの実装されてるので見ていく node v0.12で変わること – yosuke_furukawa これからのNode.jsの話をしよう // Speaker Deck Tracing API 同期的なchild_process API そもそもNodeでそういうツールに無理があったのでは感 Jake node.jsで書かれたものを配布するならnode.jsで書かれたものを使う的な流れ Build tools written in JavaScript TypeScriptもJake – To Build TypeScript Take? 1年後ぐらいのモバイルHTMLゲーム – tkihira #桜js コ

    桜JSでご飯を食べながらLT大会をした
  • 寿司jsでPromisesの基礎について発表してきた

    寿司.js でPromisesのキホンについて発表してきました。 #寿司js – Togetterまとめ Promises Starter Promises StarterではPromiseの基的な部分だけなので、Pormise.all等実際に使うと便利的な話は入れてないです。 PromiseのAPIの概要、Promiseの状態の種類、基的なresolve/rejectの流れ、XHRの例、エラーハンドリングについてがメインな感じです。 続きはウェブで ということで、今azu/promises-bookというものを書いているので、 ここが分かりにくいとかここが間違ってるとか、こういうこと書いたほうがいいとかあったらフィードバックお願いします。 まだ全然書き途中なのですが、書いていく内容については[WIP] この書籍で扱う内容について by azu · Pull Request #1 ·

    寿司jsでPromisesの基礎について発表してきた
  • TypeScript初心者向け勉強会アウトラインメモ

    TypeScript初心者向け勉強会 : ATND に参加してきたメモ TypeScriptを使ったほうがいい場面、使わないほうがいい場面 TypeScriptを使う場面、使わない場面 型、クラス、モジュール、インターフェイス がある 型 変数や引数などに型を指定できる なんでも示すany var name: string = “hoge”; // functionでも // 引数にstringを受けて -> numberを返す function parseNumber(str: string) : number{ } クラス class syntax ES6のclass syntaxに型指定(ES6にはないので)を持ってくれば大体似たような感じになる モジュール .NETの名前空間に相当するもの モジュール内のクラスや関数を export の有無で外部に公開するかを指定できる インターフ

    TypeScript初心者向け勉強会アウトラインメモ
  • 定期更新されるJavaScript等の情報サイトをまとめたMeta-Weeklyというサイトを作りました

    はじめに JavaScript Weekly や 私がやってるJSer.infoなど、 週刊などでJavaScript等の情報について紹介するサイトがここ数年でかなり多くなりました。 詳しくはオフライン勉強会でJSer.info一周年について発表してきた | JSer.infoでも乱立するまとめサイトとして触れています。 それらのサイト、メールマガジン、ポッドキャスト等をまとめたMeta Weeklyというサイトをつくったという話です。 Meta Weeklyって何? Meta Weekly は 単純にそれらのサイトをまとめたリンク集のようなものです。 基的にまとめているサイトは、フロントエンドJavaScriptに関連するような生きているサイトをリストアップしています。 機能らしい機能はDaily, Weeklyなどでフィルターするぐらいしかありませんが、RSSがあるサイトなどはそれ

    定期更新されるJavaScript等の情報サイトをまとめたMeta-Weeklyというサイトを作りました
  • 第4回「ブラウザー勉強会」 アウトラインメモ

    第4回ブラウザー勉強会 第4回「ブラウザー勉強会」 on Zusaar に参加してきたので、その時のメモです。 午前の部 : コミュニティ セッション オフラインキャッシュについて – hebikuzure IE のキャッシュのオフライン調査について(改訂版) IE のキャッシュのオフライン調査について の改訂版 Content.IE5 IEのキャシュデータ構造はIE5から変わってなかった Window2000 の頃と同じ IE10のキャシュのシステム変更 IE10ではキャッシュのシステムを変更されてる Content.IE5の中身 index.dat インデックスファイル 英数8文字のキャッシュフォルダ 実際のファイルが並んでる 4個つづキャッシュフォルダを作ってキャッシュを書き込む キャッシュの情報はどこ? 最終更新日時とかのメタデータはどこ? index.datに含まれている バイナ

    第4回「ブラウザー勉強会」 アウトラインメモ
  • testemで任意のHTMLでテストを動かす方法とJavaScriptデバッガ連携

    Test Runnerのtestemを使ったテストについてメモ testem自体については以下などを見るといい気がします。 JavaScriptのテストツール「testem」が素晴らしいぞ | Mach3.laBlog Testem 0.1.0 Released and Screencasts testem の仕組み的には、テストを実行するためのHTMLページを用意して、 testem のローカルサーバ上でそれを表示してテストを実行しています。 testem自体は特にmatcher等は持ってなくて、adapter を書いて、jasmineやBuster.JS、QUnit等の構文を使ったテストを走らせた結果を得られるようにしてます。 Example Projects で紹介されてますが、この辺が充実してるのがtestemのいいところでもあります。 カスタムHTML testem/views

    testemで任意のHTMLでテストを動かす方法とJavaScriptデバッガ連携
  • JavaScriptのいろいろなコーディングルールをまとめてみた

    JavaScriptの書き方はJavaScript自体がある程度自由なためいろいろな書き方ができますが、一貫性を持って書いた方がバグなども発生しにくくなるため、コーディングルールを定めておくのはよいことだと思います(特に複数人の開発の場合) 有名な企業やライブラリはコーディングルールも公開している事が多いので適当にまとめてみました JavaScript style guide – MDC Docs Mozilla/Firefox向けのものなので、一部ECMAScriptの範囲を超えたものも含まれています。 多くの人が見ていると思うので、見たことない人は一度読んでみるといいです。 jscsにこのコーディングルールをチェックするプリセットが用意されています。 Google JavaScript Style Guide Google JavaScript Style Guide 和訳 — Goo

    JavaScriptのいろいろなコーディングルールをまとめてみた