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

Node.js関連のことを調べてみた2021年05月13日
目次

M1 MacでのZeroMQ (Node.js) 導入

フロントエンドの開発をやっている中で、既存のプロジェクトをクローンしてきた時に問題が起こりました。 `yarn` したら途中でエラーになる。どうやら `zmq` ライブラリがコンパイルできていないようです。M1 Macに変えたばかりなので「もしかして`zmq`はM1対応してないのかな〜」とも思いましたが、もしそうだとしたらお手上げなので地道に調べることにしました。

###結論

事前に依存ライブラリをインストールする!

###エラーメッセージ
エラーメッセージは次の通りです。

“`zsh
error /Users/{myName}/develop/vue/o-GreenCheck/frontend/node_modules/zeromq: Command failed.
(略)
Building libzmq…
/Users/{myName}/develop/vue/o-GreenCheck/frontend/node_modules/zeromq/build/Release/../../script/build.sh: line 60: cmake: command no

元記事を表示

プログラミング初心者向け!トイドローン「Tello」をScratchで飛ばす

仕事でTelloを使って職場を撮影するというミッションを与えられたので、先ずはプログラム制御できるようにScratchと繋いでみました。途中ちょっとつまずいたので備忘録がてら記事にしていきます。

##Telloとは
中国のスタートアップ企業Ryze Techが開発・販売しているトイドローンです。
価格の割に性能がよく、ホバリングや姿勢制御などある程度のことは自動でやってくれる上に軽くてカメラの性能も結構良い感じです。
![20210511_161037.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1264471/d21f1e42-ff72-4ee1-ab76-548a24d03d6f.jpeg)
こんな見た目です。

[Tello公式ホームページ](https://www.ryzerobotics.com/tello)

また、Telloには専用のSDKが用意されており、PythonやScratchなどで制御することができます。
今回は**[初心者でも簡単にプログラミングができるScratch](h

元記事を表示

DOMやwindowに依存しているPrismのプラグインをNode.js上で動かす方法

Prism.jsのline-numbersプラグインなどは、ブラウザ上での動作を前提とした設計でDOMやwindowに依存しているため、Node.jsのようなサーバーサイドで`require`しても動作しません。

## 解決策

ではどうやったら動くか?解決策は次の通りです。

### DOMに依存している問題の解決策

DOMに依存しているコードが動くようにするために、`jsdom`を使います。

### グローバルオブジェクト`window`に依存している問題の解決策

line-numbersプラグインなどは、`window.Prism`が`undefined`だとプラグインのロードをやめてしまいます。この解決策としては、`vm`モジュールを使い、擬似的にグローバルオブジェクトとして`window`があるサンドボックス環境を作り、その中で、プラグインコードを`eval`してやるようにします。要するにPrismにブラウザ環境だと思わせるようにするということです。

### 上の解決策を講じたコード

次が上の解決策を施したコードです。

“`loadPlugin.ts
impo

元記事を表示

【Node.js】WatsonサービスをSDKを使わずに呼び出す

# はじめに

