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

Node.js関連のことを調べてみた2022年06月19日
目次

npm WARN config global `–global`, `–local` are deprecated. Use `–location=global` instead.が出た時の解決策

数日前に突然“`npm WARN config global `–global`, `–local` are deprecated. Use `–location=global` instead.“`なるエラーが出るようになった。
どうやらnpmをグローバルインストールしていると“`–location=global“`推奨のメッセージが出てしまうらしい。
npm8.12.1ではすでに修正されているので、“`npm -g update“`でアップデートすれば直るとのこと。(エラー時点では、8.11.0を使っていた)

代替策としては、program Files > nodejsインストールフォルダ内のnpmファイルとnpm.cmdファイルを以下のように変更する。

“`diff_batchfile:cmd 23行目
– NPM_PREFIX=`”$NODE_EXE” “$NPM_CLI_JS” prefix -g`
+ NPM_PREFIX=`”$NODE_EXE” “$NPM_CLI_JS” prefix –location=global`
“`

“`di

元記事を表示

Docker-compose3でnode.js&express&mongodb&nginxの環境を整える[完全版]

# はじめに
 これはある記事を参考にnode.jsとmongodbとnginxのDocker環境をcomposeでめっちゃお手軽に作ったろ、とか思ったらエラーしたため案外悪戦苦闘してしまった人の後日談です。
 記事を書くとしたら、以下のURLをモロパクな感じになっちゃうと思って遠慮していた(というかダメ)なんですが、久しぶりに環境を整えようとしてみたら思ったよりもメンドクサかったので、備忘録という免罪符を元にモロパクしようと思います。
 モロパクしようと思ったのですが、ついでにexpress-generatorを使用してテンプレートを利用してみようと思って、少し本家様の流れから改変しています。また、この記事はCentOS7をインストールした直後を想定していたりいなかったりしています。

[引用]

https://zenn.dev/cizneeh/articles/nginx-node-mongo-docker-example#docker-compose.yml

# 環境
**2022/06/17**
・CentOS7
・Docker 1.13.1
・Docker-compose

元記事を表示

AWS IoT Coreにブラウザから様々な認証方法で接続してみる

AWS IoT Coreとして、MQTT ブローカが実装されており、自身でブローカを立てる必要がないですし、ブラウザ向けのクライアントライブラリもあるので、楽です。

AWS IoT Coreの認証方法にはいくつかの種類がありますので、それらを実際に試してみます。状況に合わせて使い分けてみてください。

ちなみに、今回扱うのは認証方法であって、MQTT/WebSocket/Httpといったプロトコルの種類ではないです。プロトコルは、AWS IoT Core側は特に違いは意識する必要はないですし、クライアントライブラリも違いを最低限にしてくれています。

以下の認証方法を扱います。

① (まずはNode.jsから)AWS IoT証明書を使って認証する。
② IAM認証
③ IAM+AssumeRole認証
④ Cognito認証
⑤ カスタムオーソライザ

<やること>
・AWS IoT Coreに認証して接続後、トピック名「test_sub」に対して、Subscribeします。
・いずれかのクライアントから、トピック名「test_sub」に対してPublishします。

ソースコード

元記事を表示

Node(npm)でWebpackコマンドでエラーになる

# はじめに

「TypeScriptハンズオン」という書籍を勉強するにあたって、書籍の環境構築手順をDocker環境で構築しようと考えました。

試行錯誤して1度できたのですが、なぜか2回目にやったときにコマンド実行でエラーが発生しました。そこで発生した事象が調べたところどこにもなかったのでまとめます。

# 問題

以下のようなエラーが発生しました。

“`
$ npx webpack-cli init
=> [webpack-cli] No commands found to run

$ npx webpack-dev-server
=> const maxPort = 65_535でシンタックスエラー
=> webpack-dev-server syntaxerror unexpected token =のエラーもでた
“`

前に1度作成したときにはできたのになぜか同じ手順を踏んでもできなくなっていました。

# 解決方法

原因はDockerで利用している`Nodeイメージ`が**古い**ことでした
`node:10`を古い記事をみて利用していました。これを`node

元記事を表示

地震情報を簡単に扱いたい!

:::note warn
読みにくい記事に注意してください….。
:::

## tl;dr
地震情報を簡単に扱えるようにするやつ

## はじめに…

