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

Node.jsでExcelの既存フォーマットを崩さず加工したい！！！

## 導入：スマホアプリエンジニア目線
×：スマホアプリ内部でフォーマットを崩さずにエクセルを編集・書き出しをする
○:サーバーサイドでエクセルの編集・書き出し(アプリにレスポンスでExcelを投げる)をする

## 早速Node.js + Herokuでアプリを作ることに
Node.jsは初心者なのでお手柔らかに、、(アロー関数等を使えばもっと綺麗になると思います。)
今回は無料で使えるHerokuを用いてサーバーアプリを作ることにしました。
・Heroku
参考：https://jp.heroku.com/free

・Nodeの環境構築
各OSによって違いがあるので今回は省略

・expressを導入(Webフレームワーク)
参考：https://expressjs.com/ja/

・xlsx-populateを導入
参考：https://github.com/dtjohnson/xlsx-populate#xlsx-populate

### xlsx-populateに決定した理由
・今回はテンプレートのExcelファイルに追記したいのでフォーマットが崩れないものを選んだ

みんなが簡単簡単書いているので、React + JavaScript + FullCalendar を触ってみた

## Glideでカレンダー形式の予約アプリを作ったら紙以下と言われた

詳しくは書きませんが、 **会社の会議室予約管理を紙でやっていて**、テレワークの促進とともにに紙の弊害が目立ち始めたので、[Glide](https://www.glideapps.com/)でサクッとアプリ化してみました
**見出しの通りで激おこなので、フルスクラッチで作ることに決めました。**

>画像は紙以下で検索して出てきたイメージ画像です。

React + FullCalendarというありきたりなライブラリではありますが、

* 既存の記事が“`TypeScript“`向けのものが多かった
* 本当の初心者はどこにソースを追加すれば良いのかわからない
* 忘備録

以上の理由で記事を執筆します。
Reactを触ったことがなくても~~参考記事の皆

ターミナルのインタープリターを使って文字列+連番を出したい！

# はじめに
仕事してて
“`
hoge430,hoge431,hoge432,hoge433,hoge434,hoge435,hoge436,hoge437,hoge438,
“`
みたいな文字列+連番みたいなのをぴゃぴゃっと出したいなーって思ったんですよ。使う用事があったんで。
で、こういうのってターミナルの各言語のインタープリターを使うとやれるんですけど、どうやったっけなー、と思いまして。
備忘録的な感じで。

# Ruby

まずはRubyです。Rubyがこういうの一番簡単に行けたイメージあったので。

“`bash
$ ruby -e ‘(430..438).each do |i| print “hoge#{i.to_s},” end’
“`

簡潔でいいですね。

ちなみにfor文使うとこうです。結局コレでも内部的には`each`が動いているんだそうです。

“`bash
$ ruby -e ‘for i in 430..438 do print “hoge#{i.to_s},” end’
“`

@scivola さんからコメントで頂いたのですがこんな書き方も

expressの古い資料を参考にする時の注意点

# はじめに
　node.jsのexpressの色々なプログラムを見比べている時、

“`javascript
app.use(express.cookieParser());

app.use(cookieParser());
“`

　と明らかに同じ目的を持ったメソッドを見かけました。
　さて、いったいどっちの方がいいのでしょうか。それともただのエイリアスなのか。
　気になったため調べてみると知らなかった上に割と知らないとめんどくさい情報だったため記事にしておきます。

　参考

https://expressjs.com/ja/guide/migrating-4.html

## 変更点
　express3からexpress4へのアップデートにあたって、**互換性のない**変更がなされたようです。
　以下はサイトに書かれた表の変更の一覧です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2647158/fd51f7c4-6f11-daca-43c8-03b07bf384b

Sequelizeを使ってDBマイグレーションをやる方法2つを試してみた

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

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

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

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

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

HerokuでWeb名(app名)変更時の再push方法

Node.jsの初心者です。

herokuでapp名を変更するとgitリポジトリが変更になります。
この時、ローカルリポジトリは更新されていないため
変更したリモートリポジトリにpushできなくなりはまりました。
検索しても載っていなかったためこの時の解決手順を書こうと思います。

1. ローカル環境の.gitフォルダを削除する
1. git bashを起動しローカルのappフォルダに移動
1. git init g初期化
1. git add . ステージングエリアに追加
1. git commit -m “リポジトリ変更対応”　コミットする
1. heroku git:remote -a **新アプリ名** 新リモートリポジトリを設定
1. git push **-f** heroku master リモートリポジトリを強制的に上書き

要は最初からgitを作り直して
変更先にリモートリポジトリに強制的に上書きをするという方法です。

commitを戻したりしていてハマってしまった場合の一から作り直す手順になります。

discord.jsでのbotが突然起動しなくなった方へ

今日botを起動しようとしたらこのようなエラーが出ました。
“`
root@localhost:~# sudo node ytdl.js /root/ytdl.js:12 intents: Intents.FLAGS.GUILDS | Intents.FLAGS.GUILD_MESSAGES,
^
TypeError: Cannot read properties of undefined (reading ‘FLAGS’)
at Object. (/root/ytdl.js:12:20) at Module._compile (node:internal/modules/cjs/loader:1112:14)
at Module._extensions..js (node:internal/m

ブラウザからカメラを起動して録画，サーバにアップロードするまで

# やること
1. ブラウザからカメラを起動する
2. 起動したカメラを使って録画する．
3. 録画したデータをサーバにアップロードする

# 動作環境
– ブラウザ: Firefox(推奨), IE以外
– サーバ: Node.js / Express.js

# 本編
ここから実装に入ります．
## ブラウザ
### カメラ・マイクの使用
[MediaDevices.getUserMedia()](https://developer.mozilla.org/ja/docs/Web/API/MediaDevices/getUserMedia)を使います．

:::note warn
ただし，[安全でない環境では動作しません](https://developer.mozilla.org/ja/docs/Web/Security/Secure_Contexts)(undefinedになってたはず)
OK: https://, file:///
NG: http://
:::

カメラを起動するには，jsファイルに以下を記述します．
“` main.js

//オプションみた

node.jsとexpressで作るREST API入門ハンズオン勉強会

この資料はnode.jsとexpressで作るREST API入門ハンズオン勉強会用の資料です。

### アジェンダ

1. node.js HelloWorld
2. express HelloWorld
3. WebAPI（REST API）を作ってみる
—-

## 1. node.js HelloWorld

node.js（のーどじぇーえす）は、Google Chromeにも搭載されているJavaScriptエンジンV8をベースとしたJavaScriptアプリケーション実行環境です。
Google Chromeなどのインターネットブラウザと異なり、CUIのみ提供するため、主にサーバー環境やCUIベースのスクリプトの実行環境として利用されています。

それでは、さっそく、使ってみましょう。

—-
### 1-1. インストール

下記サイトからインストーラーをDLしてインストールしてください。

[https://nodejs.org/ja/](https://nodejs.org/ja/)

2022/07/12現在、v16とv18が選択で

AWS LambdaのLayerを利用する3つの種類

AWS LambdaのLayerの作り方、使い方をよく忘れるので、備忘録として残しておきます。
以下の3つのことができるLayerを作ります。3つを選択的またはすべて含めたLayerにもできますので、必要なものをLayerに選択して含めてください。
対象言語はNode.jsの場合です。

① 自作のクラスを含める
② Npmモジュールを含める
③ 実行ファイルを含める

# 準備

まず適当なフォルダを作成します。例えば、layer_testというフォルダを作ります。以降、ここをルートフォルダとみなします。

“`
> mkdir layer_test
> cd layer_test
“`

作業環境に、Node.jsがセットアップされている前提です。
バージョンは、Lambdaで指定予定のバージョンに合わせます。今回は、v14系にしました。

# ①自作のクラスを含める

こんな感じの自作のクラスを含めます。
先ほど作成したルートフォルダに作成します。

“`
> vi hello.js
“`

中身はこんな感じです。

“`js:hello.js
class Hello{

nodejsでYouTubeの動画を検索してダウンロードできるコード

# コード修正中です
自分の端末の不良でした。すいません。

まず必要なもの
– nodejs
– ytdl-core(npmでインストール)
– youtube-node(npmでインストール)

[nodejsをダウンロード](https://nodejs.org/ja/download/)

まず[Google Cloud Console](https://console.cloud.google.com/)でAPIを取得する

APIとサービス→ライブラリ→[YouTube Data API v3](https://console.cloud.google.com/apis/library/youtube.googleapis.com)→APIを有効にする

APIとサービス→認証情報→認証情報を作成→APIキー
APIキーをメモしておく

# ライブラリをインストール
“`
npm i ytdl-core youtube-node
“`

# コードかきかき
“`js:index.js
const Youtube = require(‘youtube-node

Discord.js V14の変更点(私的メモ)

# 初めに
Discord.jsがV14になったので自分のBOTのV13移行ついでにメモとして記事を書きました。
Bot: https://github.com/Zel9278/ced-bot-rewrite
今後この記事を更新するかもしれないです。

# GatewayIntentBits
IntentというClientに権限を設定するものを使うために使用するものです。
https://discord.js.org/#/docs/discord.js/main/class/IntentsBitField

“`javascript
const { Client, GatewayIntentBits } = require(“discord.js”)
const client = new Client({
intents: Object.values(GatewayIntentBits).filter(Number.isInteger) // ALL Intents
});
…
“`

# 追加されたもの
https://discord-api-types.dev/api/

スマホからValorantのストアを確認するDiscord Bot

## Valorant Bot
この記事は非常によくまとめられていた[Valorantの新ストア確認Botが出たらしい！](https://yart-lab.net/discord-valorant-bot/)の方の記事を参考に作っています。あらかじめご了承ください。

　
　

Valorantのストア情報が日替わりで毎日起動して確認しなくてはいけない！！！なんて思っている方いると思います！

そんな方にとてもおすすめするBotがあるので今回はそれを紹介していきたいと思います！

Botの追加は[Valorant Bot](https://discord.com/api/oauth2/authorize?client_id=990827352558813215&permissions=268435456&scope=bot%20applications.commands)こちらからできるのですが、BotをDiscordサーバーに追加しなくても使う方法があるのでそちらも併せて紹介したいと思います。サーバーに追加する方は追加した後「使い方」の章まで飛ばしてください。

まずは導入方法

Node.js 競プロ 標準入力 メモ

Node.js の標準入力に取り憑かれています。

## 導入

以前も[似たような記事](https://qiita.com/cwd-k2/items/1d8f696161c901775dd4)を書いたのですが、ただの自作モジュールの紹介記事でした。

今回は「競プロっぽい」をテーマに自分が見てきた・考えてきたコード例を載せます。

自分が考えた例には★印を付けておきます。「信用しないでね」の意味です。

何か面白いパターンを思いついたら随時更新する予定です。

## `fs.readFileSync` を利用する例

こちらは変数に標準出力の内容を一度に受けてしまおうというものです。

### `split` して配列を保持する

“`js
const inputs = require(“fs”).readFileSync(“/dev/stdin”, “utf-8”).trim().split(“\n”);

// 1 行目は inputs[0]
// 2 行目は inputs[1]
// …
“`

今日日よく見られるものな気がします。

こちらは、N 行目を得るために

TypeError: Intl.Segmenter is not a constructorの対処法

# `TypeError: Intl.Segmenter is not a constructor`発生の経緯
文字数を数えるChrome拡張を作成中にユニットテストを導入しようと、jsのテストライブラリ`mocha`でテストを書き始めたところで上記エラーが発生しました。

ちなみに作成したChrome拡張はこちら?

https://chrome.google.com/webstore/detail/character-counter/inbkndchoofidndibcgbijbfmmnkmoem?hl=ja&authuser=0

## `Intl.Segmenter`とは？
`Intl.Segmenter`はロケールに応じたテキストの分割を可能にし、文字列から意味のある項目 (文字列、単語、文) を取得できるAPIになっています。

> The Intl.Segmenter object enables locale-sensitive text segmentation, enabling you to get meaningful items (graphemes, wor

Bolt+glitchで、投稿に自動でスタンプを押すSlack botくんを開発した

# Slack botくんはスタンプが押せるのか
前回の記事の続き的なものになります。そもそもBoltってどう使うの？glitchって？みたいな人は下の記事から見てください。
https://qiita.com/KojoBarbie/items/7897db9d5e8ba3dc935d

## 作ろうと思った理由
Slackで下の画像みたいに軽ーく日程調整したいときってあると思うんですけど、こういう時にスタンプを使って意思表示をしてもらうのに自分がいちいちぽちぽちするのめんどくさいなって思ったので、botくんに押してもらえたら少し便利だなという感じで作ってみることにしました。


## 完成のイメージ
下の画像のように、ある特定の絵文字を押したとき、自動で○・×・考え中の3つのスタンプが押されるようにします。

![スクリーンシ

Node.jsを用いて1分でWebサーバをローカルに立てる方法

開発環境
OS：Windows系
node.jsがインストール済み前提

やること
1.winowsキー＋Rの検索窓でcmdを入力し、cmd起動
2.cdでウェブサイトのファイルを置きたい場所に移動

:::note info
カレントディレクトリにファイルが作成されてしまうので、注意
:::

3.以下を投入
“`ruby:cmd
>npx express-generator myExpressApp –view ejs
>cd myExpressApp && npm install
>npm start
“`

Node.js + Crypto + url-safe-base64で暗号と複合を試す

# ? 初めに

Node.jsのCryptoを触って暗号化について勉強したことをこの記事にまとめました。
理解に苦しんでいる方が、この記事を読んでなんとなくイメージができるようになれば嬉しいです。

サンプルコードは[GitHub?](https://github.com/hinahinako/crypto-sample)で公開しています。

# ♻️ 環境
– Node.js: v12.20.0

# ? 最終的なディレクトリ構成
これだけです。
“`
– node_modules
– package.json
– package-lock.json
– server.js
– README.md
“`

# ✨ プロジェクト作成
“`
mkdir security
cd security
npm init -y
“`

以下の設定でで新しいnodeプロジェクトが作られます。
“`json
{
“name”: “security”,
“version”: “1.0.0”,
“description”: “”,
“main”: “index.j

Node.jsとjestを使ってGithub Actionsで自動テストを実行する

システムの品質を保つためには、プログラムを作成したら期待通りに動くか動作確認が必要です。
そして品質を保ち続けるには、プログラムに変更を加えるたびに期待通りに動くか動作確認をする必要があります。
今回は以下の条件で自動テストが動いて品質を担保し続ける仕組みを作りたいと思います。

# 前提条件
– GithubActionsでテストを動かす
– Node.jsのバージョンは14系とする
– テストフレームワークはjestを使用する
– 自動テスト実行のタイミングは、mainブランチへプルリクエストを出したタイミングとする
– こうすることで、開発者がプルリクエストを出したときに毎回自動テストが動いて品質を保ちやすくなる
– そして自分のコードでテストが落ちたことが明白になる
– レビューアはテストが通ったことを確認してからmainブランチにマージできる

# ファイル構成
“`
nodejs-test-example
│ .gitignore
│ package-lock.json
│ package.json
│
├─.github
│ └─workflows

データを更新するAPIを作る

今回は更新用のAPIを作成します。APIの使用としては以下です

“`
メソッド PUT
エンドポイント /api/update/{id}
リクエストのボティ {“name”:更新後の文字列}
“`

## やりたいこと
・一覧のname列をクリックすることで更新用のダイアログを表示する
・ダイアログ上で文字列を修正して「更新ボタン」を押下するとデータを更新すうr

修正内容

https://github.com/kusakari-kai/rgforcommunication/commit/0a67cf27d2552e3d08eeb4105bfbd88099c5bb86

### 画面を整備する

https://mui.com/material-ui/react-dialog/

上記を参考にmuiのダイアログを利用します。以下のname列をクリックするとダイアログを表示するように修正しました

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/110457/bd313b2c-c29