Node.jsでIBMの提供するWatsonサービスをSDK([ibm-watson](https://www.npmjs.com/package/ibm-watson))を使わずに呼び出すコードを備忘録のために残します。

IAM認証せずにWatsonサービスを呼び出すので、外部のpublicなインターネットに接続のできないIBM CloudのIaaS環境からWatsonサービスを呼びたいとき、Watsonサービスをさくっと触りたいときなどに有効な方法です。

※アプリケーションがSDKを使ってWatsonサービスを呼び出す仕組みになっているが、実行環境でIAM認証出来ない(publicなインターネットに接続できない)場合には、IamAuthenticatorの代わりに、BasicAuthenticatorを使えばよいです。

今回はWatson DiscoveryというAI文書探索サービスのquery APIを呼び出すサンプルです。

# セットアップ

今回はHttpクライアントとして、[axios](https://www.npmjs.com/package/a

元記事を表示

(入門)Node.jsで初めてのWebサーバーを立ち上げる Windoows10環境

node.js で サーバーを作成します。

環境
node v12.18.1 npm 6.14.4
windows10

nodeは以下のサイトを参考にして、インストールします。
https://qiita.com/satoyan419/items/56e0b5f35912b9374305

nodeのバージョン管理は以下のサイトを参考にします。
https://qiita.com/satoyan419/items/56e0b5f35912b9374305

vscodeでフォルダを作成して、
app.jsファイルに以下のコードを記入します。

“““js:app.js
// モジュールをロードする DOMの代わり
const http = require(‘http’);

// サーバーを作る
var server = http.createServer(
(request,response)=>{
response.end(‘hello’);
}
);
// ポート番号:3000で受け付け開始
server.listen(port =3000);

元記事を表示

Webアプリケーション開発におけるフロントエンド、バックエンド分離環境

# 目的
* PoC業務で、数年ぶりにWebアプリケーション開発を行うことになって、開発環境、特にフロントエンド開発環境の進展、変貌に驚いた。
* 動的コンテンツはJSP, Ajaxで止まっており、テンプレートにjavascript, JSPタグを必至に埋め込んでいた自分にとって、これは纏めないと速攻忘れそうだ。

# 開発環境の構成

* フロントエンドとバックエンドはREST APIで分離されている。
* フロントエンドはローカル環境(Windows10, Mac)で開発可能
* フロントエンド開発においてバックエンドはスタブで代用可能

![test_frontend.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/282300/eb21dd89-1203-4634-39f5-79548d8f3872.png)

# この開発環境の利点
* フロントエンド、バックエンドの開発環境、開発体制を分離できる。(REST APIのみ取り決め)
* フロントエンド開発はjavascriptダミー

元記事を表示

WEBアプリ『ひとこと日記』概要

#アプリの概要
アプリ名:**[ひとこと日記ver2](https://diary-app.sekiguchiportfolio.net/)**
日々の記録をテキスト形式で保存する、シンプルな**日記アプリ**です。
コードはGithubにてご覧いただけます。(**[フロントエンドのコード](https://github.com/Sekiguchi-Atsushi-WEB/vuecli-app)**・**[バックエンドのコード](https://github.com/Sekiguchi-Atsushi-WEB/express-app)**)

#作成環境
・インフラ:**AWS**
・バックエンド:**node.js** + **Express**
・フロントエンド:**Vue.js**
・データベース:**MySQL**

**●各バージョン**
node.js v12.18.2, Express 4.17.1, Vue.js 2.6.12, Veu-CLI 4.4.6, MySQL 8.0

#アプリで行う主な処理
– ユーザー登録・認証処理
– 日記のCRUD処理

#アプリの

元記事を表示

node.js+Vue.jsアプリのWindowsサービス登録方法

#winserを使用してnode.js+Vue.jsアプリをWindowsサービスに登録する
node.jsアプリのWindowsサービス登録にはwinserモジュールが使えますが、vue-cliを使ったアプリをWindowsサービスに登録する場合にはwinserコマンドがそのまま使えませんでした。
winserがラッピングしているNSSMを使ってWindowsサービス登録ができたので、その方法を紹介します。

#手順
### 1. winserを導入
“`dos
$ npm install winser
“`
導入されると/node_modules/winserディレクトリができる
### 2. NSSMを起動
<アプリ名>にはWindowsサービスとして表示したいアプリケーション名称を入れる

“`dos
$ C:\<アプリディレクトリ>\node_modules\winser\bin\nssm.exe install <アプリ名>
“`
以下のような画面が表示される
![image.png](https://qiita-image-store.s3.ap-northeas

元記事を表示

DynamoDBクライアントでセッション再利用されるのか実験してみた その2

[前回](https://qiita.com/sakai-y/items/7d34c7c211f7a0fc99d4)の追加実験です。
`Promise.all()`したらどうなるのかやってみました。

# 実験1
まずは[前回の実験3](https://qiita.com/sakai-y/items/7d34c7c211f7a0fc99d4#%E5%AE%9F%E9%A8%93%EF%BC%93)の状態に、環境変数`AWS_NODEJS_CONNECTION_REUSE_ENABLED`を`1`にセットした状態で、別々のインスタンスでセッションが共有されることを確認します。

“`javascript
import { DynamoDB } from ‘aws-sdk’;
import { execSync } from ‘child_process’;

process.env.AWS_REGION = ‘ap-northeast-1’;
process.env.AWS_NODEJS_CONNECTION_REUSE_ENABLED = ‘1’;

const TableName

元記事を表示

openapi3-tsについて調べたことをまとめたい!

## 序

いろいろと前提を書き連ねますが、読むのが面倒な人は本まで飛んでください!

### 記事内容について
この記事は「筆者(orifuji)が[openapi3-ts](https://github.com/metadevpro/openapi3-ts)を試してみるシリーズ」の最初の投稿となります

今回は主にライブラリの仕様調査、およびOAS自体の説明を行います
これで脱稿とするよりも、知見の増加・認識の更新に合わせてしばらくは編集を続けようと思っています

次回は実際に使ってみて、OpenAPI Specificationに則ったjsonないしyamlなファイルをアウトプットするところまでを扱います

最終的には、わたし自身のユースケースに沿ったラッパーライブラリを実装します

### 筆者の属性
– TS初心者
– 会社のプロダクトではTSがWeb Frontendに採用されています
– ただ、自分はServerメインのため知見はさほどないです
– OpenAPI Specification知識はある
– 前職で新規プロジェクト開発に際して

元記事を表示

毎朝時間がなくて星占いチェックができないなら、自分で作ってみよう!と「今日の運勢占いBot」を作ってみた!

#はじめに
星座を入れると今日の運勢やラッキーカラーを自動返信する「今日の運勢占いBOT」を作ってみました。
#占いBOTを作った目的
子供のころから星を見るのが大好きで、今でも星の誕生だったり、意味だったり、はたまた運命だったりを考え、日々、思いを馳せています。
そんな私は、やっぱり、星占いにも関心があり、ほぼほぼ毎朝、「今日の占いカウントダウン」をかかさずチェックしています。
ただ、最近、毎朝時間がなく、見れていないんです。
「スマホに占いのアプリでも入れようかな?」とも考えてみたのですが、今回、LINEでBotを作る!という課題がでたこともあり、「じゃあ、自分で作ってみようかな?」と思い作成することにしました。
プログラミング力まだまだですが、がんばって作ってみました!
#開発手順
下記の流れで、開発を進めていきました。
・LINE Developers 登録&設定
・Heroku 登録&設定
・node.jsで実装
LINE Developersの登録&設定、およびHerokuの登録&設定については下記URLを参照ください。
<参

元記事を表示

迷えるあなたに意思決定LINEBot!エヴァのMAGIが判断してくれます!

こんな時ありませんか?
Yes or Noの二択で迷うとき!
よくありますよね、こんな時にぜひ使ってほしいLINEBotを作製しました!

##作製したLINEBot(なんちゃってMAGI)の概要
LINEでユーザーが質問事項を入力するとBotが内容を審議したように見せて、可決(賛成)か否決(反対)の二択で答えてくれます。
エヴァンゲリオンに出てくるスーパーコンピューターMAGIをイメージして作製しました。
エヴァを知らない方のために簡単にMAGIを説明すると3種類のスパコンが内蔵されており、3種類それぞれが違うアルゴリズムで回答を出します。([MAGI (まぎ)とは](https://dic.pixiv.net/a/MAGI))
今回作製したBotはランダムで3回YesorNoを返すAPIを使用してMAGIに似せています。
また内容を確認しているように見せたかったので10文字以下の入力の場合はエヴァのキャラ、アスカに怒られる仕様となっています。
・MAGI回答
Image from GyazoCloud Foundryのデプロイで急にNode.jsが動かなくなった件

いつも通りにCI経由でデプロイしてたらデプロイが失敗してました。

`.nvmrc`にバージョンを記載するやり方でバージョン指定をしていましたが、突如指定しているバージョンが利用できなくなってフェイルするという事案が発生しました。

> 参考: [Cloud Foundry(IBM Cloud)でNode.jsのバージョン指定【.nvmrc】](https://qiita.com/n0bisuke/items/8fc4d2c1b032e1c35206)

## no match found for 15.12.0

以下が急に発生したデプロイエラーです。

`.nvmcr`には確かにv15.12.0で記載してました。

“`bash
API がファイルの処理を完了するのを待機しています…

アプリをステージングし、ログをトレースしています…
Downloading nodejs_buildpack…
Downloaded nodejs_buildpack
Cell f4f7f92d-7651-4673-be44-27fba5eccf8c creatin

元記事を表示

【覚書】Gist を簡易的な DB として使う

個人的な利用の範囲で、めちゃくちゃ楽な方法でクラウドにデータを保管したいと思ったので、Gist を使ってみた。

# GitHub 側の設定

1. https://github.com/settings/tokens でアクセストークンを取得して控えておく。
1. https://gist.github.com/ で db.json を作成して URL を控えておく。

# JS 側の実装

“`js
/**
* Gist の db.json の内容を取得
* @param {string} id Gist ID /Example: https://gist.github.com/username/{HERE}
* @returns {Promise} 内容
*/
const getGist = async (id) =>
(await (await fetch(“https://api.github.com/gists/” + id)).json()).files[
“db.json”
].content;

/**
* Gist の d

【要注意】node.jsでActive directoryライブラリによるAD検索結果をテキストとして利用出来ない

## やりたいこと
PromiseオブジェクトをStringに変換して再利用したいのです。再利用の目的はHTMLやMarkDownのテキストの中に埋め込んで使うことです。

しかし、わたしは実力不足でこれができずに、貴重な時間を無駄にしてしまいました( ; ; )

## 困ったこと
PromiseオブジェクトをStringに変換出来ません。必ず`Converting Object Promise to String in Javascript`エラーが発生します

“`JavaScript:Activedirectoryライブラリ利用
const ActiveDirectory = require( ‘activedirectory’ )
const AD = {
config : {
url : ‘LDAP://hogehoge.ad.foo.baa.jp’
, baseDN : ‘dc=ad,dc=foo,dc=baa,dc=jp’
, username : process.env.ADUSER
, pa

nodejsでtextlintを動かしてみる

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/330873/26265d02-7ccf-48af-0ccb-597c93f326ec.png)

[青空文庫:蟹工船](https://www.aozora.gr.jp/cards/000156/card1465.html) よりサンプル利用

## 概要
[textlintをnode\.jsで動かす \- Qiita](https://qiita.com/k8uwall/items/f6047a3d4758144a94cb)

[俺俺textlintルールを検討してみた \- Qiita](https://qiita.com/k8uwall/items/3c29ef2dce153e13bd1d)
で書き直し

## 構成

“`
textlint_app/ // フォルダー名をtextlintにすると衝突するので注意
+ app.js
+ .textlintrc
+ views/
+ index.ejs
`

タイトルを呟いたらポスターとあらすじを答える映画どろbotを作ってみた

##『世界侵略: ロサンゼルス決戦』と『スカイライン -征服-』ってどっちがどっちでしたっけ?
ラストに主人公が〇〇になって「うぉぉぉ!」とテンション上がったほうを見返したいんですけど、どっちでしたっけ? という時にあらすじとポスターを調べてくれるLINE botを作りました。
![0509-skyline.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1289676/ffcfa2b0-b841-7042-9636-75667e6b3310.jpeg)

##実際に動いているところの動画