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

Shopify App CLIとNode.jsを使用してShopifyアプリを構築する

## この記事を書こうと思った背景と、記事を読ん得られるもの
　- Shopifyアプリを構築する必要があったので、その手順と備忘録です。
　- ハマった箇所があったのでその説明
　 – 結論だけいってしまうと、Node 17で構築しようとするとエラーがでるので、公式推奨の16.13.1にすべき（21年12月時点）
　- Nodeバージョン変更するのに便利なツールを紹介します

## 記事の対象者
– Shopifyアプリ構築者
– 未来の自分　

## 環境
– MacOS 10.15.6
– Node 17.2.0 => 16.13.1に変更
– Homebrew 3.3.7

## 参考にした記事・動画
#### Shopify Japanが出してる動画
– 2021年12月現在で、少し古い内容だが全体像をつかむのにためになる。動画内で叩くShopifyAppCLIコマンドが少し古いので、その場合は公式ドキュメントを読んで確認をする。
– https://www.youtube.com/watch?v=2zDFNS6r1aQ&t=4259s
– https://www.

【BTP】SAP Feature Flags Serviceを使ってみた

この記事は [SAP Advent Calendar 2021](https://adventar.org/calendars/6252) の12月10日分の記事として執筆しています。

# はじめに

今回、SAP BTP Trialで利用できるサービスのなかからSAP Feature Flags Serviceを使ってみました。
Help Portalのドキュメントは[こちら](https://help.sap.com/viewer/2250efa12769480299a1acd282b615cf/Cloud/en-US/d485374a71a149a7ba96b7403985a1a6.html)

## Feature Flagとは？
> アプリケーションを再デプロイまたは再起動せずに新しい機能を有効または無効にできます。

とあるように、「コードを書き換えることなく動的にシステムの振る舞いを変更できる」開発手法です。
アプリケーションの外部にフラグを持つことで機能のON/OFFを切り替えることができます。

あらかじめアプリケーションからFeature Flagの状態を参照する

【Node.js】ExpressとPassport.jsで認証機能を実装する

#はじめに
普段はVue.js, Nuxt.jsに使っている者です。最近バックエンド側の知見も得ようということでExpressで個人アプリを作っているのですが、ログイン・ログアウトの実装において初めてPassport.jsというモジュールを使ったので忘れないうちにメモします。

実装の過程で躓いた箇所や不明で調べた箇所を実装コードとともに解説をしていきます。

“`javascript:server.js
if (process.env.NODE_ENV !== “production”) {
require(“dotenv”).config();
}
const express = require(“express”);
const app = express();
const bcrypt = require(“bcrypt”);
const passport = require(“passport”);
const methodOverride = require(“method-override”);
const flash = require(“express-flas

AWS初心者がNodejsで作ったLineBotのインフラを構築してみた

# AWS初心者がNodejsで作ったLineBotのインフラを構築してみた

## 概要
専門学生1年生なので大目にみてください…。
今回は、ApiGatewayをトリガーにLambdaを動かしてその結果をApiGatewayに返してくれるという単純なものです。

## インフラ構築
### Lambda作成
linebotという名前で関数を作ります。

作成できたら、LineBotのプログラムをzipファイルにして上げます。
ちなみに作成した初期の呼び出す関数は、indexのhandlerになっているので適切に設定する必要があります。

### ApiGateway作成
ApiGatewayのHTTP APIを作成します。
名前はLineBotApiにしました。
![e0

opnizでつくる「CO2センサ（MH-Z19C）データのGoogle Spreadsheetsロギングシステム」


# はじめに

こんにちは。田中みそです。
**「[opniz](https://github.com/miso-develop/opniz)」**という[obniz](https://obniz.com/ja/how_obniz_works)っぽいことができるオープンソースIoTフレームワークを作って公開しています。


最近WebSocketに対応したv0.2を公開し、家でopnizにて実際に運用しているおうちハックデバイスのv0.2化対応を行いました。
そのうちのひとつをopnizの作例として紹介したいと思います。

# CO2セン

nodeでhttpサーバーが立ち上がらなくて四苦八苦した話

#概要
同僚とWebアプリを開発しているときに、環境差分でトラブルに見舞われることはよくあると思うのですが、自分の場合なかなか原因が掴みづらかったので、解決に至った手順を書こうと思います。

#エラー内容

“`
Error: listen EADDRINUSE: address already in use 0.0.0.0:8081
“`
8081ポートがすでに使われているから、nodeでサーバー立ち上げられないよ。というエラー。
ですが、ここの問題に取り組む前にnodeの環境揃えとかんと話にならないということで、nodenvを使ってバージョンを揃えます。

#nodenv導入
MacOSを利用しているので、zshで実行しています。

“`terminal
brew install nodenv
“`
nodenvをインストールしてから以下のコマンドを実行します。

“`terminal
eval “$(nodenv init -)”
“`

次に、カールでこちらを実行します。

“`terminal
$ curl -fsSL https://github.com/no

Raspberry PiにNode.jsのインストールをして起動時に自動実行させるまで

[Node.jsアドベントカレンダー2021](https://qiita.com/advent-calendar/2021/nodejs)の9日目の記事です。

ラズパイでNode.jsを動かすをたまにやりますが、久々に触った時に忘れてることが多いので久々に触る時用にまとめておきます。

[昔書いてた記事](https://qiita.com/n0bisuke/items/2c89610fd704e806c758)よりもシンプルでした。

ラズパイにNode.jsをインストール -> 永続化 -> 自動起動 みたいなところまでをやります。

## 事前準備

vimは使いたいのでインストールしておきます。

“`bash
$ sudo apt update -y
$ sudo apt upgrate -y
$ sudo apt install vim -y
“`

## nodebrewでNode.jsのインストール

Node.jsをnodebrew経由でインストールします。

### nodebrewのインストール

“`bash
$ curl -L git.io/nod

Vuetifyで速攻でTodoアプリを作るチュートリアル

# 初めに

はじめましてKouと申します。
仕事でVuetifyを使う機会があったので備忘録と共有を含めて簡単なTodoアプリを作る方法を紹介します！

これでVuetifyの便利さが伝わったらいいなという思いを込めていきます！

完成リポジトリ：https://github.com/KouWakai/VuetifyTodo

### 完成イメージ

これが大体30分くらいで作れます


# このチュートリアルで必要なもの

Vue-cliとVuetifyのcliパッケージのみです。
次の環境構築でインストール方法は解説します。
nodejsはOSによって違うのと先人がわかりやすいやり方を解説してくださっているのでそちらでお願いいたします

以下リンクです。

・[nodejs](https

使いたいポートが既に使用されている場合の犯人探しと対処法

## まず結論

以下のコマンドを実行すればOK ※実行環境はUbuntu(Linux)です

“`sh
lsof -i:<対象のポート>
# ex.)
lsof -i:4324

# 実行結果
COMMAND PID USER FD TYPE DEVICE SIZE/OFF NODE NAME
node 19053 user 24u IPv4 61691518 0t0 TCP localhost:4324 (LISTEN)

# プロセスを削除
kill 19053
“`

## 発生した経緯

開発中にNode.js(nodemon経由)のアプリがバックグラウンドで実行されてしまった。

気がつかずに新たにNode.jsのアプリを実行したところ、以下のエラーが発生

“`
Starting inspector on 127.0.0.1:4324 failed: address already in use
“`

割とやってしまうのでメモとして残します。

【Typescript】tscコンパイル時のエラー

TypeScriptの勉強をしようと、
nodeのバージョンが12だったので、グローバルで16に上げたんですが、
tscコンパイラ時に下記のエラーが出てしまいました。

“`
../../../node_modules/@types/react/index.d.ts:239:10 – error TS2456: Type alias ‘ReactFragment’ circularly references itself.

239 type ReactFragment = {} | Iterable;
~~~~~~~~~~~~~

../../../node_modules/@types/react/index.d.ts:239:31 – error TS2304: Cannot find name ‘Iterable’.

239 type ReactFragment = {} | Iterable;
~~~~~~~~

../

REST APIをExpressで実装する際にrequestのスキーマvalidation・sanitizationをするには？

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

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

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

「新たなレモンサワーが見つかる！出逢える！」LINE Botで製作開始vol.1

**現在、大好きなレモンサワーを起点にしたユーザーと飲食店をつなげるアプリを企画中です。**

1か月ほど前にnote記事にしましたので、是非ご覧ください。

https://note.com/tanakahiroki0128/n/nedfa1acffe5b

と意気込んで企画したは良いものの、スケールを大きくし過ぎたことで絶賛迷走中ですので、企画を身の丈にあったものに修正中！

まずは、第1段階のステップとして、

:::note info
・ユーザーがレモンサワーの情報を投稿できる
・投稿されて蓄積されたレモンサワーの情報からお近くのお店を探せる
・投稿されたレモンサワー情報を集約するWEBサイト
:::

の3点を表現できるものをLINE Botで作ろうと思います。

##プロダク

【Vonage】WebRTCブラウザで着信に応答する

※2021年12月現在のAPI仕様と個人的な好みの関係で、Client SDKの[Receiving an in-app voice call](https://developer.vonage.com/ja/client-sdk/tutorials/phone-to-app/introduction/javascript)をアレンジした内容になっています。最新情報は[公式ドキュメント](https://developer.vonage.com/ja/client-sdk/overview)をご覧ください。

#必要なもの

– Vonage API Key（[作成する](https://dashboard.nexmo.com/)）
– [client-sdk-tutorials](https://github.com/nexmo-community/client-sdk-tutorials)
– [Node.js](https://nodejs.org/en/)
– [Expressjs](https://expressjs.com/)
– [localtunnel](https:/

Node.js (TypeScript) で class + arrow function の jest を使ったテスト

# はじめに

最近の TypeScript なら、関数は以前から存在する ‘function’ ではなくアロー関数を使うのが一般的だろう。しらんけど。
昨今はフロントエンドの隆盛もあってか、あるいは関数型言語からの影響か、そもそも js はクラスベースじゃないからなのか、わざわざ class にすることは少ないかもしれないが、私は日頃 c++ でなんでも class ベースで実装して暮らしているので class にまとめてしまう。そしてテストを書こうとする度に mock の使い方を忘れて調べ直すのだった。

# もくじ
* [環境](#環境)
* [class の arrow function](#class-の-arrow-function)
* [class の static な arrow function] (#class-の-static-な-arrow-function)
* [class の 非arrow function](#class-の-非arrow-function)
* [mock と元の振る舞い両方を利用したい場合](#mock-と元の振る舞い両方を利用した

音声認識をして特定の言葉をカウントしたい

#おもてなしを見える化するIoTがつくりたい！！

普段は居酒屋で働いており、プログラミングとは無縁なのですが、
おもてなしが見える化するIoTをつくりたい！！と思い、一念発起！
お休みの日にプログラミングを学びながら、日々挑戦をしています！

#やりたい企画を具体的に描く
最終的にはクラウドファンディングを行い、
共感してくださる仲間とともに、おもてなしを向上させていきたいと思っています。
今まではぼんやりと「おもてなしが見える化するIoT」というぼんやりしたものだったのですが、
「お見送り」に焦点を絞り、
・スタッフの「ありがとうございました」を計測する。
・お客様の「ありがとう」を計測する。
・その数をスプレッドシートにデータとして見える化する。
というステップで**実装

【Node.js 2021（2つ目）】 Node.js での UDP・TCP通信をシンプルに試す（2021年12月）

この記事は、[2021年の Node.js のアドベントカレンダー](https://qiita.com/advent-calendar/2021/nodejs) の 10日目の記事です。

内容は、以下の記事を書く中で使った「zigsim-ws」の中で利用されている「dgram」が気になって調べたり試したりしたことを、記事として書いた形です。

●【IoTLT 2021】 ZIG SIM から送られるデータを p5.js Web Editor上で活用してみる – Qiita
　https://qiita.com/youtoy/items/caca41a68ab3bff6ffa6

## zigsim-ws のプログラムと UDP通信
zigsim-ws は、プロトタイピングに役立つスマホアプリの「ZIG SIM」を、ブラウザ（HTML＋JavaScript のプログラム）との間で通信させる時に利用するものです。
軽く補足をすると、ZIG SIM がデータを送る時に用いる通信が UDP・TCP で、ブラウザ上の JavaScript のプログラムでは直接は扱えないものになるので、それら

Node.js(Express)の開発環境を整備する　ESLint / Prettier / Visual Studio Code / ホットリロード

## はじめに
自分でちょっとしたWebアプリを作ったりする事があるが、その時の開発環境は結構適当だったりした。ただ、今後の事を考えるとちゃんと静的解析とかを入れ込んだ開発環境を作れるようになっておくほうがいいと思い今回ちゃんとした環境の構築をやってみたので、その備忘録を残す。

行った設定は、

– Expressサーバのホットリロード対応
– webpack
– ESLint × Prettier
– VS Code

の4つ。

※以下の記事では、webapckでのバンドルをbuildという言い方をしている部分がある（buildツールとしてwebapckが紹介されるのでいいと思っている）。

GitHubのコードは以下（Step2の章の部分がこの記事でやった内容になっている）。

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

## Express serverのホットリロード
特に難しい事はなく、webpackの[watch](https://webpack.js.org/api/cli/#watch)と[nodemon](h

いろんなJavaScriptのテストフレームワークを試してみる！

[Ateam Brides Inc. Advent Calendar 2021](https://qiita.com/advent-calendar/2021/ateam-brides)の9日目は
株式会社エイチームブライズの@oekazumaが担当します。

# はじめに
今回試すJavaScriptのテストフレームワークは[Jest](https://github.com/facebook/jest)、[AVA](https://github.com/avajs/ava)、[Mocha](https://github.com/mochajs/mocha)、[tape](https://github.com/substack/tape)、[Jasmine](https://github.com/jasmine/jasmine)、[uvu](https://github.com/lukeed/uvu)です。

今回使用したコードはこちら
https://github.com/oekazuma/test-runner-compare

テストするコードは簡単な計算をするプログラムを用意し

Symbolを強制ガチホする

#この記事を書こうと思ったきっかけ
私はチャートを見ると一喜一憂してしまうタイプの人間です．ガチホが正義とは言われておりますが，チャートを見るたびに暴落の恐怖で売ってしまいそうになってしまいます(同じような悩みを持っている方もいらっしゃるのではないでしょうか…!)
ガチホを固く決めたはずの私ですが12月の頭頃の下落でも売ろうか一瞬まよってしまいました．そこで，強制的にガチホする方法を考えました．

#強制ガチホするためには
私がぱっと思いついたのは次の４つでした
・他人に預かってもらう
・マルチシグで連署し，秘密鍵を物理的に分散させることでハードルをあげる
・ペーパーウォレットに入れて物理的に遠い貸金庫に預ける
・他人とマルチシグで管理する

しかしこれらの方法では
・他人に預かってもらう
＝＞他人が持ち逃げ，勝手に売却する可能性がある

・マルチシグで連署し，秘密鍵を物理的に分散させることでハードルをあげる
・ペーパーウォレットに入れて物理的に遠い貸金庫に預ける
＝＞その気になれば売却できる

・他人とマルチシグで管理する
＝＞意見の相違で何かあったら大変

これらの問題がありま

【kintone×LINE Bot】餃子検定[非公式]を作ってみた

## はじめに
本格的に寒くていよいよ暖房を入れました、私です！
`アドベントカレンダー = ネタ披露` という脳内変換がされたので、書きに来ました！

## 何を作ったのか
私は、餃子を食べることを「自主練」と呼んでいるのですが、今年は自主練が月1の時もあり、
「そんな自主練の頻度で、本当に餃子好きと言えるのか？」「ビジネス餃子ではないのか？」と周囲の方々からのありがたい~~手厳しい~~フィードバックを頂きまして、「私の餃子好きが分かるものを作るぞ！」ということでLINE BOTを作成してみました！

自主練はサボり気味ですが、
日々、餃子の知識をインプットしている私の作った最強の(?)餃子検定を受験して下さい。
みなさま、対戦よろしくお願いします！

## デモ
まずは、何はともあれ触ってみると早いかと思います！
早速ですが、良かったらLINE BOTと友達になって餃子検定問題に回答して頂けると嬉しいです。
10問解答すると、自分の餃子レベルが分かります。
https://lin.ee/znPnwXn
![M_gainfriends_qr.png](https://qiita-im