f@ctor

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

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

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
“`
#### 重要

元記事を表示

node.jsについて色々

httpモジュールについて

ここでは勉強のメモとして、httpモジュールの使用法について簡単にまとめてみた。


const http = require("http");

//サーバーを立てる。
http.createServer((req,res) => {
  //req ブラウザーからの値を受け取る。
  //res ブラウザーにレンダリング内容を表示。
  res.wirte("hello world"); //writeは複数回使用可。
  res.end(); //ブラウザーに表示する内容がなくなったらendを使用する。
}).listen(3000,() => {
  //サーバーの立ったら、この処理が実行。
  console.log("start server");
})

上記のres.write関数についての他の使用法についてもまとめてみた。

//HTMLでも解析できます。



res.writeHead(200,{"Content-Type":"text/html;ch

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

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
```

OTHERカテゴリの最新記事