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

HerokuでNode.js(Express)で書いたHello worldプログラムを実行したい！

サーバ上でWEBアプリ動かしてみようかな！できればMySQLとかのDBとも連携もしたい！
と思ったのでそれらを使えるサーバにデプロイする事にしました。

AmazonのAWSも無料で使えるので検討しましたが、無料期間が限定(12か月)されているのと利用できるサーバ時間の長さでまずはHerokuを使ってみる事に。

# 結論
__Heroku？なにそれおいしいの？状態からでも結構簡単にWEBアプリをデプロイできました。__
実際に手を動かす時間よりは調べている時間の方が長かったかも。

##### 環境
Win10+VSC@1.68
Node.js@16.14.2+Express@4.18.1

##### やろうとしたこと
– Herokuサービス上でNode.js(Express)プログラムを動かす
## やったこと
まずは小さな小さな成功体験から。

Herokuに登録します。超簡単成功体験。
日本語でしっかり書かれているのは嬉しいです。

https://jp.heroku.com/

Herokuとは何か？については端折ります。
ざっくり言うとWEBアプリを動かせるサーバ環境を

GraphAPIを使ってファイルをダウンロードする（Node.js）

`@microsoft/microsoft-graph-client`を使ってファイルをダウンロードするときにめんどくさかったのでメモ。

https://docs.microsoft.com/ja-jp/graph/api/driveitem-get-content?view=graph-rest-1.0&tabs=http

“`js
const fs = require(‘fs’).promises;
const Blob = require(‘cross-blob’);
const zlib = require(‘zlib’);
const { PassThrough } = require(‘stream’);

async main () => {
/**
* 大きいファイル、小さいファイル、テキストファイルなど、ファイルの種類によって返ってくるクラスが変わる
* @type {PassThrough|Blob|zlib.Gunzip}
*/
const content = await client.api(‘/drives/{drive-id

Node.jsで組んだプログラムにcurlコマンドでJSONデータをPOSTしようとしてハマった

Node.js(Express)で組んだプログラムにcurlを使ってJSONデータをPOSTしようとしました。
結果どハマりしたのでメモ。

# 結論
解決してない。なんたる出オチ。
もし同じようにハマってる人がいたら俺の屍を越えてゆけ・・・！
僕は他の方法でJSONデータをPOSTする事にしました。

##### 環境
Win10+VSC@1.68+Node.js@16.14.2+Express@4.18.1
VSCのターミナルはPowerShell使用

##### やろうとしたこと
– expressで書いたプログラムにJSONデータをPOSTしてJSONデータを返す
– VSCのターミナルからcurlコマンドでJSONデータをPOST

## やったこと
さっくりExpressの公式ドキュメントを参考にPOSTデータを受け取るプログラムを書きます。
POSTして、プログラム側で受け取ったデータの中身はreq.bodyに入っている模様。
なので公式ドキュメントのreq.bodyについての項目を参照。

http://expressjs.com/ja/api.html#req.bo

【Windows10】Please update your version of Node.と言われたとき

#### Windows10でPlease update your version of Node.と言われたとき、つまづいたので備忘録

現象
“`
npx create-react-app . –template typescript
npx: 67個のパッケージを14.129秒でインストールしました。
You are running Node 12.18.1.
Create React App requires Node 14 or higher.
Please update your version of Node.
“`

検索すると、下記を実行するように記載されているが、Windowsだとエラーになる。
“`
npm cache clean -f
npm install -g n

