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

  • Node.js 14から18へアップデートする方法について

    Corepackを使ってNode.jsをアップデートする ⬆️⬆️というタイトルで、Node.js 14からNode.js 18へのアップデートする方法について話した。 Node.js 14は4月末でEOLで、Node.js 18までアップデートする必要があるけど、npmの変更が混ざって大変です。 Corepackを使うことで、Node.jsとnpmのアップデートを同時にやらなくても良くなり、問題を分割して対応できます! Corepackを使ってNode.jsをアップデートする ⬆️⬆️https://t.co/mRHsBcYbpn pic.twitter.com/HiiCe7c5YE — azu (@azu_re) April 28, 2023 スライド: Corepackを使ってNode.jsをアップデートする ⬆️⬆️ Note: Node.js 14は2023-04-30でEOLで

    Node.js 14から18へアップデートする方法について
  • JavaScript Primer 4.0.0: ECMAScript 2022に対応したJS本

    JavaScript Primer(jsprimer.net)が、ECMAScript 2022(ES2022)に対応しました。 リリースノート: Release v4.0.0: ES2022 · asciidwango/js-primer これまでのjsprimer ECMAScriptの仕様書は毎年更新されるので、それに合わせてjsprimerも更新しています。 1.0.0(ES2019): JavaScript Primerを出版しました!/JavaScript Primerはなぜ書かれたのか? 2.0.0(ES2020): JavaScript Primer 2.0 - ECMAScript 2020に対応した入門書を公開しました 3.0.0(ES2021): ES2021に対応したJavaScript Primer 3.0を公開しました - JavaScript入門 今回のアップ

    JavaScript Primer 4.0.0: ECMAScript 2022に対応したJS本
  • 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各バージョンでの違い、ブラ

    JavaScriptの歴史については「JavaScript: The First 20 Years」を読む
  • JavaScript ASTを使ったツール(自作、ESLint、Babel、jscodeshift)を実装する話

    JavaScript ASTを使ったツール(自作、ESLint、Babel、jscodeshift)を実装する話 Dive into ASTというJavaScriptのASTを使ったツールの作り方を見ていく話を書きました。 自作の正規表現、ASTチェックツール、ESLint、Babel、jscodeshiftでそれぞれ動くツールを実装してるので、リポジトリにまとめてあります。 スライドではCode Surferを使ってASTや書き方をインタラクティブに解説しています。 スライド: Dive into AST リポジトリ: azu/dive-into-ast: JavaScriptを中心にしたAST(Abstract Syntax Tree)を使ったツールの作り方についての資料です! 自作ASTツール、ESLint、Babel、jscodeshift それぞれでASTを使ったツールをどう実装

    JavaScript ASTを使ったツール(自作、ESLint、Babel、jscodeshift)を実装する話
  • JavaScript Promiseの本 v2リリース、ES2015+に対応、Async Functionの章を追加

    JavaScript Promiseの v2リリース、ES2015+に対応、Async Functionの章を追加 JavaScriptのPromiseについて学ぶ書籍であるJavaScript Promiseの v2をリリースしました。 Promise 1.0.0をリリースしたのは2014年6月ですが、そこから少しづつアップデートしていました。 JavaScript Promiseのを書きました | Web Scratch ES6がリリースされたのでPromiseについて学びましょう | Web Scratch 今回のメジャーアップデートとなる2.0.0では、サンプルコードのコードベースをES2015前提のものへと変更しています。 1.x系からの主な変更点としては次のものがあります。 ES6をES2015に表記を変更 コードベースをES5からES2015+(ES2015以降ベース

    JavaScript Promiseの本 v2リリース、ES2015+に対応、Async Functionの章を追加
  • 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でも歓迎) 前置きはこの辺までで、ここから編。 この記

    ECMAScript 2015以降のJavaScriptの`this`を理解する
  • JavaScriptのライブラリを徐々にTypeScriptに移行する

    Alminというライブラリは元々JavaScript(+Babel)で書かれていましたが、今年の2月にsrc/下のソースコードはTypeScriptに移行しました。 その時のコミットログは次のPRに残っているため、コミットログを1コづつ見ていけばどのように行われていったが分かると思います。 Convert src/ to TypeScript by saneyuki · Pull Request #68 · almin/almin この時取った方法は大まかに次のような手順でした src/ の TypeScript化 Babel -> JS(js -> js)だったものをTypeScript -> Babel -> JSにビルドスクリプトを変更 TypeScriptはtargetをesnextにすることで単純に型を取り除くだけの変換にする ES2015 -> ES5を実際にやるのは既存のBa

    JavaScriptのライブラリを徐々にTypeScriptに移行する
  • pdf.jsなPDFビューアアプリをElectronで作った

    タイトルどおりですが、FirefoxのPDFビューアをスタンドアローン化したようなアプリを作りました。 azu/mu-pdf-viewer: PDF viewer on electron. 特徴は次の通りです。 PDF.jsベース J, Kでスクロールなどいじっています Drag and Dropをサポートしてます Install npm でインストールするか バイナリをダウンロードして使えます(OS Xのみ) https://github.com/azu/mu-pdf-viewer/releases/latest Travis CIとかでelectronを自動ビルドするのがかなり難しくなったので、自分用にOS X版のみバイナリを作ってます。 READMEにその他の環境のバイナリの作り方を書いてあります。 Usage npmでインストールした場合はCLIから起動できます。

    pdf.jsなPDFビューアアプリをElectronで作った
  • 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章のカヌーセルの話はもっと深くやっても良かったような気がします。 縦に並ぶ$を見かけるとつらい感じになりますが、まずは手が出しやすい場

    The Refactoring Tales - JavaScriptのリファクタリング本を読んだ
  • #child_process_sushi でJavaScriptアーキテクチャについて話してきた

    #child_process_sushiで最近やってたJavaScriptの設計の話をしてきた。 Almin.js | JavaScriptアーキテクチャ Fluxとかで上半分は皆やるようになったけど、ドメインモデルとかFluxの場合にビジネスロジックとかをどこに書くとかはまだ未成熟な気がしているので、そのパターンを考えててAlmin.jsというのを書いたという話をした。 Almin自体は大した実装ではないので、サンプルとかドキュメントとしてパターンについて学べるものを書いていきたいイメージ。(このアーキテクチャ話自体は、色々な言語で繰り返しやっては言語が廃れて、パターンがちょっと違う形で残るというのを繰り返している by @t_wada) JavaScriptでもウェブアプリやElectronでのアプリのような、APIを叩いて表示して終わりじゃなくて、ドメインモデルの生存期間が長いものが

    #child_process_sushi でJavaScriptアーキテクチャについて話してきた
  • JavaScriptのコードを分解してよく使われてる機能を分析する

    今年のOSS活動振り返り @ 2015 | Web ScratchJavaScript/ECMAScriptを改めてどう学べばいいのか考える azu/how-to-learn-es6とか#thinking_in_es6で考えてるやつ というのを今年考える事としてあげていました。 それを考えるために、既存のコードがどうなってるかを見てみるという話です。 具体的には既存のコードを見て、そこでどういう機能/構文が多く使われているのかが分かれば、どこを中心的に学ぶと結果が出やすくなるのではという感じです。 それを分析するためにazu/es-usage-rateというツールを書いた。 Installation 使い方 例えば、es-usage-rate自体がどういう構文を使って書かれてるかを見てみてます。 es-usage-rateは他のCLIと組み合わせて使う事を前提としてるので、 デフォルト

    JavaScriptのコードを分解してよく使われてる機能を分析する
  • ES5で書かれたライブラリをES6に書き換える手順

    textlint 3.6.1でコードベースをES6に書き直して、特に問題無く動いてるっぽいのでどういう手順で書き換えたかについての話。 Release Moving to ES6 · azu/textlint 具体的な作業は以下に残ってます。 Move to ES6 · Issue #11 · azu/textlint to ES6 by azu · Pull Request #27 · azu/textlint 事前準備 テストを書く テストが書かれてると変換した時にエラーがスグ発見できるのでカバレッジが高いテストがあると安心して変換出来ます。 面倒な時はExampleテストを追加してみるといい気がします。 npmパッケージをExampleテストしよう | Web Scratch そのライブラリのユースケースを考えて幾つかのパターンを実行出来るExampleテストを作っておくと、普通に実

    ES5で書かれたライブラリをES6に書き換える手順
  • Node学園 16時限目 アウトラインメモ | Web Scratch

    Node学園 16時限目 ES2015発行記念 - connpass に参加してきたメモ Run Through ES6 - @teppeis スライド: Run through ES6 ES6 総復習 ES6 or ES2015 ? 〜WEB+DB PRESS Vol.87 ES6特集に寄せて〜 | Cybozu Inside Out | サイボウズエンジニアのブログ ECMAScript Ecmaで策定されてる仕様 ES6 ES3から16年、ES5から6年 特徴 モダンなシンタックス 大規模開発 後方互換性が高い 今すぐ動かせる ES6とES2015 一年ごとにリリースしていきたいよね ES6 Features 新しいシンタックス 新しいグローバルオブジェクト 既存のオブジェクトの拡張 新しいシンタックス 色々 Class Subclassing Module CommonJSとかは関

    Node学園 16時限目 アウトラインメモ | Web Scratch
  • 東京Node学園15時限目 アウトラインメモ

    東京Node学園 15時限目 - connpassに参加してきたのでメモ 「io.jsについて」 by @yosuke_furukawa スライド : io.js 東京Node学園 15時限目 // Speaker Deck 最初はforkじゃなくてsporkと書いてあった forkほど先割れじゃないよという io.jsはオープンガバナンスモデル Node.jsは何に着手してるのかが不透明 どういうふうに取り組んでいるのかを公開する Google Hangoutで議論したものの動画を公開 基的には合議制、Voteで を投票 コミットが活性化しだした Comitterが追加された Node.jsとの機能面での違い io.jsはV8のバージョンが新しい V8が新しいのでES6の機能が入ってる koajs/koaとかがそのまま使える constやletが使える --es_staging という

    東京Node学園15時限目 アウトラインメモ
  • 東京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 アウトラインメモ
  • JavaScript Promiseを使うウェブの仕様を調べてみた

    Promiseの仕様? JavaScriptにおけるPromiseの仕様といえば、次期ECMAScriptのECMAScript Language Specification ECMA-262 6th Edition – DRAFTで策定されています。 このES6 Promisesについて詳しくはJavaScript Promiseのという無料の電子書籍で書いたのでこちらを参照して下さい。 以前、Promiseについて紹介した時に以下のように書いてました。 また、今後ブラウザに実装されるAPIとしてService WorkersやStreams API等、Promiseをベースしたものも出てきています。 – JavaScript Promiseのを書きました | Web Scratch 実際にどれくらいの仕様がPromiseを参照してるかを調べてみました。 Promiseを参照する仕様

    JavaScript Promiseを使うウェブの仕様を調べてみた
  • 天下一クライアントサイドJS アウトラインメモ

    天下一クライアントサイドJS MV*フレームワーク武道会 - connpass に参加してきたのでメモ。 Chaplin - mizchi Chaplin.jsの話 #ten1club // Speaker Deck 仕事で使ってる Chaplin paulmillr作のBackbone拡張系のMVC Rail風の構成 Chaplinの設計 Rails風のルーター インスタンスの管理するComposer Controllerと強調してインスタンスを管理 差分管理できるので早い 逆にインスタンスを引き継ぐので意識しないと辛い スキャフォールディング paulmillr/scaffolt Generator MV*だとやたらファイルが増える scaffolt はChaplinとは関係なく使える Brunch ウェブアプリに特化したビルドランナー CommonJS風の展開 npmで拡張子に応じた

    天下一クライアントサイドJS アウトラインメモ
  • Githubのissueをオフライン環境で見る

    タイトル通りの事をしたくて色々ツールとかを探しているのですが、 これだって感じのものはない気がします。 そもそもオフラインでGithub issueを見たいという要件自体がかなりマイナーなので当たり前な気もします。 自分の場合だと、JavaScript Promiseのというのを書いてて、 気になった事などTodoとかメモ代わりにどんどんissueにしておいて、 それを移動中に振り返りながら処理するという感じでやってます。 Issues · azu/promises-book オフライン環境に近い状態(テザリングとかするので完全なオフラインではない)でGithub issueを参照する頻度が高いので、ローカルでissueを見られたら便利だなーと思うのでそういうツールを探してました。 issueを処理する時はyuroyoro/git-issue+percol+git-flow (AVH E

    Githubのissueをオフライン環境で見る
  • 最近気になったJavaScript AST周りの動き

    最近、気になったJavaScript AST関係のものについてのメモです。 JavaScript ASTについては以下などを見て下さい。 カジュアルJavaScript AST JavaScript AST Walker esnext 元々ES6 Module Transpiler等やっていたSquare社がesnextというプロジェクトを立ち上げました。 esnextはTraceurと同様にES6のコードを今日のJavaScriptに変換するツールです。 @eventualbuddhaさんがメインでやっていて、それぞれのシンタックスの変換はes6-spreadのように、ひとつのモジュールとして分けて作られています。 また変換の書き方も大体統一したやり方(まあ一人で大体書かれてるので)が取られていて、 Facebookの@benjamnさんが作っているast-typesとrecastを使っ

    最近気になったJavaScript AST周りの動き
  • MochaがPromisesのテストをサポートしました

    このpromiseオブジェクトは、resolveするので、.then の第一引数で指定したonFulfilled コールバックに true という値を渡すようになってます。 今までのテストの書き方 このgetSuccessPromiseを 1.18.0より以前は以下のように書くことでテストをしていました。 it("should manually handling test...", function (done) { getSuccessPromise().then(function (value) { assert(value); done(); }).catch(done); // <= このcatchが今回の変更での焦点 }); getSuccessPromise()の返り値であるpromiseオブジェクトがresolveされると value に true が入って assert(t

    MochaがPromisesのテストをサポートしました