Node.js の進化に伴い不要となったかもしれないパッケージたち
tl;dr はじめに 2024 年の 4 月 24 日に Node.js 22 がリリースされました。ESM を 条件付きで require する機能や、--run フラグによる npm スクリプトのパフォーマンス改善などが v22 で追加され、2009 年に Ryan Dahl が Node.js をリリースしてから 15 年が経つ今も、Node.js は進化を続けています[1]。 こうして Node.js 自身が強化されていくにつれ、以前はサードパーティーのパッケージを使用して実現することが一般的であった機能が Node.js のみで実現可能となり、当該パッケージが不要となるような場合があります。冒頭に引用した Ben Holmes の動画では、そのように不要となったパッケージとして dotenv node-fetch chalk mocha が挙げられていますが、この記事では「これら
Node.js + TypeScriptのモジュールを整理してみる
はじめにlink 最近受けるNode.js + TypeScript環境の相談の中で、CommonJSやECMAScript Modulesのあたりで落とし穴にはまっている人が多いという事に気づいた。 Node.jsは歴史的にCommonJSとECMAScript Modules（以後ESMと表記）がどうしても入り乱れる環境にあり、これにTypeScriptのモジュールが加わると組み合わせでさらに複雑度が増すのが現状である。 説明する際に口頭より整理した文章が欲しいと思ったので記事にする。 以下のリポジトリで検証コードを管理している。 https://github.com/koh110/module_test Node.jsモジュールチェックシートlink まず最初にNode.jsにおけるCommonJSとESMの挙動について整理する。 いきなり書かれても把握できないかもしれないが、一旦こ
テストの学習へようこそ！ | web.dev
テストの学習へようこそ！ コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 このコースでは、ウェブ用のテストの概要と探索について説明します。 このコースで学習する内容は次のとおりです。 テストの基礎 自動テストと手動テスト テストを実施する場所と方法 ベスト プラクティス 何をテストすべきか、誰に責任があるのか、目的そのものとしてではなく、目的を達成するために手段をテストすることを検討する方法など、テストの理念。 このコースには、学習に役立つ簡潔で実用的なサンプルコードも含まれています。 コースのスコープには、Node.js などの環境で実行される、フロントエンドの JavaScript とドキュメント モデル、バックエンドでのライブラリ テストが含まれます。テストの経験はありませんが、JavaScript の基礎知識と Node.js などに関する経験が必
ドラッグ＆ドロップで直感的に操作可能なカードをウェブアプリに一瞬で導入可能なライブラリ「gridstack.js」を使ってみた
ウェブアプリを開発するとき、できるだけ操作は直感的に行えるようにしたいものですが、ドラッグ＆ドロップという操作をブラウザ内で行えるように実装するのはなかなか面倒です。「gridstack.js」はそうした面倒な実装を代わりにやってくれるライブラリで、まさに一瞬と言えるほどの手軽さでドラッグ＆ドロップ操作可能なカードを実装できるとのことなので、実際に使って試してみました。 gridstack.js | Build interactive dashboards in minutes. https://gridstackjs.com/ gridstack/gridstack.js: Build interactive dashboards in minutes. https://github.com/gridstack/gridstack.js gridstack.jpのサイトに行くとデモが用意
Node.jsの2022年を振り返り、Node.jsの未来を見つめてみた ～TechFeed Experts Night#8講演より | gihyo.jp
TechFeed Experts Night Pick up Node.jsの2022年を振り返り、Node.jsの未来を見つめてみた ～TechFeed Experts Night#8講演より 本記事は、2022年11月に開催された「TechFeed Experts Night#8 ～ JavaScriptランタイム戦争最前線」のセッション書き起こし記事「Node.jsの2022年を振り返り、Node.jsの未来を見つめてみた by @shisama_」を転載したものです。オリジナルはTechFeedをご覧ください。 「Node.jsの2022年と未来」というタイトルで話します。よろしくお願いします。サイボウズでフロントエンドエンジニアをやっているshisamaです。 今日はNode.jsの18と19の主な変更点を紹介したいと思います。その後は、現在実装中の機能から、いくつかおもしろそう
モジュール, 導入
アプリケーションが大きくなるにつれ、それを複数のファイルに分割したくなります。いわゆる ‘モジュール’ です。通常、モジュールはクラスや便利な関数のライブラリを含みます。 長い間、JavaScript には言語レベルのモジュール構文は存在しませんでした。当初はスクリプトが小さくて単純だったため問題ではありませんでした。そのため、モジュールの仕組みも必要ありませんでした。 しかし、スクリプトが徐々に複雑になってきたため、コミュニティはコードをモジュールにまとめるための様々な方法を発明しました。 いくつか挙げます: AMD – 最も古いモジュールシステムの1つで、最初はライブラリrequire.jsで実装されました。 CommonJS – Node.js サーバ用に作られたモジュールシステムです。 UMD – もう1つのモジュールシステムで、ユニバーサルなものとして提案されています。AMD と
実践 Node.js Native ESM — Wantedlyでのアプリケーション移行事例 | Wantedly Engineer Blog
Wantedlyではこのたび、フロントエンドアプリケーションのひとつをNative ESM化しました。本記事ではNative ESM化の必要性と、必要な作業について説明します。 この記事の概要Node.jsにはNative ESMというモードがある。Native ESMはまだ普及していないが、ライブラリ側の更新が進み、移行が必要になりつつある。Native ESMをめぐる状況は (この記事の長さからわかるように) 色々複雑で、概念をちゃんと説明するだけでも大変。Native ESMへの移行にあたってはさまざまな困難が待ち受けている。Native ESMとは歴史的経緯から、JavaScriptには複数のモジュールシステムがあります。そのうちNode.js周辺でよく使われるのはCommonJS ModulesとES Modulesです。 CommonJS Modules (CJS) は実質的に
Node.jsのバージョン管理にVoltaを推したい
Volta とは Voltaとは、JavaScript ツールマネージャーです。 タイトルでは Node.js のバージョン管理としていますが、 npm・yarn のバージョン管理も行うことができます。 公式サイトでは、「The Hassle-Free JavaScript Tool Manager（手間のかからない JavaScript ツールマネージャー）」と紹介されています。 チームの Node.js のバージョン管理を Volta に統一したところ非常に DX が上がり、Volta の恩恵を感じています。 この記事では、開発者の Volta 人口を増やすべく Volta の紹介と使用方法について解説していきたいと思います。 なかなか詳しく解説している日本語のソースはないので、公式ドキュメントを読んで適宜和訳しています。 公式ドキュメントを読むのがめんどくさいという人に読んでいただい
Node.jsライブラリ/ツールをESMに移行する[Node.js 12+]
パッケージの移行 パッケージをESMなパッケージとして明示する方法は2つ .mjs の拡張子を使う package.json の type フィールドに module の値を設定する 基本的にパッケージ単位で移行すると思うので、後者の package.json の "type": "module"を設定する。 この設定をすると、パッケージ内のJavaScriptがモジュールのコンテキストで実行されるようになる。 モジュールでは常にstrict modeとなり、Node.jsのESMではrequire、exports、__dirname、__filename などが利用できなくなる。 代わりに、ES2015+のimportとexport文がモジュール構文として利用できるようになる。 JavaScript モジュール - JavaScript | MDN Differences between
![Node.jsライブラリ/ツールをESMに移行する[Node.js 12+]](https://cdn-ak-scissors.b.st-hatena.com/image/square/7e5d02dd4b4470fe1aa0b6dc49fb67aee46c2883/height=288;version=1;width=512/https%3A%2F%2Flh3.googleusercontent.com%2Fa-%2FAOh14Gh5aVg_ccNbbR5jIUsiJw7NuPCWIwaqq1-nXKs5Bw%3Ds250-c)
Node.js : POSTしたDataURL をファイルに保存 : typeOf 'aki_mana'
ファイルをアップロードという手法の他にも、クライアント（JavaScript）で生成した DataURL なデータをサーバー側でファイルに保存するというアプローチが考えられる。 DataURL な文字列を解析して、Bufferオブジェクトにし、それを WriteStream オブジェクトでファイル化 こんな感じで。 var parseDataURL = function( dataURL ){ var rslt = { mediaType : null, encoding : null, isBase64 : null, data : null }; if( /^data:([^;]+)(;charset=([^,;]+))?(;base64)?,(.*)/.test( dataURL ) ) { rslt.mediaType = RegExp.$1 || 'text/plain'; rs
TypeScript + Node.jsプロジェクトにESLint + Prettierを導入する手順2020 - Qiita
TL;DR 完成形のソースコードはこちら↑ この記事の趣旨 TypeScript + Node.js プロジェクトのはじめかた2020 で作成したTypeScript + Node.jsのプロジェクトに ESLint / Pretiter / husky & lint-staged を導入する手順を紹介します。 今回導入するツールとバージョンは以下になります。 項目 バージョン
jq コマンドを使う日常のご紹介 - Qiita
jq コマンドとは http://stedolan.github.io/jq/ JSONから簡単に値を抜き出したり、集計したり、整形して表示したりできるJSON用のgrepとかawkみたいなコマンドです。 WebサービスがJSONを吐いたり、AWS CLIが JSON を吐いたりする現代社会で大変便利なコマンドです。 マニュアル だいたいここ読めばOK. http://stedolan.github.io/jq/manual/ あ、これで、終わってしまう。だけど気にせず進めます。 簡単な例 まず、空気をつかみましょう。 以下jqコマンドの記法を見ていきます。JSON { "hoge": "value" } があった場合、 . がルート {} を表します。.hoge で "value" を表現します。だいたいこんな感じです。 ただの整形 しばらく下記のJSONを例に進めます。itemsには配
ブラウザとnode.jsに両対応したライブラリを作りたいときのWebpackレシピ集 - Qiita
概要 Webpackを使ってNode.jsとブラウザに両対応したライブラリを作るときのレシピ集です いろいろなレシピを見てWebpackによるライブラリ生成の挙動を理解することを目的としています ブラウザにもNode.jsにも両対応したライブラリを作りたい ブラウザとNode.jsに両対応したいとおもったとき、 両方同時に対応した1つのバンドルjsを作る【統合型】と、 ブラウザ用、Node.js用と別々にライブラリを出し分ける【出し分け型】の2パターンある。 本稿では主に【統合型】について説明する ライブラリのビルドに関するWebpack設定項目 レシピ集に行く前に、 まず、ライブラリのビルドに関する設定項目をざっくりみていく。 webpack.config.js 以下のような典型的なwebpack.config.jsの中でoutput以下の項目でライブラリ生成のためのパラメータを決める。
JSConf JP 2019 参加報告 - とろろこんぶろぐ
はじめに 昨日今日と JSConf JP 2019 に参加してきたので、聴講したセッションの内容を紹介します。 本記事は Recruit Engineers Advent Calendar 2019 1日目の記事です。 JSConf JP 2019 とは JSConf JP は世界的な JavaScript Conference である JSConf の日本開催です。昨年まで日本Node.jsアソシエーションがNode学園祭として開催していた大規模JavaScript イベントが、Node.js に限らず JavaScript に関する内容のお祭りとして変化を遂げ、今年からJSConf JP となった形です。今年は、2019年11月30日、12月1日の二日間で開催されました。リクルートテクノロジーズは、イベントのプラチナスポンサーの１つです。 以下、公式ページからの引用です。 jsconf
Node.js v12で使えるJavaScriptの新機能 - 別にしんどくないブログ
Node.js v12が4/23にリリースされました 🚀 Node.jsのCoreにも新しい機能が入りました。 また、APIの追加以外にもTLS1.3のサポートやhttp_parserがllhttpに代わったりしています。 詳しくは以下をご覧ください！ github.com JavaScriptエンジンであるV8もバージョンアップしています。 Node.js v10のV8のバージョンは6.8でしたが、Node.js v12では7.4に大幅アップデートしています。 V8のバージョンが上がることによりJavaScriptの使える機能や構文が増えます。 今回はMathias氏のツイートをもとにNode.js v12から使えるJavaScript(ECMAScript)の新機能について紹介したいと思います。 New JavaScript features in Node.js v12: ➡️ A
ひらがな練習プリントを作れるサービスを公開したよ – コーヒーサーバは香炉である
好きな言葉でひらがなの練習ができるプリントが作れるサービス「ひらがなプリントメーカー(仮)」を公開した。今後カタカナにも対応したり、文字練習以外の教材の生成ができるようにすることもぼんやり考えているので、名前は変わるかもしれない。 (2019年01月11日追記) 0〜9の数字にも対応したので「かきかたプリントメーカー」に改名した。さらにカタカナもサポートした。 紙の向きや縦書き横書き、文字サイズが切り替えられるようになっている。書き順もつけることができるので、数字をおぼえた子ならひとりでもできる。 PDFファイルを生成するので、そのまま自宅やコンビニのプリンタできれいに印刷できる。スマホでぽちぽち作って帰り道にコンビニで印刷してお土産に持って帰るなんてこともできる。 もともとうちの3歳の娘のために作ったのだが、これはけっこう需要があるだろうということで真面目に作り込んで公開した。 市販の子
[Node.js] 無料で簡単にウェブアプリを公開できるサービス「Glitch」を使ってみた！ - Qiita
Glitchとは GlitchはNode.jsのアプリを公開するためのサービスです。 Node.jsでウェブアプリを公開しようとすると、サーバーの設定したりドメインを取得したり…とても複雑です。 Glitchは、あなたの創造性を試すことだけに集中できます。 Glitchは、あの有名なプロジェクト管理ツールのTrelloをつくったFogCreekSoftware社によって開発が進められています！ アプリを公開するためだけでなく、オンラインのEditorなどもついていい感じです。 使ってみる これまでAWSやさくらインターネットなどを使っていましたが、Glitchはずば抜けて簡単です。 まずはGlitchにアクセスします。 新しいプロジェクトの作成1 右上の①[Sign in]ボタンからログインします。 FacebookかGitHubが選べますが、後々GitHubからソースコードを取得すること
![[Node.js] 無料で簡単にウェブアプリを公開できるサービス「Glitch」を使ってみた！ - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/8a6f54dbfed613279dcdfaa6714de0a80cb6008b/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCTm9kZS5qcyU1RCUyMCVFNyU4NCVBMSVFNiU5NiU5OSVFMyU4MSVBNyVFNyVCMCVBMSVFNSU4RCU5OCVFMyU4MSVBQiVFMyU4MiVBNiVFMyU4MiVBNyVFMyU4MyU5NiVFMyU4MiVBMiVFMyU4MyU5NyVFMyU4MyVBQSVFMyU4MiU5MiVFNSU4NSVBQyVFOSU5NiU4QiVFMyU4MSVBNyVFMyU4MSU4RCVFMyU4MiU4QiVFMyU4MiVCNSVFMyU4MyVCQyVFMyU4MyU5MyVFMyU4MiVCOSVFMyU4MCU4Q0dsaXRjaCVFMyU4MCU4RCVFMyU4MiU5MiVFNCVCRCVCRiVFMyU4MSVBMyVFMyU4MSVBNiVFMyU4MSVCRiVFMyU4MSU5RiVFRiVCQyU4MSZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9MTc1NTNiOTRkMjc3NGQ1ZjYxYjU2M2E0YjU5YzE0MjI%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDB5b25lZGFjbyZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9ZTcyNTA4MTU2YmMwZTVmNzQ5ZThkZmYxY2I3OTJiODE%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D03b4202c0a5228dc571f35b021dbd12c)
JavaScript開発はこれ1つでOK！超お手軽にWebアプリを作れる全部入りコードエディタ「Gomix」の使い方大公開！ - paiza開発日誌
どうも、まさとらん（@0310lan）です。 今回は、JavaScriptでWeb開発をされている方や、これから勉強しようという方も含めてとても便利に使える無料オンラインエディタのご紹介です！ バックエンドは「Node.js」でプログラミングして、フロントエンドは「HTML / CSS / JavaScript」で開発し、そのままホスティングもしてくれるので手軽に公開することも可能なスグレモノですよ。 【 Gomix 】 以前は「HyperDev」という名称でサービスが公開されていましたが、現在は「Gomix」というサービス名に変更されており、今も活発にバージョンアップが続けられています。 ■基本的な使い方！ それでは、実際に「Gomix」を使いながらどのようなサービスなのかを見ていきましょう！ まずは、ブラウザから「https://gomix.com」にアクセスすると、いきなりコード
JavaScript ベスト・オブ・ザ・イヤー 2016
JavaScriptコミュニティは日々進化しています。今日のトレンドも数か月後には陳腐化しているなんてことは日常茶飯事です。 2016年は終わってしまいましたが、何か重要なことを見逃したのではないかと感じているそこのあなた！ 2016年の主要なトレンドをおさらいして、そんな不安を払拭しちゃいましょう。 過去12か月に獲得された Github のスター数を比較して、2016年に支持を集めたプロジェクトを数値に基づいて評価していきます。 2015年はなんといっても React でした。そして、Flux 実装を席巻したのは Redux でしたね。 2016年、JavaScript の人気プロジェクトはどのようなものだったのでしょうか？
React + BrowserifyプロジェクトでJS/CSS/HTMLを圧縮(Minify)する - Umi Uyuraのブログ
ReactとMaterial UIを組み合わせると、それだけでBrowserifyで結合したJavaScriptファイルが1MB超えてしまうので、やっぱり圧縮とかした方が良いのかな―と思い、やり方を調べてみました。 ※2015/08/03更新 Licensifyを開発された @t_wada さんから改良の連絡をいただいたので、Licensifyの最新版1.4.0をもとに内容を更新しました。 Licensify - Nodeモジュールのライセンスコメントを生成する JSファイルを圧縮すると、ライセンスが記載されているコメントが消えてしまうという問題があるということで、本題の前に、Browserifyと組み合わせて、読み込んだNodeモジュールのライセンスコメントを生成してくれる Licensify を試しておくことにしました。 インストールはnpmから。 $ npm install lice
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