npm ERR! code EBADPLATFORM
npm ERR! notsup Unsupported platform for n@8.2.0: wanted {“os”:”!win32″,”arch”:”any”} (current: {“os”:”win32″,”arch”

今更ながらGithub Actionsを用いてRSSフィードを自動取得・メール送信を実現する

# 何をするか
– Javascript(Node.js)でRSSフィードを取得する。
– その後SendgridのAPIを使用して、取得したRSSフィードの一覧をメールで送信する。
– 上記のコードをGithub Actionsで1日1回実行し、自動取得・自動メール送信を実現する。

メモ程度に書き殴るので情報量は少なめ..御了承を

:::note Nodemailerを使う方法を考えたが断念
ちなみにメール送信はGmailで[Nodemailer](https://nodemailer.com/about/)をはじめは使用していたが、Gmail側の[セキュリティ設定](https://nodemailer.com/usage/using-gmail/)ではローカルではうまく動くもののGithub Actions上ではうまくいかない([OAuth2](https://nodemailer.com/smtp/oauth2/)を設定すればうまくいく？かもしれないが今回は手軽にしたかった)ため断念
:::

# 開発環境
– macOS :Monterey12.4 (M1)
–

【HTML & CSS　2日目】Progate　～9/15

2/90日目の作業　7/100h　
3/90日目の予定　6h

無料コースが終わってしまった・・・
他のサイト探すか有料版登録するか。
6hくらいやったけどHTML & CSSはかなり楽しい。
早速今の知識でどっかでサイト作ろう。

Node.js から MongoDB Atlas の基本操作を行う

## ■ はじめに

Node.jsからMongoDB Atlasの基本操作ができるようになることが目標です。

※MongoDB Atlasは MongoDB社が提供しているクラウド上のMongoDB環境です。\
※MongoDB Atlasを利用するには利用登録が必要ですが、このドキュメントでは解説しません。

## ■ 環境

MongoDB Atlas version 5.0.8

Node.js v16.15.0

mongodb（ドライバ） 4.6.0

## ■ 目標

– クラウド上のMongoDBに接続できるようになる
– MongoDBからデータを取得できるようになる
– MongoDBにデータを追加できるようになる
– MongoDBのデータを変更できるようになる
– MongoDBからデータを削除できるようになる

## ■ 準備
` npm install mongodb `

## ■ 接続

“`js
const { MongoClient, ServerApiVersion, MongoCursorInUseError } = require(‘mo

【HTML & CSS　1日目】Progateで練習開始

https://prog-8.com/paths/node

コピペしかしていなかったHTML & CSSを20年ぶりに触った。

これを続けていればよかったな～という大きな後悔をしつつ、これから海外移住目指す身として
0から始めるプログラミング練習日誌をここでつけていく。

本当はjavaやらないといけないんだけど記憶の片隅にあるHTMLから始める。
yahooジオシティーズとCOOL ONLINEがなくなったのが痛いけど、
一通り学んだらFc2でサイト作ってみよう。

しかしHTML & CSSは稼げるのか？？？
時給見てるけどかなり安い・・・

完全在宅で働きたいからとりあえず3か月は真面目に学習する。
1か月に100時間やる予定。

明日は10時間くらいやろう。
無職ってお金入ってこなくて悲しいけど時間があるのは本当に良いな。

今のところ無料で練習する予定だけどprogateって有料にしたほうが良いのかな？?

1/90日目の作業　1/100h　li,font-family,
2/90日目の予定　8:00-17:30(9h)

express-generatorで作成したexpressプロジェクトをTypeScript化する その2(フロント側)

こんにちは、katです。
前回の続編になります。

https://qiita.com/katkatprog/items/0205f55377896faace5c

前回、express-generatorで作成したプロジェクトのサーバーサイド部分をTypeScript化する方法を紹介したのですが、
その記事ではフロントエンド部分(ブラウザ側JavaScript)のTypeScript化はしておらず、完全なTypeScript化とは呼べない状況でした。

そこで今回、フロント側にもTypeScriptを導入し、なんとか全体をTypeScript化できました。
同時に、フロント側にWebpackも導入し、ブラウザ側では1つのJavaScriptファイルのみを読み込むようにできました。
(フロント側で複数のjsファイルを用いている場合、IEブラウザではESモジュールが使用できない等、ブラウザ間で何かと差異がある。→Webpackを用いて1ファイルにしてしまえば解決)

それらについて、今回学んだ事項を紹介したく、記事を作成しました。
Githubリポジトリ(今回の作業終了時コミット)は[こ

PostgresのドライバーをインストールしたらYarn(NPM) install ができなくなった時の対処法

Windows10にPostgresのドライバーをインストールしたら`yarn install`ができなくなった。

システム環境変数 `OPENSSL_CONF`を削除し再起動したら直った。

nvmのデフォルトをltsに変える

いつも忘れてしまうのでメモ。
# For LTS(長期サポート版)
“`shell:デフォルトをltsにする
nvm alias default lts/*
“`
ついでによく使うコマンドを載せておきます。
“`shell:ltsの最新版をインストールする
nvm install lts/*
“`
“`shell:最新のltsを使う
nvm use lts/*
“`

# For Stable(安定版)
“`shell:デフォルトをstableにする
nvm alias default stable
“`
ついでに
“`shell:stabeをインストールする
nvm install stable
“`
“`shell:stableをインストールする
nvm use stable
“`

macOS に nodenv を導入する手順

# 概要
macOS に nodenv を導入する流時の備忘録
および、よく使うコマンド一覧

# nodenv とは
nodenv とは、Node.js のバージョン管理ツールです。
プロジェクトごとに任意の Node.js のバージョンを指定する必要がある場合に、ローカル環境（自分のPC）の Node.js のバージョンを変えるのはとても手間なのでそういったケースで活躍するツールです。

# 導入方法

### インストール

今回は、Homebrew でインストール

“`bash
# インストールコマンド
brew install nodenv
“`

数分と経たずに完了します。

### 動作確認
ちゃんと入ったか、テキトーなコマンドを実行して確認

“`bash
# バージョン確認
nodenv -v

# 実行結果
nodenv 1.4.0
“`

# よく使うコマンド一覧

### バージョン設定の適用
nodenv で Node.js を新たにインストールしたり、`npm install -g` で新たにパッケージを導入したりした後には、
それを nodenv

Node.jsをHerokuにデプロイしたらエラーが発生した

こんにちは、今回はNode.jsをHerokuにあげたらエラーが大量発生したのでその解決法を記録しておきたいと思います。

## ■今回対処したエラー
最初に私が直面したエラーを説明しておきます。
とにかくHerokuと私のNode.jsの設定が異なっていたことが原因でした。
①npmとnodeのバージョン
②ビルドコマンド
③startのコマンド
④環境変数を設定していなかった

“`plaintext:発生したエラー
! [remote rejected] main -> main (pre-receive hook declined)
error: failed to push some refs to ‘gitのURL…’
“`

## ■環境
・Windows
・Node.js: 14.x
・npm: 6.x

(下記はあまり関係ないけれど)
・Express
・nodemon
・Mongo DB
・mongoose

## ■Node.jsをデプロイする方法
エラーの解説の前に、一旦デプロイ方法です。
もう出来ている方は右下の目次からエラーのところまですっ飛ばして下さ

blastengineのNode.js SDKを使って添付ファイル付きメールを送信する

blastengine（ブラストエンジン）はシンプルに使える開発者向けメールサービスを提供しています。何かと面倒なメール配信をシンプルに、かつ確実に送信先に届くようになります。

現在、Node.js向けに、blastengine SDKを開発しています。この記事では、その使い方を解説します。まずはテキストメールの即時送信についてです。

[blastengine – npm](https://www.npmjs.com/package/blastengine)

## ユーザ登録する

blastengineにユーザ登録します。管理画面に入るためのユーザID、パスワードが手に入るので、ログインします（ユーザIDは後で使います）。


## 送信元ドメインのSPFを設定する

送信元として利用するドメイン（自分で持ってい

blastengineのNode.js SDKを使ってメール送信を行う

blastengine（ブラストエンジン）はシンプルに使える開発者向けメールサービスを提供しています。何かと面倒なメール配信をシンプルに、かつ確実に送信先に届くようになります。

現在、Node.js向けに、blastengine SDKを開発しています。この記事では、その使い方を解説します。まずはテキストメールの即時送信についてです。

[blastengine – npm](https://www.npmjs.com/package/blastengine)

## ユーザ登録する

blastengineにユーザ登録します。管理画面に入るためのユーザID、パスワードが手に入るので、ログインします（ユーザIDは後で使います）。


## 送信元ドメインのSPFを設定する

送信元として利用するドメイン（自分で持ってい

blastengineのNode.js SDKを使ってメールを一斉配信する

blastengineは開発者にとって使いやすいメール配信サービスを提供しています。まだサービスローンチしたばかりでSDKが不足しているのですが、徐々に開発を進めています。

まず最初にNode.js向けにSDK開発を進めていますが、一斉配信に対応しましたので、その使い方を紹介します。

[blastengine – npm](https://www.npmjs.com/package/blastengine)

## ユーザ登録する

blastengineにユーザ登録します。管理画面に入るためのユーザID、パスワードが手に入るので、ログインします（ユーザIDは後で使います）。


## 送信元ドメインのSPFを設定する

送信元として利用するドメイン（自分で持っているもの）の設定をします。これは任意のドメイン管理サー

【Node】NVMによるバージョンアップ

# 指令：Nodeのバージョンをupgradeしろ！

“`sh
You are using Node v10.19.0, but this version of @vue/cli requires Node ^12.0.0 || >= 14.0.0.
Please upgrade your Node version.
“`
りょうかいです！

## 現在インストールできるNode.jsのバージョン一覧を確認

“`sh
$ nvm ls-remote
　　　　～省略～
v16.12.0
v16.13.0 (LTS: Gallium)
v16.13.1 (LTS: Gallium)
v16.13.2 (LTS: Gallium)
v16.14.0 (LTS: Gallium)
v16.14.1 (LTS: Gallium)
v16.14.2 (LTS: Gallium)
v16.15.0 (LTS: Gallium)
v16.1

Vue.jsの開発メモ#1

# 今日のメモ
– homebrew, nodebrew, node.js のアップデート
– Githubで remote repogitoryの作成
– Terminalでvue-cliのインストール (npm install -g @vue/cli)
– vue create ファイル名
– vue-class-component, vue-property-decoratorとは
– Nuxt.jsについて
– Universal mode(SSR), SPA mode,

# vue-class-componentとは
TypeScript（.tsファイル）でコンポーネントが書けるようになる。
Componentデコレータをつけて，Vueを継承したクラスとして書く

# SSRとは
SSRとは,従来のブラウザ側（クライアント側）で実行されHTMLを描画するJavaScriptをサーバー内部で実行し,HTMLを描画するもの. また、UniversalはSPAでもあるため、ページ遷移などに関しても申し分がなく、爆速.

# Nuxtプロジェクトの立ち上げ

　To create

express-generatorで作成したexpressプロジェクトをTypeScript化する

はじめまして。katと申します。
本記事が初投稿になります。至らない点があるかもしれませんが、何卒ご容赦ください。

今回は、express-generatorで作成したexpressプロジェクトをTypeScript化する方法について、学んだ事項を紹介したいと思います。

工夫した点は以下の3点です。
– views, publicフォルダを使用できる
– 開発用実行として、ts-node-devを使ったホットリロードで実行する
– 本番用実行として、jsファイルに変換した上で実行する

Githubリポジトリ(今回までの作業)は[こちら](https://github.com/katkatprog/expressTs/tree/8f02d79538a39e0663764115da399f09f91fd1e1)です。

## 背景
つい最近、TypeScriptの基礎学習が終わり、何かしらアウトプットをしてみたいと思っておりました。
そこで、自室のラズパイ上で稼働中であるexpress-generatorで作成されたWEBアプリをTypeScript化してみることにしました。

その

Node-RED インストール

## 環境
Ubuntu

## Node.js
“`
curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash –
sudo apt-get install -y nodejs
“`
※16.xは2022年6月時点の推奨バージョンです。18.xで開発バージョンがインストールされます。
## Node-RED
“`
$ sudo npm install -g –unsafe-perm node-red
“`