Node.js関連のことを調べてみた2022年04月29日

Windows7でNode.js v14以上を動かしたい！　あるいは、なでしこ３PC版 v3.3.3を使いたい！！！

# 発端
　なでしこ３は近頃、**ESModule化した次期バージョン**が発表されました☆

https://nadesi.com/top/

　まだテスト版とゆうことですが、早速使ってみなくては！

　web版についてはベツに問題ありません。
　しかも、v3.3.3で、HTML埋め込みでも「取り込む」文が使えるようになり、別ファイルのなでしこプログラムをライブラリとして使えるようになったので、[Javascript代わりに使う](https://qiita.com/kujirahand/items/a9ac3145a8d535a372dc)ことの利便性が飛躍的に向上し、現実的になりました～:heart_eyes:

　が！　PC版(Win版)が動きません・・・
　（Win版とゆう言い方は、なでしこｖ１に対しても使われますが、ここではｖ３の[Windows用オールインワンパッケージ「nadesiko3win32」](https://nadesi.com/doc3/index.php?Windows%2FDownload)を指しています。PC版(Node版)とゆう言い方だと、他のＯＳ同

Nodeバージョン管理ツールをNodistからVoltaに移行してみた

今までNodeのバージョン管理ツールにはNodistを使っていたのですが、Nodistは2019年以降更新が無い状態です。

また、2020年12月に新しい管理ツールである[Volta](https://volta.sh/)がリリースされました。

そこで、この記事ではNodeバージョン管理ツールをNodistからVoltaへ移行する手順と、Voltaの主要な機能をご紹介します。

### はじめに
* この記事では、Winwdows 10での動作を前提としています。
* この記事で記載されている手順およびバージョンは2022年1月時点のものです。

### NodistからVoltaへの移行

#### Nodistのアンインストール
Voltaのインストールの前に、Nodistをアンインストールします。感謝！

Nodistをアンインストールするには単純にプログラムのアンインストールをするだけでは足りず、一部フォルダや環境変数も削除する必要があります。

1. 「プログラムと機能」からNodistをアンインストール
1. いくつか残っているNodist関連フォルダやファイルを削除

【10分AWSハンズオン】ExpressをAWS Lambda+API Gatewayにデプロイする

# やること

Lambda 上の Express にアクセスできるようにする。

# 学べること

* サーバレス Express アプリケーションの作り方
* Lambda へのデプロイ
* API Gateway と Lambda の連携

# 扱わないこと

* Infrastructure as Code
* TypeScript
* CI/CD

# STEP 1 : Serverless Express

1-1. 適当なディレクトリに Node.js プロジェクトを作成し、必要なパッケージをインストールします。

“`sh
$ npm init -y
$ npm i express @vendia/serverless-express
“`

:::note warn
`Node.js` がインストールされている必要があります。
`n` という Node.js のバージョン管理ライブラリを使用するのがおすすめです。
Mac を使用している方で、Homebrew がインストール済みの方は、以下のコマンドで Node.js をインストールできます。

“`sh

【discord.js v13 + Discord Player】よくあるmusic botを作成する

# はじめに
こんにちは、こんばんは、ナマステ
今までdiscord.js+@discordjs/voice+ytdl-coreでmusic botを動かしていたのですが、
[Discord Player](https://discord-player.js.org)を使用したところかなり便利だったのとQiitaにこれを使ってる記事が無かったので、備忘録がてら基本的な使い方を書きます
[Discord Developer Portal](https://discord.com/developers/applications)からアプリケーションを作成して～みたいな初っ端の手順は、他の記事が大量に転がってるので端折ります

# 前提
この辺知らないと途中で混乱するかも、知ってても文章がヘタクソだから混乱するかもゴメン
– JavaScript/Node.jsがとりあえず書ける
– discord.jsを触ったことがある
– discordのスラッシュコマンドを知っている([この記事べんり](https://qiita.com/gaato/items/55b32bc4777905ac162

TypeScript + Node.jsの簡易プロジェクトセットアップ

## はじめに
スクリプトを作成しようとする際、毎回手順が曖昧になってしまうためまとめておこうと思います。
TypeScriptとNode.jsを用いたプロジェクトの設定手順を記載します。

## 環境
Mac OSを用います。 Node.jsとnpmはインストール済みのものとします。

## 手順
### 1. 作業ディレクトリの作成
“`bash:./
$ mkdir typescript-node-setup
$ cd typescript-node-setup
“`
### 2. npm初期化
“`bash:./typescript-node-setup
$ npm init
“`
### 3. TypeScript インストール
“`bash:./typescript-node-setup
$ npm i –save typescript
“`
### 4. Node.js型定義の追加
“`bash:./typescript-node-setup
$ npm i -D @types/node
“`
### 5. tsconfig.json設定
“`bash

ExpressでREST APIを実装する時にreq/resのvalidationを楽に実装できるライブラリを使ってみた

## 以下の記事を参照して頂ければと思います

https://note.com/shift_tech/n/n66f43685f2f9

**※Qiitaの記事は全て個人的な記載であり、所属する組織団体とは無関係です**

## 補足
ソースコード全体は以下。

https://github.com/yuta-katayama-23/node-express/commit/7e5a64e54f99b7fb8019f89b6dbfe5846e205148

【Serverless Framework】AWS Lambda構築手順

# まえがき
業務でServerless FrameworkでLambdaを構築する必要ができたので、構築手順をメモ。
# Serverless Frameworkとは
・Node.jsで記述したデザイン/設計書をもとに、各プロバイダ(AWS/GCP/Azure)上でサーバレスなリソースを構築できるフレームワーク。
# 環境構築
参考にさせていただいた記事。

https://serverless.co.jp/blog/25/

## Node.jsインストール
・Serverless Frameworkでは、Node.jsはv12以上が必要。

https://nodejs.org/ja/download/

## Serverlessインストール
“`
npm install -g serverless
“`
インストールされていることを確認
“`
% npx serverless –version
Framework Core: 3.15.2
Plugin: 6.2.2
SDK: 4.3.2
“`
「serverless」は長いので「sls」と省略してもOK。
“`

Node.jsからLINE Notifyを使うメモ (Fetch API利用）

Node.js v18のアップデートでFetch APIがフラグなしで使えるようになったよという話題があるのでLINE NotifyのAPIで試してみました。

> [「Node.js 18」がリリース ～fetch API、Web Streams APIがグローバルスコープで利用可能に](https://forest.watch.impress.co.jp/docs/news/1404310.html)

## 先に実装したコピペ用コード

v18以降ならこのまま実行して動くと思います。

“`js
‘use strcit’;

const BASE_URL = ‘https://notify-api.line.me’;
const PATH = ‘/api/notify’;
const LINE_TOKEN = `トークン`;

const params = new URLSearchParams({
message: ‘こんばんわ。Node.js v18 Fetch APIでLINE Notify API を使ってみました。’,
});

const config

Node.js のフレームワーク「Fastify」とキーバリューストア「keyv」を組み合わせて試す（JSON を GET・POST で扱う）

過去に別々に試したことがあるフレームワーク「Fastify」とキーバリューストア「keyv」を、組み合わせて試してみるという内容です。

– [Node.js のフレームワークの Fastify と WebSocket を利用可能にする fastify-websocket を軽く触ってみる – Qiita](https://qiita.com/youtoy/items/7c5a318278e397602b76)
– [Node.js用のシンプルなキーバリューストア「keyv」を試す（データの保持はメモリ・SQLite） – Qiita](https://qiita.com/youtoy/items/6137b6d417b1ab1a31e4)

## Fastify で GET・POST を試す（JSON のやりとり）
### GET を扱う
Fastify で GET ＋ JSON を利用する方法は、[公式の「Getting Started > Your first server」](https://www.fastify.io/docs/latest/Guides/Getting-S

Javascript(Node.js)プロジェクトの開発者は必須！　ncuコマンドでパッケージを最新化する

## はじめに
Javascript(Node.js)のプロジェクトで、最初にインストールした時のままのバージョンでずっと開発をしていた、なんて事にならないように定期的にバージョンを更新していく必要があると思う（バージョン更新を後でまとめてやろうとしても変わりすぎて動かない…、なんて事もあるので1週間に1回とかできるだけ高頻度で更新するのが後々楽）。
今回は実際に勉強で作成していたプロジェクトのバージョンを更新してみたので、その備忘録を残す。

## 実際にパッケージの更新をやってみる
[npm-check-updates](https://github.com/raineorshine/npm-check-updates)を利用する。

“`console
[root@localhost node-express]# yarn global add npm-check-updates
yarn global v1.22.17
[1/4] Resolving packages…
[2/4] Fetching packages…
[3/4] Linking dependenci

Node.js用のシンプルなキーバリューストア「keyv」を試す（データの保持はメモリ・SQLite）

タイトル通りの内容です。Node.js でシンプルなキーバリューストアを使う場合、割とメンテナンスがされているものを選ぶとして選択肢に何があるだろうかと思い、少し調べてみました。

その時に出てきたものの 1つが、今回の記事で扱う [keyv](https://www.npmjs.com/package/keyv) です。
　●jaredwray/keyv: Simple key-value storage with support for multiple backends
　　https://github.com/jaredwray/keyv

公式の説明で「Simple key-value storage with support for multiple backends」と書かれているように、自分の目的に合っていそうです。とりあえず、公式のページや

Elasticseach App Search に MongoDBのデータを書き写して全文検索調査に使う。

# はじめに
MongoDBにコレクションされたドキュメントに対し、全文検索したくなった。しかし、MongoDBに対して検索をしかけるのではちょっと速度面で難がある。また、検索のためのUIの作成もめんどくさい。

なにか簡単に実用的なツールを構築する手立てはないか、と模索していたところ、Elasticsearchに App Searchというものがある（あった？2020年に名称が変更になっているらしい）ことがわかった。

今回の先達情報はこちら。

https://qiita.com/tike/items/dc1ed4d0734080a00376

こちらの先達の手段で、AppSearch環境は作れる。本投稿では、PythonでMongoDBのデータを読み込み、AppSearchに書き写す機能の開発の説明に重点を置きながら、全文検索調査システムを構築する手順を紹介する。

# App Search のセットアップ

docker を使う。dockerで 4GB程度のメモリが使える環境であることが必要らしい。事前準備として、読者の環境でdovkerの環境を調整してほしい。また、ローカル環

Node.js 18 から実験的にグローバルスコープで利用可能になった fetch API を試す（鉄道遅延情報の JSON を取得してみる）

この記事は、最近の技術記事でも話題を見かける「Node.js の fetch API」に関するものです。

●「Node.js 18」がリリース ～fetch API、Web Streams APIがグローバルスコープで利用可能に – 窓の杜
　https://forest.watch.impress.co.jp/docs/news/1404310.html

以前のバージョンでも利用可能にはなっていた fetch API（以前のバージョンだと `–no-experimental-fetch` というフラグが必要だった）ですが、Node.js 18 からはグローバルスコープで利用可能になりました。これを試してみようと思います。

### 余談： ブラウザの Fetch API
なお、ブラウザでは以前から特別な対応なしに [Fetch API](https://developer.mozilla.org/ja/docs/Web/API/Fetch_API) が利用可能でした。そのためブラウザで Fetch API を利用する話は、過去に以下の記事などで取り扱ったことがありました。

●

【React】Reactの始め方

# 【この記事に書くこと】
・Reactってそもそも何？　どうしてReactを使うのか？
・Reactをローカル環境で始める手順
# 【経緯】
Reactの入門書２冊ほど読んだので、学んだことをまとめたいと思い記事にしました。

# 【環境】
以下の環境でReactを試しています。
| OS | macOS Monterey 12.3.1 |
|:-:|:-:|
|ブラウザ |Google Chrome |
|テキストエディタ | VS Code |

# 想定読者
・JavaScriptに触れたことがある（初心者〜中級者）

# Reactってそもそも何？
ReactとはJavaScriptのフレームワークです。
フレームワークはざっくりいうと、あらかじめよく使う機能がまとめられたツールのことです。
例えば、どのWebサービスにもあるような画面遷移（トップページから各ページに飛ぶとか）、データベースにデータを登録するなどの機能がありますが、それらを毎回１から作るのは面倒ですよね？
　
Reactを使うことで、よく使う機能を０から作る必要がなくなります。

# React

WindowsでNodeのバージョンを切り替えて実行できるnvmをインストール

# はじめに
https://fumidzuki.com/knowledge/4533/#toc2

の方がまとめていただいている内容を端折っているだけのもの

# 環境
– Windows10 (21H2)

# 手順
1. インストーラーのダウンロード＆実行

https://github.com/coreybutler/nvm-windows/releases

から、nvm-setup.zip をダウンロード＆解凍して実行

1. Nodeとしてインストールできるバージョンの一覧取得＆インストール
※`コマンドは管理者実行で実行しないとＮＧ`

– 使用可能バージョンの一覧取得
“`shell
nvm list available
# availableを抜くと、インストールしているバージョンと、現在設定しているバージョンが閲覧可能
“`

– 指定バージョンのインストール
“`shell
nvm install [バージョン]
# nvm install 16.14.2 とか、上記で表示されたバージョンを指定
“`

– 使うバージョンの指定
“`s

Error の cause オプションによってエラーの再 throw 時にスタックトレースが失われるのを防ぐ【ES2022】

「エラーをキャッチして再度エラーを投げる」をやる場合、以下のように書くと元のエラー情報が失われてしまうためデバッグしづらいコードになります。

“`js
try {
const user = await fetch(userApiUrl);
} catch (error) {
throw new Error(“ユーザー情報取得APIでエラー”);
}
“`

メッセージに `error.message` や `error.trace` を連結して入れるのも手ですが、メッセージとしては読みづらく使いづらいです。

よってこれまでは、コード全体のエントリポイントなどでまとめてエラーをキャッチしスタックトレースが失われない形で処理するなどしていたかと思います。

# Error の cause オプション

ES2022 で入った機能で、このように `Error` の第二引数にオプションで `cause` を渡せるようになりました。

“`js
throw new Error(“エラー”, {
// ここに前のエラーを渡せる
cause: prev

2つのTransformStreamを合成する

Node.jsの最新リリースではWeb Streamがグローバルに追加されました。また、Denoでも最近のリリースで各種APIがWeb Streamに対応しました。

Web Streamには、

– 読み取り用のReadableStream
– 書き込み用のWritableStream
– 変換用のTransformStream

の3種類のAPIがあります。

この記事では、ストリームの変換に使うTransformStreamを合成して、1つのTransformStreamを作成する方法について解説します。

## TransformStreamの使い方

まずTransformStreamの使い方を、TypeScriptの型定義と共に解説したいと思います。

`ReadableStream`型は、細切れになったA型のchunkが流れてくるストリームです。`ReadableStream`型は`WritableStream`型へパイプすることができます。

“`ts
function pipe(
readable: ReadableStream,

Vue/Nuxt→React/Nextの共通点,差異,そして世界でのトレンド

教育関連のAIシステムをドイツで研究しているのですが、データ収集のためにインターフェースを作る必要が出てきました。そのために、React/Nextをやる必要が出てきたため、Vue/Nuxtの知識を再利用することを試みます。

# 日本と欧州でのトレンドが微妙に違う!

今ヨーロッパに留学しているのですが、ドイツではNuxtよりNextの方が圧倒的に優勢だそうです。一方、日本では、Nuxtの方もまだ耐えていると聞きます。

そのことを、Googleトレンドから定量的に見てみましょう：

東京とベルリンでの”Next.js”, “Nuxt.js”の２キーワードの割合比較です。（１年間）

## ドイツでは「Nextしか勝たん？」状態


## 日本でもNextが人気だが、Nuxtも頑張っている

ubuntu 22.04LTSで最新のnodejsぶち込む方法

ubuntu 22.04LTSでは
“`
curl -sL https://deb.nodesource.com/setup_16.x | sudo -E bash –
sudo apt-get install -y nodejs
“`
をしても12ver止まりなので
12verから16or最新verにアップデートする方法
“`
sudo npm install -g n
“`
最新版のNode.jsのコマンド
“`
sudo n latest
“`
最新のLTS版のNode.jsのインストール
“`
sudo n lts
“`
今のnodeのver確認方法
“`
node -v
“`
今のnpmの確認方法
“`
npm -v
“`
最新のnodeやnpmこれで行けると思います。

AWS EC2でnode.jsのバージョンの下げ方

AWS EC2でnode.jsのバージョンが原因で、上手くいかない…。
そんな時の対処方法を記しておきます。
# 準備
SSHを使用してEC2に接続します。
“`
$ ssh ec2-user@255.255.255.255 -i .ssh/qiita-sample.pem
Last login: Wed Apr 20 20:13:54 2022 from qiita-sample.com

__| __|_ )
_| ( / Amazon Linux 2 AMI
___|\___|___|

https://aws.amazon.com/amazon-linux-2/
19 package(s) needed for security, out of 33 available
Run “sudo yum update” to apply all updates.
“`
nvmはnode.jsのバージョン管理ツールです。
“`
$ nvm –version
$ nvm 0.34.0
“`
# nvmの使い方
現在