Node.js関連のことを調べてみた2023年01月25日

ARでアイスブレイクを　in Azure Tech Hackathon

今回は、Azure Tech Hackathonにおいて、自分がチームリーダーを務めた**Team B**の制作物、「FruitsBasket」について紹介いたします!!

# Azure Tech Hackathonについて
顔認証やバーコード読み取りなどの**画像認識**に注目したハッカソンとなっております。IDEACTIVE JAPAN PROJECTの学生アンバサダーチームの運営で開催されました。

https://connpass.com/event/269487/

# FruitsBasketとは
FruitsBasketは、ARを使用したアイスブレイク補助アプリとなります。

## コンセプト

本アプリのコンセプトは、
「**リアルタイム画像認識で世界を広げる**」です。本アプリによ

Expoの使い方

# Expoのインストール
講義で使用した環境ツールは2020年ものなので，今時2022年ものに変更しようかと思いましたが，Expo側が対応していなかった・・・

1. Expoのアンインストール
“`sudo npm un -g expo-cli“`
1. [node jsのアンインストール](https://blog.proglus.jp/5518/#i)
1. [今度はHomebreでインストール](https://brew.sh/index_ja)
1. [Homebreで最新のLTS Nodejsをインストールする](https://tech-blog.s-yoshiki.com/entry/254#nodejs%E3%81%AE%E6%A4%9C%E7%B4%A2)
1. expo-cliをインストールしようとするるもNodejsが新しすぎるということでエラー
“`required: { node: ‘>=12 <=16' },``` 1. Nodejsをアンインストールしてnodejsのバージョン１６の安定板をダウンロード # プロジェクトの作成 以下コマンド

TypeScriptでMessagingAPIを介してLINEBotのリッチメニューを設定する方法

# はじめに
TypeScriptを使ってLINEBotの開発をしている中,リッチメニューの更新が[公式リファレンス](https://developers.line.biz/ja/docs/messaging-api/using-rich-menus/)で解説されている方法だとめちゃめんどくさいと思いました．
そのため,実行するだけで一発でリッチメニューの更新をできるようなコードを実装しました．
TypeScriptとして探すとあまり記事がみつからので共有しておこうと思います．

# 環境
– node.js 16.19.0
– line/bot-sdk 7.5.2

# 実装
とりあえず動かしたい人は，下記コードをコピーしてそのファイルを実行すれば動くと思います．その時にConfig.tsの作成を忘れないでください．
解説はコードの後に載せておきます．
“`updateRichMenu.ts
import * as fs from ‘fs’;
import { Client,RichMenu } from ‘@line/bot-sdk’;
import { CHANNEL_ACC

expressの基礎をまとめる2

こちらの記事の続きを書いていく。

https://qiita.com/ysk-s/items/db9452e4c93e392ea84e

続いて、一意のユーザーidによって表示内容を変更する。

“`
router.get(“/:id”, (req, res) => {
res.send(`${req.params.id}のユーザー情報を取得しました。`);
});
“`

エンドポイントを入力する第1引数にスラッシュ”/”とコロン”:”を打ってからidと入力する。そうすると、それを一意のidとしてページを開いてくれる。
また、そのidはreq.params.idで取得することが出来る。

postメソッドやdeleteメソッドを用いるとid情報の登録や削除などのリクエストを送ることが出来る。
そのためには専用のフォームを用いたり、APIを使用する必要がある。

続いて、res.send()の中でHTMLを表示するやり方を示す。

server.jsの中に”app.use(express.static(“public”));”というコードを加える。
こうすることで、exp

Dockerとその最も使用されるコマンド

# Dockerは
Dockerは、開発、配信、アプリケーションの実行のためのオープンプラットフォームです。Dockerを使用すると、アプリケーションをインフラストラクチャから分離することができ、ソフトウェアを迅速に提供することができます。Dockerを使用すると、アプリケーションを管理する方法と同じ方法でインフラストラクチャを管理することができます。Dockerのシッピング、テスト、コードを迅速に展開する方法を活用することで、コードを書いて実行するまでの遅延を大幅に短縮することができます。:whale:


最初に、コンピュータにDockerをインストールする必要があります。これらのコマンドはWindowsまたはMacで動作します（私はMacから作業しますが、Windowsでも実行できます）。

ここに最も使用されるコマンド:

“`
d

Prisma4にアップグレードした際に$queryRawを使用している箇所でTypeError: Cannot mix BigInt and other types, use explicit conversionsが発生する問題

# はじめに
[以前の記事](https://qiita.com/irohafox/items/2d484bbcbf9a023cb524)でPrisma3系から4系にアップグレードする必要があるケースを書いたが、
その際に発生した問題について。

# 環境
– Prisma(before): 3.13.0(<= 3.15.2) - Prisma(after): 4.8.0(>= 4.0.0)
– Provider：MySQL

# 概要
あるテーブルのレコード件数を`$queryRaw`で取得してレコード件数+1をログに出力する場合、一例ではあるが以下のように書くことができる。
“`ts
const result = await this.prisma.$queryRaw< { count: number }[] >`SELECT COUNT(*) AS count FROM users`
const count = result[0].count

console.log(‘count + 1 =’, count + 1)
“`
仮にusersテーブルに1,000件のレコード

Fast Node Manager(fnm) チートシート

# 概要
node管理のためにどのパッケージツールを入れているのかわからなくなるのでまとめておく
(fnmのインストール方法に関しては記憶にないのでたまに使うコマンドだけ、、、)

## アジェンダ
1. fnmとは
2. Commnads

### fnmとは
詳しくはこちら↓と公式にぶん投げておく

https://github.com/Schniz/fnm

### Commands

#### バージョンの確認
“`
$ fnm -V
fnm 1.31.0
“`

#### インストール済みバージョンの一覧
“`
$ fnm list
* v14.18.0 default
* v18.13.0
* v19.0.0
* system
“`

#### バージョンの指定
特定のバージョンの場合
“`
$ fnm use {@version}
Using Node {@version}
“`

デフォルトに設定する場合
“`
$ fnm default {@version}
“`

プロジェクト毎にディレクトリ配下のnodeを指定する場合
`.node-version

【Node.js】Stripeライブラリのlist系のAPIでoffsetが使えないの無理くりどうにかする

## はじめに

[【Node.js】Stripeライブラリの入出力がsnake_caseになっているのをどうにかしたい](https://qiita.com/yuta-katayama-23/items/0cf633f0f81c52f9422c)では、入出力をcamelCaseにできるようにするための独自拡張をやってみた。

今回は、StripeのAPIに`offset`がない事に気づき、SQLに親しんでいる身としては使いにくい（`starting_after`はどちらかというと、NoSQL等で使われるデータの取得を行う際のデータ位置を指定するものになっている）ので、無理くり`offset`を使えるようにする実装をやってみたいと思う。

※以下の実装を見ればわかるが、loopでデータを取得しているだけなので、StripeのAPIの[レート上限](https://stripe.com/docs/rate-limits?locale=ja-JP)に引っかかる可能性が高いので、PoCではいいかもだが、頻繁にlist取得するような実装をするのであれば、今回試しにやってみた実装はNGになると思

Node.jsの基礎をまとめる2

前回の続きです。ぜひこちらを読んでから御覧ください。

https://qiita.com/ysk-s/items/be9db685d51aac20e179

クライアントから受け取ったリクエストとレスポンスを引数として受け取り、ブラウザへ処理を返す。

最初に”res.writeHead()を追加する。これはリクエストに対してこういうHead情報を返しますよという関数。

第1引数には200を入れる。これは通信がうまくいってますよというステータスコード。
第2引数にはHeadの中身を入れる。今回はそのレスポンスで返すコンテンツの中身はhtmlファイルですよっていう中身を送る。

それが以下のようなコードになる。

“`
//ブラウザからアクセスが来たときの処理
res.writeHead(200, {“Content-Type”: “text/html”});
“`

そして、htmlファイルを読み込ませる。

htmlファイルを読み込ませるにはfsというモジュールが必要になる。
fsモジュールを読み込んでreadFileSync()という関数で非同期処理でind

Prismaで新規レコード作成時に@default(now())なカラムと@updatedAtなカラムに差異が生じる問題

# 環境
– Prisma：3.13.0
発生条件は <= 4.3.1(後述) - Provider：MySQL # 概要 こんな感じで定義されたテーブルに対して、 ```schema.prisma model User { id Int @id @default(autoincrement()) @db.UnsignedInt createdAt DateTime @default(now()) @map("created_at") updatedAt DateTime @updatedAt @map("updated_at") @@map("users") } ``` `prisma.user.create({})`を実行すると以下のように`created_at`と`updated_at`がミリ秒単位で差異が生じる結果となる。 ```sql MySQL > select id,created_at,updated_at from users;
+—-+————————-+—————-

[nodejs]mysql2のpool.queryをネストさせたら動かなくなった事象を解消した例

## 何が起きた？

下記のようなロジックを作ったところ、`入ってる`まで通るけど最後のpool.queryに入らずupdateできないことがあった。

“`js:test.js
var mysql = require(‘mysql2’);
const pool = mysql.createPool({
host: ‘127.0.0.1’,
user: ‘root’,
password: ‘password’,
database: ‘test_db’
});

// 関数呼び出し
test();

// 呼び出し用の関数準備
function test() {
pool.query(“select * from emails”, function (err, factDatas, fields) {
for (const obj of factDatas) {
pool.query(`select * from users where id = ${obj.user_id};`, function (err, user_rows, fields

世界一わかりやすいかもしれないnpmパッケージ公開方法

# npm publishの前にnpm adduserがむずい。

ええ、とにかくnpm adduserもしくはnpm loginの処理がむずいんですね。

# んで肝心のやり方は?

もうなんでもいいから早く教えろあまみやさんと聞こえてきそうなのでやっていきます。

えせエンジニアなので間違ってるかもです。よろしこ。

まずは[npmjs.com](https://www.npmjs.com/)にアクセスしてアカウント名とパスワードを決めます。ここで登録アカウント名を忘れるとのちのnpm adduserで詰むので注意。

– アカウント登録とログインを済ませたら、右上のアカウントマークから”accestokens”選択
– Generare New token選択後トークン名設定の後Select typeをAutomationに設定。
トークンをコピー(一応コピペミスったとき用にページはそのままで。)
– Terminal上で

“`
npm adduser –scope=@OWNER –auth-type=legacy –registry=https://registry.

【UserLAnd】UbuntuでNode.js環境構築

# はじめに
家にPCがないのでスマホ（Android）で開発環境を構築しようと考えました。

# 動作環境
* Sony Xperia 10 IV
* Android OS 12
* UserLAnd 3.1.4
* Ubuntu 20.04.5 LTS
* Node.js 18.13.0

# nvmをインストール
そのままapt installするとNode.jsのバージョンがnvmからインストールします。
“`bash
$ curl -k -LO https://raw.githubusercontent.com/creationix/nvm/master/install.sh
“`
install.shを編集（curlに「-k」オプションを付与）してUserLAndを再起動します。
* 編集前
“`bash
nvm_download() {
if nvm_has “curl”; then
curl –fail –compressed -q “$@”
“`
* 編集後
“`bash
nvm_download() {
if nvm_has “curl

npm ciと.npmを使ってGitHub Actionsを高速化する

# 概要

– Node.jsを使用しているCI/CD環境(今回はGitHub Actions)を高速化させたい
– 高速化のために `npm ci` と `.npm` をCIでキャッシュする手法を用いる

# `npm ci` とは

– `npm ci` は `package-lock.json` を参照して依存関係をインストールするコマンド
– 既に `node_modules` が存在する場合は一旦削除してからインストールが走る
– とはいえ `package.json` と `package-lock.json` のバージョン指定が食い違っている場合にはエラーを出してくれる
– e.g. あるパッケージをバージョン `0.9.9` でインストール後に `package.json` のバージョンだけ `1.0.0` に書き換えた場合等
– 通常の `npm install` の場合、 `package.json` と `package-lock.json` の両方を見て、依存関係の解決と `node_modules` へのインストールと、場合によっては `package-

Voltaのインストール

voltaはnodeの管理ツールです。

https://docs.volta.sh/guide/

こちらの記事を読んでvoltaすごいと思ったので自分も入れてみました。

https://zenn.dev/aiueda/articles/7dcecaa05d4f24

# 何が良いの？
1. 迅速なセットアップ
1. projectごとに設定されているnodeやnpmの環境に自動で切り替わる。
2. Rustで作られており高速
2. OSに依存しない
1. MacやWindowsどちらを使っていても同様の環境を構築できる

# 手順
公式に沿ってやればすぐできました。
https://docs.volta.sh/guide/getting-started

“`bash
# macの場合
$ curl https://get.volta.sh | bash
$ volta install node # ltsが入る
# volta install node@latest

# 確認
$ node -v
#> v○○.△△.□□
“`

:::note

expressの基礎をまとめる1

node.jsを使用するときによく使うexpressの基礎をまとめる。

expressとはnode.jsのフレームワークである。

最初に、nodeのプロジェクトを開始する。

“`
npm init -y
“`

“-y”を加えることでプロジェクト作成時、質問を省略することが出来る。

そして、nodeomnとexpressをインストールする。

“`
npm i express nodemon
“`

すると、package.jsonファイルの”dependencies”に書き加わる。

“`
“dependencies”: {
“express”: “^4.18.2”,
“nodemon”: “^2.0.20”
}
“`

そして、server.jsを作成してインスタンス化したモジュールを呼び出す。

“`
const express = require(“express”);
const app = express();
“`

expressを呼び出して、インスタンス化のような形でappという変数に入れていく。

“`
const PO

Docker alpineベースの環境でnode-gypのエラーが出た

# はじめに

Dockerでnodejsの環境をalpineベースで作成し、
`supabase-js`をインストールしようとしたところ以下エラーが発生したのを修正した時のメモ。

# エラー時の状況・原因・解消方法

## 発現時の状況

“`dockerfile:Dockerfile
FROM node:18.13-alpine3.16

RUN apk update

WORKDIR /var/www/app

USER node

CMD [“yarn”, “dev”]
“`

“`yaml:docker-compose.yml
version: ‘3’

services:
app:
build: .
ports:
– “8080:8080”
volumes:
– “./front:/var/www/app”
tty: true
“`

“`zsh
$ docker-compose exec app sh
/var/www/app $ yarn add @supabase/supabase-js

・

Creating vector tiles from Esri Feature Service using nodejs and tippecanoe

# Introduction
This article is written for my colleague M.L. and G.L.S. This article explains how I made vector tiles from Esri Feature services.

Originally, this method was developed in December 2022 and that effort was summrized in this article (in Japanese): https://qiita.com/T-ubu/items/17cb65754a54aa5ffb21

If you have the data in GeoJSON, just use it because it is much easy. This is a work flow for a case that you only have an access to the data as FeatureService.

This is a part of my wo

GitHub Actionsのcronが60日で止まる件対応をしてみる

こちらの記事になるように60日間動きがないとcronが止まってしまう模様です。

https://zenn.dev/hellorusk/articles/fc6d4696f5b269

定期的に定期実行処理が止まってる。。

## 現在時刻をもとにファイル作成してGit Pushしてみる

– 現在時刻取得
– JSONファイル作成
– GitHub Actions側からGit Push

をして定期実行すれば常に動き(commitやpush)がある状態になりそう。

## JavaScriptの処理でJSONファイルを書き出す

現在時間を取得してJSONに書き出す処理です。
時間はday.jsを使用

“`js

const fs = require(‘fs’);
const LOGFILE_NAME = `log.json`;

//日本時間
const dayjs = require(‘dayjs’);
const utc = require(‘dayjs/plugin/utc’);
const timezone = require(‘dayjs/plugin/timezo

nodebrewを使用したNode.jsのバージョン切り替え

Node.jsを使用していると、バージョンダウンさせたい時ってありますよね。
nodebrewでバージョン管理する場合、以下の方法でバージョンを切り替えることが可能です。

以下コマンドで、切り替え可能なバージョンを確認します。
`nodebrew ls-remote`
以下のように切り替え可能なバージョンが表示されます。
~~~
v0.0.1 v0.0.2 v0.0.3 v0.0.4 v0.0.5 v0.0.6

v0.1.0 v0.1.1 v0.1.2 v0.1.3 v0.1.4 v0.1.5 v0.1.6 v0.1.7
v0.1.8 v0.1.9 v0.1.10 v0.1.11 v0.1.12 v0.1.13 v0.1.14 v0.1.15
v0.1.16 v0.1.17 v0.1.18 v0.1.19 v0.1.20 v0.1.21 v0.1.22 v0.1.23
[…]
io@v3.0.0 io@v3.1.0 io@v3.2.0 io