まずは皆さんに、P2PのAPIのすばらしさをば
・[WebScoketAPI](https://www.p2pquake.net/json_api_v2/#/)から送られてくるやつはJSONなので扱いやすい(最高)
・情報伝達がすごいほど早い
・すごい

## 今回作った奴

https://github.com/akikaki-bot/p2pws_getter

今回はTypeScriptで大部分を書きました。TSは簡単なやつでしか書いてないので結構難しかった….。

## しくみ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2594613/ed3b92f1-71c4-3547-1f59-47b14ce82236.png)

## 感想

たのちかった。TypeScriptだいちゅき。

## Link
APIの本
ht

元記事を表示

npm WARN config global `–global`, `–local` are deprecated. Use `–location=global` instead.への対応メモ

Reactを使おうと思ったら

“`
npm WARN config global `–global`, `–local` are deprecated. Use `–location=global` instead.
“`
(npm 警告グローバル設定 `–global`, `–local` は非推奨です。代わりに `–location=global` を使ってください。)

みたいな警告が。

## 調べてみる

調べてみると、こちらのstackoverflowの記事がヒット。

https://stackoverflow.com/questions/72401421/npm-warn-config-global-global-local-are-deprecated-use-location-glo

Windowsで起こる現象みたいですね…?

## 対応策

どうやら…**node.js**がインストールされているディレクトリ(**Program Files/nodejs**あたり)の中にある

– npm
– npm.cmd
– npx
– npx.cmd

元記事を表示

arraybuffer 画像を FormData で Node.js サーバにアップロード

LINE WORKS のトーク Bot を使って送信した画像をLINE WORKSのストレージからダウンロードして、 Node.js サーバーにアップロードするサンプルです。
LINE WORKSのストレージからダウンロードした画像はarraybufferの形です。
axiosを利用します。

#### ダメなコード

“`
import Axios from ‘axios’;
const FormData = require(‘form-data’);

……

try {
const lwResponse = await Axios.get(
‘http://storage.worksmobile.com/openapi/message/download.api’,
{
headers: {
consumerKey: consumerKey,
authorization: ‘Bearer ‘ + accessToken,
‘x-works-apiid’: apiId,
‘x-w

元記事を表示

型定義リポジトリをGitHub Packagesで社内限定公開する(yarnでもnpmでも)

サーバーサイドと、クライアントサイドで共通して利用する型定義リポジトリを作ります。

型定義を社内のリポジトリで共通して使用します。`DefinitelyTyped`的な使い方が理想です。

では作っていきましょう。

なお先人がいらっしゃったので参考にしています。

https://zenn.dev/odiak/articles/950f05a34e9c84

# 手順
初期化
“`
npm init
“`

TypeScriptとPrettierを追加
“`
yarn add -D typescript prettier
“`

tsconfig.jsonはこんな感じにしてます(ほぼ参考記事コピペ)
“`json
{
“compilerOptions”: {
“target”: “ES2017”,
“module”: “CommonJS”,
“declaration”: true,
“strict”: true,
“outDir”: “./dist”
},
“include”: [“./src/**/*”],
“ex

元記事を表示

Next.js学習まとめ

# Next.jsの学習まとめ

### Create Next App
“`zsh
npx create-next-app nextjs-sample
“`

### ルート管理
ReactRouterではそれぞれのコンポーネントでルートを管理していたが、
Pages内のフォルダディレクトリで管理できるようになるメリットがある。
PagesフォルダはNextCreateApp時に追加されるので、これを使用する。
また、ルーティング管理のために特別な名称があり、
index.** というファイル名は”/”を表しており、
_**.**というようにアンダーバーから始まる場合はルーティングされず
ルーティング不要なファイルに使用されている。(_app.jsなど)
[**].**とした場合はパラメータを表し、
[…**].**とした場合は複数のパラメータを受け取る。

|階層1|階層2|階層3|
|—-|—-|—-|
|Pages|_app.js|
||index.js|
||main|index.js|
|||content.js|
|||[articleId].js|

元記事を表示

node.jsのモジュールについてまとめ

# node.jsのモジュールについて
この記事ではnode.jsのモジュールについてまとめてみた。
## httpモジュールについて

まずはhttpモジュールを使う。

“`node.js
const http = require(“http”);
“`

webサーバーを立てる。

“`node.js
const server = http.createServer();
“`

リクエストイベントを登録して、クラインアント側のリクエストを監視する。

“`node.js
server.on(“request”,(req, res) => {
console.log(“誰かこのサーバーにアクセスしてきました。”)
})
“`

ここで少し補足を加えると、クライアント側からサーバーに対してリクエストがあった場合、server.on()の第二引数のコールバック関数が呼び出されます。

コールバック関数の引数である(req,res) => {} のreqについて説明すると、引数reqにはサーバーにアクセスしてきたクライアント側のデータや属性が格納されています。

– r

元記事を表示

WindowsでbuildするとError: EPERM: operation not permittedが発生する問題への対応

## 何が起きていますか?

Windowsでフロントのビルドを行うと頻繁に下記エラーが発生する

“`bash
$ yarn clean && npm-run-all build-prod:* && yarn rev-update
$ npm-run-all -p clean:*
$ node ./tasks/javascripts/clean
$ rimraf ./xxx ../xxx/
2 js files deleted
$ cross-env NODE_ENV=production webpack -p –config ./webpack.config.production.js

# 問題のエラー
Error: EPERM: operation not permitted, open ‘C:\xxx’

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
ERROR: “bu

元記事を表示

ESLintでParsing error…となった時の対応 parserOptionsを設定する

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

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

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

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

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

元記事を表示

Node.jsに初めて触れてみた

## 背景
今までバックエンドの言語に触れたことがなかった。(そもそも駆け出しエンジニア。笑)
自分で以前作ったアプリでは、
MBaaSのFirebaseでバックエンドの処理を代行してもらってた程度。

そんな状態ではいかんぜよ。。
ということで、Node.jsの基本を学んだので、
復習もかねて、アウトプットしてみる。

## 前提
* Node.js(v16.14.2)
* VSCode
→適当なディレクトリでtest.jsを作成しておく

## Node.jsを学ぼう
それでは、いってみよう~!
### 【1】簡単な計算をしてみよう
以下のように、aに10を、bに5という数値を入れて、
console.logにてa+bの結果を表示させてみる。
“`test.js
let a = 10;
let b = 5;
console.log(a+b);
“`
VSCodeでターミナルを開き、`node test.js`を実行。
そうすると、以下のように結果を表示してくれる。
“`ターミナル
C:\example\example> node test.js
15
“`
#### 重要

元記事を表示

asdfでPHPやNode.jsをインストールしたかった

# はじめに

複数言語のバージョン管理ができる[asdf](https://asdf-vm.com)でPHPやNode.jsをインストールしたかったというお話。
結論、 PHPプラグインのAppleシリコン対応がまだ不十分なのでHomebrewでPHPをインストールしつつ、Dockerでマルチバージョン環境を作るのが良さそう。

## 環境

Mac mini m1

# asdf

https://asdf-vm.com

“`bash
brew install asdf
echo -e “\n. $(brew –prefix asdf)/libexec/asdf.sh” >> ${ZDOTDIR:-~}/.zshrc
“`

# Node.js

“`bash
brew install gpg gawk
asdf plugin add nodejs https://github.com/asdf-vm/asdf-nodejs.git

asdf list all nodejs lts
asdf global nodejs lts
“`

で現時点で最新のLTS(16.x

元記事を表示

GitHub ActionsでmainとdevelopブランチへのPull Requestに対して自動テストを設定する

# 概要

Github Actions (以降、「Actions」と略記)を用いてNode.jsでCI(Unit Testを自動実行してPassしている状態を保つ、を意図)する方法を記載する。

次を目的とする。

* masterとdevelopブランチに対するPull Requestが作成された際に、**Request元のブランチ**に対して「`npm run test`」が実行されるようにする

なお、本記事の記載内容は、次の公式ドキュメントに記載の内容とほぼ同じである。本記事は「実際にやってみると、こういう手順になる」を示すことを目的とする。

* Building and testing Node.js – GitHub Docs
* https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs

また、先のドキュメント「`Building and testing Node.js`」は、Node.jsでのCIに特化したサンプルを提供してくれている

元記事を表示

Botを使ってみた(Node.js + Bot Framework Emulator)

## 背景
日々業務でスキルアップを目指す中、
Botに触れる機会がありつつも、その裏側に触れたことがなかった。

嬉しい事に最近、Botを学ぶ機会があったので、
復習もかねて、実施した事をアウトプットしてみる。

## 前提
* Node.js(v16.14.2)
* VSCode
* VSCode拡張機能で、Teams Toolkitをインストール
![スクリーンショット 2022-06-11 131558.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2627323/e7d95e6a-c62f-cff5-57ff-541c3ae760ef.png)
* Bot Framework Emulatorをインストール
* サンプルのアプリケーションを作成(以下参照)
1. VSCodeのTeamsToolkitで、「creat a new Teams app」を選択
2. Capabiliiesで、「Bot」を選択
3. Programming Languageで、「JavaS

元記事を表示

Nuxt で定期的に変更される Sitemap ファイルの生成方法

## 初めに
現場で SEO 対策の業務を行なっているのですが、Nuxt で動的に変更されるような Sitemap の生成方法がなかなか難しかった(記事もあまり見つからなかった)ので、ハマったこととどう解決したのかなどを記事にまとめようと思います。

そもそも、なんで動的に変更される Sitemap ファイル生成が必要になったかですが、[Sitemap に記載する URL が 50,000 件を超える Sitemap はファイルを分割する必要があります。](https://developers.google.com/search/docs/advanced/sitemaps/build-sitemap?hl=ja#:~:text=1%20%E3%81%A4%E3%81%AE%E3%82%B5%E3%82%A4%E3%83%88%E3%83%9E%E3%83%83%E3%83%97%E3%81%AB%E5%AF%BE%E3%81%97%E3%81%A6%E3%82%B5%E3%82%A4%E3%82%BA%E3%81%AB%E9%96%A2%E3%81%99%E3%82%8B%E4%B8

元記事を表示

npm run compile:scssでエラー

# 背景
SalesforceのCommerce CloudにStripeを導入する過程(下記①)で、
下記コマンドを打つというものがあったが、ここでエラーにはまった。

“`
npm run compile:scss
“`

# やったこと
– 当初はNode推奨版のv16.15.1をインストールしていた
– その後v8.11.1にダウングレードして試したもののうまくいかない
– 下記②の記事を参考にし、Nodeのバージョンをv12.16.0にアップグレード
– その上で下記③の記事を参考に、以下の「node_modulesを消す、npmのキャッシュクリア、node_modulesを入れ直す」というnpmのエラーでは鉄板(?)らしい対処法を試した
“`
rm -rf node_modules && rm package-lock.json && npm cache clear –force && npm cache clean –force && npm i
“`
– その後以下コマンドを再度試したら、うまくいった
“`
npm run compile:scss

元記事を表示

MacにNode.jsをpkgでインストールしたらbrew doctorで警告が出たので再インストール

# はじめに

MacでNode.jsを使いたくて、[公式ホームページ](https://nodejs.org/ja/)からpkgをダウンロード、インストールしました。その後、`brew doctor`を実行したら、node関連のファイルの影響で警告が出ていたので、homebrewから再インストールしようとやってみました。

# Node.jsのアンインストール

必要に応じて`sudo`で実行してください。

まず始めに、npmのアンインストール。

“`
$ sudo npm uninstall –location=global npm
$ rm -rf .npm
$ npm -v
“`

最後に、「zsh: command not found: npm」と出力されたら成功。

次に、Node.jsのbomファイルから削除対象のファイルを取得して削除。それ以外の関連するファイルも削除。

“`
$ lsbom -f -l -s -pf /var/db/receipts/org.nodejs.node.pkg.bom | while read i; do sudo rm /u

元記事を表示

Node.js(Express)で書いたJSONデータの受け渡しプログラムをHeroku上で動かしてみる

Node.js(Express)でGETリクエストに応答するだけのプログラムを作れたので、次はクライアント側からPOSTしてなんやかんやするプログラムを作ります。
JSONデータのPOSTを受け取って、そのままJSONデータを返してもらいましょう。
# 結論
どハマりするポイントもなくすんなり書けます。
JSONデータを受け取る、JSONデータを返すができればDB連携のあるプログラム作成も目前感がしてちょっとした進歩感が出てきて嬉しい。

##### 環境
Win10+VSC@1.68
Node.js@16.14.2+Express@4.18.1
##### やろうとしたこと
– Herokuサービス上でNode.js(Express)アプリケーションを動かす
– JSONデータをポストしてJSONデータを返してくれる実装

## やってみる
Herokuにアプリをデプロイするのはこっち参照

https://qiita.com/shichisan21/items/b163e33669763ca6fffc

POSTされたJSONデータを返すプログラムの作成メモはこっち

https

元記事を表示

OTHERカテゴリの最新記事