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

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

Azure IoT Hub と Azure Functions と LINE Notify による通知を組み合わせる(簡単な動作テスト)

以下の記事に書いたように Azure IoT Hub を試してみました。

– [Azure IoT Hub へのデータ送信と Azure Stream Analytics による可視化の下準備を試す(公式ドキュメントやサンプルをピックアップしつつ) – Qiita](https://qiita.com/youtoy/items/0ca9be93c9189e71b5d1)

そして、その後に調査をしていた際に以下の記事を見かけました。

– [Azure IoT Hubで受け取ったデータを利用する方法(Azure function) – Qiita](https://qiita.com/kmaepu/items/016608d1b810a9bd6470)

つい最近、以下のようなことをやっていたのがあり、ふと上記の 2つの内容を組み合わせたものを動かしてみたいと思って、今回の記事の内容を試しました。

– [Azure Functions と LINE Notify の組み合わせ(Node.js を利用、ポータルで開発) – Qiita](https://qiita.com/youto

元記事を表示

Azure IoT Hub へのデータ送信と Azure Stream Analytics による可視化の下準備を試す(公式ドキュメントやサンプルをピックアップしつつ)

公式ドキュメント等を見ながら、Azure IoT Hub を試していきます。
(参照した公式ドキュメント・サンプルの情報は、記事の中に記載していきます)

## リソースの作成とデバイス登録
以下の公式ドキュメントの「IoT Hub の作成」・「IoT ハブに新しいデバイスを登録する」の項目の内容を進めていきます。

●Azure Portal を使用して IoT Hub を作成する | Microsoft Docs
 https://docs.microsoft.com/ja-jp/azure/iot-hub/iot-hub-create-through-portal

以下は、IoT Hub のリソース作成が完了した後です。

元記事を表示

CHIRIMENをNode.jsで使用してみる⑶      ー I2C編 part1 ー

## はじめに
本記事では、複数回に分けてCHIRIMENコミュニティが提供しているnpmパッケージnode-web-gpioとnode-web-i2cを使用してNode.jsからGPIOとI2Cを制御するために私が実施した方法とそのサンプルコードを記載した備忘録になっています。
今回はCHIRIMENのExamplesにあるI2C ExamplesのコードをNode.jsから実行可能にする方法について説明していきます。なお、I2C編は全4回になる予定で、今回は湿温度センサー”SHT-30”と温度センサー”ADT-7410”をCHIRIMENから使用する方法について説明します。

## コードの主な違い
Webブラウザ版とNode.js 版でのコードの主な違いについて説明します。

– navigator()関数がNode.jsでは使用不可、記述する必要がないため削除する。
– sleep()関数がNode.js には存在しないため、使用する場合は適宜実装する必要がある。
– その他、HTML下では動作するがNode.js下では動作しない記法を変更する必要がある。

## node-w

元記事を表示

Google Calendarから予定を取得してESP32のLCDに表示する

前回の投稿 [Google Photosからランダムな1枚の画像を取得できるようにする](https://qiita.com/poruruba/items/ac4f12022da1173b575e) にて、Google Photosに登録しておいた画像をランダムに表示されるフォトフレームを作りました。
今回は、少し拡張して、Google Calendarに登録しておいたイベントも合わせて表示するようにします。

Google PhotosのAPIの呼び出しの時には、REST呼び出しでしたが、Google CalendarはNode.js用のライブラリが用意されているのでそれを使います。
ですが、Googleアカウントログイン部分は、REST呼び出しのものを流用したいので、REST呼び出しで認証したGoogleアカウントの認証結果(アクセストークン)をGoogle Calendarライブラリに引き継ぐようにします。

ソースコードもろもろは、以下に上書きしています。

poruruba/GooglePhotosGallery

https://github.com/poruruba/Go

元記事を表示

ランダムなダミーの温湿度の値で急激な変動がない値を生成する(Node.js で simplex-noise を利用)

「デバイス+センサー」が MQTTクライアントになった構成の開発をしている中で、MQTT の値を受信する MQTTブローカーの部分や別クライアント側に手を加える開発をするのに、以下のような物理部分をセットしなくても開発できるようにしたくて、今回の内容を進めました。

Flutterの通報をSlackに通知し、Firestoreのデータを削除する

Flutter×Firebaseの構成のSNSモバイルアプリを開発中です。その中で通報機能を作成したのですが通報内容をボタン付きでSlackに送信して削除ボタンを押したら通報された投稿を削除しに行く一連の流れを構成し、通報対応を簡易かつプログラミングの知識なしで行うようにしました。使用する言語はDartとNode.jsです

#### 1、FlutterでSlack APIにPOSTリクエストし、削除ボタン付きのメッセージを送信
#### 2、削除ボタンをクリックし、Slackがそのイベント内容をPOSTリクエストでCloudFunctionsで生成したエンドポイントに対して送信
#### 3、CloudFunctionsでリクエストを受け取りFirestoreのデータを削除しに行く

今回のアーキテクチャは以下の通りです

![slack.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1295942/e3908253-f635-6dc2-bcf8-0a0226d6c71a.png)

・Slac

元記事を表示

npm 7(8) でフロントエンド開発に関わる変更まとめ

npm 7 が 6 から結構変わっていたのでそのまとめです。
普段、yarn はあまり使わず、pnpm も使ったことないユーザなので
情報の片手落ちなどがありましたらご指摘いただけると助かります:bow:

## npm 7 について
Node.js v15 から npm 7 がインストールされるようになりました。
2021/10/26 から Node.js v16 が LTS になったので、
npm 7 以上を利用する機会が今後増えると思います。

npm 6 から 7 での**フロントエンドに関する**大きな変更点と思われる箇所は下記。

– packege-lock.json のフォーマット変更
– yarn.lock のファイルサポート
– npm audit の出力変更
– workspace のサポート

バックエンド含め、そのほかの変更箇所は下記の記事が詳しいです。
[npm v7の主な変更点まとめ](https://blog.watilde.com/2020/10/14/npm-v7%E3%81%AE%E4%B8%BB%E3%81%AA%E5%A4%89%E6%9B%B

元記事を表示

DC-DCブーストコンバータモジュール

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1873014/f162f3e7-a617-c899-c732-a27006b6ca30.png)

XL6009 DC-DCバックブーストコンバータモジュール
XL6009 DC-DC Buck Boost Converter Modul

この記事はJLCPCBと共同で公開されています。JLCPCB

Gtk3アプリ NodeRedで仮想通貨を表示する その2

###Gtk3アプリ NodeRedで仮想通貨を表示する その2

####仮想通貨の価格をチャートに表示する

Screenshot from 2021-10-29 13-39-34.png

node-red-dashboardをインストールします。

https://flows.nodered.org/node/node-red-dashboard

“`
node-red-dashboard
“`

####学習動画

####パラメータ

three.jsのプロジェクトを作ってGitHubにあげてHerokuに公開するまでのステップ 2/2

Blenderで鉛筆のモデルとアニメーションを作ったので、three.jsを使用してwebブラウザに表示させたものをHerokuにアップしてみようと思います。
GitHubのリポジトリ作成から環境構築、Herokuのデプロイまでを備忘録として記載します。

今回の記事では、実際にthree.jsでシーンを作成〜Herokuのデプロイまでを行います。
それ以前の手順は以下の記事に記載しています。
[three.jsのプロジェクトを作ってGitHubにあげてHerokuに公開するまでのステップ 1/2](https://qiita.com/kyk_nr/items/ec3a0cb3e2b2004cc5e9)

# もくじ
[1. three.jsシーンの作成する](#1-シーンの作成)
[2. Herokuにデプロイする](#2-デプロイする)

#1. シーンの作成
three.jsにBlenderで作成したモデルを取り込み、ブラウザに表示させます。

:::note warn
この記事ではthree.jsやBlenderでのモデルの作成方法は記載していません。
:::

## (1)

Gtk3アプリ NodeRedで仮想通貨を表示する その1

###Gtk3アプリ NodeRedで仮想通貨を表示する その1

####仮想通貨Binanceノードをインストール
https://flows.nodered.org/node/node-red-contrib-binance

node-red-contrib-binanceをインストールします。

“`
node-red-contrib-binance
“`

Screenshot from 2021-10-29 13-08-27.png

バイナンスのノードがインストールされると、バイナンスのノードが表示されます。

Screenshot from 2021-10-29 14-10-53.png阿部寛のホームページを(力技で)遅くするChrome拡張機能を作ろう!

この世で最も早いホームページと言われたら、あなたは何を思い浮かべますか?

そう、 阿部寛のホームページ ですね。

その速さと言えばあの世界最速の男、ボルトも驚くスピード。
ボルトと阿部寛のホームページが新国立競技場で速さを競ったなら、 阿部寛のホームページの完全勝利 と言えるでしょう。

電波の悪い状態でまず見るべきサイトが阿部寛のホームページと言われるほど、通信速度を知るために重要なバロメーターの役割も果たしており、 もはやこの世の中になくてはならないサイトの代名詞 となっています。

そんな人類の生み出した最速のサイト、阿部寛のホームページ。
ひねくれた私は阿部寛のホームページのあまりの速さに嫉妬したので、阿部寛を遅くする方法はないかと試行錯誤することにしました。

そこで思いついたのです。
阿部寛のホームページのあまりの速さを抑えることはできなくても、 遅くなっているように見せればいいのでは?

では阿部寛のホームページを遅くするにはどうすればいいのでしょうか?
ページスピードの遅いサイトというのは画像の表示に時間がかかります。つまり、画像が遅く表示されている状態を作り出せば

JavaScriptベースの動画編集サービスを作ってます

# はじめに
JavaScriptベースの動画編集サービス・[Double TONE – https://doubletone.jp](https://doubletone.jp)を作っています。2021年10月時点では限定公開ですが、近々ベータ版として一般公開する予定です。

![doubletone_screenshot_20211019174545.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2187642/737c4cd0-6253-07ac-6623-ff0728cee480.png “Double TONE”)
イメージはこんな感じです。Qiitaでは、このサービスの開発ブログ的なことを書いていこうと思います。

# 自己紹介
趣味でコーディングをしているKumagaiです。
本職ではプログラミングすることはあまりなく、Excel職人・PowerPointer職人になってます。
保護猫5匹と楽しく生活してます。
![cats.png](https://qiita-image-store.s

M1 Mac で nコマンドが invalid version になる

# はじめに

完全な備忘録です。

## 事象

M1 Mac で Node のバージョン切り替えコマンド `n` を使って、新しいバージョンをインストールしようとすると以下のようなエラーが出る。

“`sh
n 16.13.0

install : node-v16.13.0

Error: invalid version 16.13.0
“`

`n list` で確認すると、16.13.0は存在している。

## 解決策

[ここ](https://github.com/tj/n/issues/641)にIssueが上がっていた。

M1 Mac では、`–arch x64` が必要なようだ。

“`sh
n –arch x64 16.13.0

install : node-v16.13.0
mkdir : /usr/local/n/versions/node/16.13.0
fetch : https://nodejs.org/dist/v16.13.0/node-v16.13.0-darwin-x64.tar.

obnizを楽器化してみたかった。。

皆さんこんにちは、khara_xedgeです。

今回、「obniz board 1Y」というデバイスを入手しました!
「obniz board 1Y」とは、wifiで簡単にインターネットへ接続することができるマイクロコンピュータです。各種センサ接続用の端子を持ち、センサから様々な情報を取得しながら動作するシステムの作成など、IoT工作が手軽に始められます。

そんな「obniz board 1Y」を使って、楽器もどきを作ってみたいと思います。

#環境

今回実装した時の環境は以下の通りです。

◆実行環境
・Node.js 16.10.0

◆パッケージ
・npm 7.24.0

◆コーディング
・Visual Studio Code 1.61.0

◆ハード部品
・obniz board 1Y
・IC温度センサ
・圧電スピーカー
・LED照明(赤)

#演奏スタート!!
いきなりですが、実行結果から!

#ソースコード

動画で実行したコードは以下の通りです。

Node.js Expressのerror handlingはmiddlewareで

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

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

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

心が疲れたので、可愛いものをBGM付きで右往左往させた

https://twitter.com/nnmshita/status/1453598678757769219

# とにもかくにも癒されたい
お仕事に、お勉強に、みなさん本当にお疲れ様です。2021年も残すところあと2ヶ月。
とにかく**可愛いものを見て癒されたい。**
そう思って手を動かした結果、とても可愛いものが出来たので報告させていただく。
我々が右往左往しても全く可愛くないが、**可愛いものが右往左往する姿はとても可愛い。**

# 材料
Visual Studio Code 1.61.0
Node.js 7.24.0

* obniz Board 1Y
* 超音波測距センサ
* サーボモータ
* スピーカー
* 右往左往させたいもの(今回の主役)

各パーツ
![image_50434049.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2122226/a7b883ce-472d-6661-b7d4-cd6419c0e545.jpeg)

右往左往させたいもの。(可愛い)
シルバニアの赤

Node.jsでJavaScriptによるレンダリングブロックを検証する

# はじめに
本記事では、ブラウザレンダリングについての説明は割愛します。
ブラウザレンダリングについての説明が必要な方は、
こちらの記事でわかりやすく説明されていたのでご覧ください。

https://zenn.dev/ak/articles/c28fa3a9ba7edb

また、この記事ではレンダリングブロックの中でも、JavaScriptによるものをご紹介します。

# レンダリングブロックとは
ブラウザレンダリングにおいて、レンダリングを遅延させてしまうことを指します。
レンダリングブロックの要因としては、以下が挙げられます。

1. JavaScriptによるもの
1. CSSによるもの

いずれも、外部リソースの読み込みによる遅延が大きな原因になります。

“`html:外部リソース読み込みの例

“`

# Node.jsでレンダリン

LIFE WILL Emodiversity APIのemotion_mapを使ってみたメモ

# これはなに
LIFULLさんから出ている年月から地域の感情を分析結果を取得するAPIのメモです。

※[emotion_analyzeについてのメモはこちら](https://qiita.com/wakasamasao/items/4cafcd75cfa2b8a821d0)

どんなものかのデモはこちらで体験できます。
https://lab.lifull.com/lifewill/emodiversity/map/

tokenの申請は以下のページを見てください。
https://lab.lifull.com/lifewill/emodiversity/api-docs/index.html

今回利用するemotion_mapのドキュメントはこちら
https://lab.lifull.com/lifewill/emodiversity/api-docs/reference/emotion_map.html

# APIの呼び方
## Node.js
“`
const request = require(“request”);
request.post({
url: