Node.js関連のことを調べてみた2021年08月07日

ServerlessFrameworkを利用したLambdaでデバッグを実施する。

###記事作成に当たって
最近、Serverless Frameworkを利用してLambdaにNode.jsをデプロイしている。Serverless Frameworkはテンプレートも充実してるし、CI/CDの面でも優れているのでなかなか便利。だけど、デバッグのやり方がわからなくて困っていた。どうにか、簡単にデバッグをできないかなぁと思って、試行錯誤する中でデバッグ環境ができあがったので、記事にして共有します。

###構築時の環境情報
端末:Mac
エディタ：VsCode
node:v14.17.4(versionが古いと)
npm:7.20.5

###パッケージの環境構築

“`:packageのインストール
~/develop/study/serverless $ serverless create -t aws-nodejs-typescript -n debug_lambda -p debug_lambda
Serverless: Generating boilerplate…
Serverless: Generating boilerplate in “/User

App EngineにNodeバックエンドをデプロイするときのチェックリスト

# 概要
App Engine に Nodeで作ったバックエンドをデプロイするときにいつも何かしらで詰まるので、チェックリストを備忘録としてまとめました。

# 1. ポート
Nest.jsとかだとデフォルトで3000ポートでリッスンする用になっているが、`process.env.PORT`でリッスンするようにする。

“`ts
app.listen(process.env.PORT ?? 3000)
“`

# 2. スタートコマンド

“`json-doc
“scripts”: {
// “start”: “nest start”,
“start”: “node dist/main”,
“`
App Engineでは npm scripts の startコマンドが実行される。このとき、Nest.jsなどデフォルトで設定されているstartコマンドだと、実行できないことが多々ある(App EngineではdevDependenciesはインストールされないなどが原因)

# 3. DBの接続先
Cloud SQLへPostgreSQLで接続する際には以下のようにす

Node.js 16.6.0からArray.at()が使えるようになった

# Changelog
https://github.com/nodejs/node/blob/master/doc/changelogs/CHANGELOG_V16.md#16.6.0

# Reference
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/at

# `.at()`とは
– `-1`を渡すと末尾の要素を、`-2`を渡すと末尾から2番目の要素を返す、ブラケット`[]`の拡張。
– `Array[Array.length – 1]` が `Array.at(-1)`のように書ける。簡単。嬉しい。
– 去年の11月からTC39 Processの`Stage 3`に格上げされ、`Chrome 92` および `Firefox 90`から利用可能となっている。
https://github.com/tc39/proposal-relative-indexing-method

# その他の提案
もっとシンプルに自由に配列にアクセスしたい、という思

ホットペッパーのAPIで遊んでみる

###概要
ホットペッパーAPIを利用して近隣店舗の情報を取得する。

##ホットペッパーAPI
ホットペッパーAPIとはリクルートが提供するOPENAPI。ホットペッパーとホットペッパーBeautyの2種類のAPIが提供されているが、今回はホットペッパーのAPIを利用していきます。
※[ホットペッパーAPIの公式リファレンス](https://webservice.recruit.co.jp/doc/hotpepper/guideline.html)

###準備
ホットペッパーAPIを利用するには利用申請が必要となります。
[リンク](https://webservice.recruit.co.jp/register/)より新規登録し、APIキーを取得してください。申請からAPIキー取得までのリードタイムは約10分程度です。

###実装

“`shell:ライブラリインストール
~/develop/study/node/hotpepper $ yarn add fs xml2json node-fetch
“`

“`:ディレクトリ構造
~/develop/study/n

Node.js 実行中のファイルの絶対パスを取得する。

相対パスで指定すると、実行するディクレトリによって結果が変わってしまう。

なので NodeJS のスクリプトの中でのパス指定は絶対パスを使う必要がある。

## 結論

`__dirname` を使う。

__dirname は実行中のファイルへの絶対パスを取得できる環境変数。

> __dirname is an environment variable that tells you the absolute path of the directory containing the currently executing file.

https://www.digitalocean.com/community/tutorials/nodejs-how-to-use__dirname

“`
bin/
|_ index.js
src/
“`
のようなディレクトリ構成で、`index.js` から `src/` を指定したい場合、

“`index.js
const srcPath = path.resolve(dirname, ‘../src’)
“`

と指定する

素のJavaScript（node）だけでmicroCMSのデータを全て取得してみた

例えばNextJSのビルド前だったりGatsbyJSのgatsby-node.js(nodeしか使えないページ)、ライブラリが使えない、などの何らかの形で素のJSだけでお手軽にデータを取得したい時があります。

microCMSがそのケースでした。その時に少し工夫が必要だったので知見としてコードを載せてみました。

## GETのデフォルトが10件までしか取得できない
通常は以下のようなコードで取得すると思います。

“`node.js
const axios = require(‘axios’).default;
require(‘dotenv’).config({ path: ‘../../.env’ }); // package.jsonから動かす場合はpathが通っていると思われるので不要。必要であれば.envのあるファイルの相対パスを記載

const getMicroCMSdata = async() => {
const url = `https://hoge.microcms.io/api/v1/hoge`;
const apiKeyHeaderOption

DockerでWordPress環境を簡単に構築

#DockerでWordPress環境を構築
前提としてDockerとNode.jsがインストールされていること。

###目的
WordPressでチーム開発する予定が立ちそうなのでメモを兼ねて書くことにしました。

###できること
dockerを用いてWordPressの環境を作る。
今回はwp-envを使用して立ち上げる。

順番にやっていくだけで簡単に構築できるはずです。
環境構築が苦手な僕でも10分くらいで完了しました。笑

###開発環境
Windows10pro
Docker version 20.10.7
npm version 7.19.0
node version 14.17.0

##pacage.jsonを作成
任意のディレクトリに移動したら

“`
npm init
“`
pacagenameなどが問われますが特になければエンター連打でOK
ディレクトリ内にファイルができていることを確認

##wp-envのインストール
“`
npm i @wordpress/env –save-dev
“`

このコマンドでインストールできる。
node_mod

VS Code の拡張機能、Teams Toolkit を使ってマイクロソフト Teams のアプリを開発しよう

みなさん、いかがお過ごしでしょうか?

前回の Microsoft Teams 開発者プラットフォームに関連する記事では、[Tab](https://qiita.com/girlie_mac/items/97fa81e67ad6ba0f6f35) と [Bot](https://qiita.com/girlie_mac/items/18cb83a021f3412317c6)、そして[メッセージ拡張機能](https://qiita.com/girlie_mac/items/646a5bfeeb7bd5da73c9)といった機能を構築する方法を紹介しました。それらのチュートリアルでは Teams アプリ機能の種類や概念についてに焦点をあてるために App Studio を使用し、手動で最小限のローカル環境のみをセットアップする方法をとりました。

今回のチュートリアルでは、最近リリースされた開発者ツールを使っての開発方法を紹介したいと思います。
![toolkit-cover-1000×420.png](https://qiita-image-store.s3.ap-northeast-

node_modulesを復元する方法

過去のLaravelプロジェクトなどで使っていたnode_modulesを新規プロジェクトでもそのまま使いたかったので、復元方法を備忘録として残して起きます。

#前提
・npmが使えること

#用意するもの
・過去プロジェクトなどで利用したpackage.jsonの`”devDependencies”: { … }`
・新しいプロジェクト（インストール済み）

#やり方
自身の過去プロジェクトなどからpackage.jsonを開き、`”devDependencies”: { … }`をまるごとコピーします。
自分の環境では以下のコードをまるっとコピーしましたが、自身の環境に合わせて削除（または追加）してください。

“`package.json
“devDependencies”: {
“@babel/core”: “^7.14.3”,
“@babel/preset-env”: “^7.14.4”,
“@tailwindcss/forms”: “^0.2.1”,
“@tailwindcss/postcss7-compat”: “^2.0.4”

electronを使ってwindowsで音声入力できるようにするアプリを開発した

音声入力を色々と触るようになってきたので、windows上で疑似入力できるようにアプリを作ってみる。

“`app.js
socket.on(‘soundMessage’, function ( data ) {

textMessage = data;

console.log(data);

var ks = require(‘node-key-sender’);

clipboard.writeText(textMessage);

ks.sendCombination([‘control’, ‘v’]);

}
“`

web speech apiが結構便利

windowsアプリからブラウザをホスティングしてそこから文字データを持ってくる
やり方で作成した。

node.jsで文字を疑似入力するときにnode-key-senderが便利
クリップボードに文字データを張り付けてControl + V を

Error: npm ls -prod -json -depth=1 failed with code 1

AWS CLIの`serverless package`コマンドでデプロイパッケージ作成処理を行った際に、以下のエラーが出た。

`Error: npm ls -prod -json -depth=1 failed with code 1`

node_modulesでエラーが出ているということなので、削除した後、`yarn install`を行ったが、解決しなかった。

## 解決方法
Nodeをダウングレードした。

Node Version：　15.8.0
↓
Node Version：　14.15.4

“`
nvm list
“`


“`
nvm use v14.15.4
“`

以上。

【AWS】Lambda+SQSでサイロ + プールモデルを実現するためのディスパッチャ構成検討

## きっかけ
– 弊社が過去に開発し、現在も引き続き運用、追加開発をしているクライアントのSaaSがあり、:man_tone1: “特定のユーザが大量にリクエストしたときに他ユーザのリクエスト実行まで時間がかかるので、解消したい”とのリクエストをもらったから。

## 現状分析
– リクエスト受信部分はREST APIで構成、他ユーザのリクエストに処理時間は依存しない
– 実処理部分はリクエスト受信部分と非同期で処理を行っており、実処理が順次実行のため、この部分がボトルネック
– 以下サイトで分類されている分離パターンでは現状は、1. サイロモデル

https://aws.amazon.com/jp/builders-flash/202105/tenant-isolation/

– 特定処理、特定ユーザだけ分離できればいいので、3.サイロ + プールモデルを目指したい

## 検証で目指す構成
– リクエストを受けるSQS→各リクエストを割り当てるDispatcher用Lambda→特定ユーザ用SQS,汎用ユーザ用SQSとそれぞれ実処理Lambdaをつなげる(本記事では実処理L

node.jsでsocket.ioを使い大きなデータを送信すると途切れる話

node.jsで音声データのやり取りをする処理を書いたのだが、大きなデータだと途切れる時がある。

なんか色々調べたら、これで解決できるらしい。

socket.ioを持ってくるときに

“` app.js
const io = require(‘socket.io’)(http,
{maxHttpBufferSize: 1e10}
);
“`
バリバリドキュメントに書いてあるのだが、しばらく沼ったのでメモ

maxHttpBufferSize　は指数記法で書くらしい

https://socket.io/docs/v3/server-initialization/#:~:text=upgrade%20is%20cancelled.-,maxHttpBufferSize,-Default%20value%3A%201e6

cloudFunctions上でpuppeteerのuploadFileを扱う

cloudFunctions上のpuppeteerで画像アップロードする際、ハマってしまったことがあるので備忘録です。

## やりたいこと

①cloudFunctions内からpupeteerを動かす
②対象のファイルを`input type=”file”`に入れる

この流れです。
簡単そうに見えますが、ここでハマってしまいました…

## ハマった原因

puppeteerで画像をuploadする際は[uploadFile](https://pptr.dev/#?product=Puppeteer&version=v10.1.0&show=api-elementhandleuploadfilefilepaths)という関数が用意されています。
uploadFileは以下のように書くことができます。

“`js
// アップロードする対象を選択
const inputUploadHandle = await page.$(‘input[type=file]’);
// アップロードするファイルのパスを選択
let fileToUpload = ‘./upload_file.j

[Nodejs] 浮気者のthisを固定して一途に変えてやる

# はじめに
めちゃ久しぶりに記事書きます。Pirikaraです。
最近ほぼJavascriptばっかり書いてますが、業務中に解決したやーつを共有したいと思います。

# this
呼んだ所々で値が変わってしまう`this`。大変浮気者ですよね。
thisの挙動の違いについては[こちら](https://qiita.com/knknkn1162/items/0fa7dcb6a735125d21db)。

僕は大変真っ直ぐな男なので、日々不倫やら浮気のニュースに心を痛めています。
人間界でも浮気は困ったものですが、プログラミングでも最近thisの浮気で困ったことになりました。

# Jestでthisを扱うコードをテストする時に詰んだ
こちらのmixinは、Vue.jsのコンポーネントにmethodsとして読み込まれる関数をまとめたものです。
バックエンド(Ruby on Rails)のコードは自動テストを走らせて品質を担保していますが、フロントのjsファイルに関してはE2Eテストを行なっていました。
E2Eだけでは見落としが発生してしまうので、フロント側にも段階的に自動テストを導入して

【Heroku】Node.js × TypeScript で作成した API を Heroku にデプロイする。（なるべくCLIは使わない）

# 概要

表題の通り、Node.jsで作成したAPIを**Heroku**にデプロイする工程をまとめました。
CLIが苦手なので、なるべく使わない方向でデプロイします。

# 環境

– Windows10
– VSCode

グローバル環境に以下をインストールしているものとします。

– Node.js（npm）
– TypeScript

# API を作成する