Node.js関連のことを調べてみた2020年07月31日

herokuでNode.jsを立ち上げるまでの手順

色々と理解できていないことは多いですが、とりあえずherokuで立ち上げられたので手順を記載。
エラーでまくったしいろんなサイト見すぎてもはや何を参考にしたのかわからなくなってます。

# 前提
① Node.js、herokuはインストール済み
② パッケージマネージャーはyarnを仕様
下記の記事を見てyarnにしました
https://qiita.com/qulylean/items/afa2acff6ed963c88798

# yarnのインストール
上記の記事を参考にyarnをインストールします。

# yarnでhttpモジュールのインストール

コマンドプロンプトを立ち上げて今回作成したいフォルダまでディレクトリの移動をします。

“`
フォルダの移動
$ cd フォルダ名

前に戻る
$ cd ..

フォルダの作成
$ mkdir フォルダ名

フォルダを作成して移動
$ mkdir フォルダ名 && cd フォルダ名

ファイルの作成
$ type nul > ファイル名
“`

ディレクトリの移動が完了したら下記のコマンドを実行します。

“`
$ y

【Express】ミドルウェアとは何か

##ミドルウェアとは何か
ミドルウェアとは：サーバーの動作をカスタマイズするもの。
ルーターハンドラが作動する前に何かを行うもの。

・ミドルウェアがない時

“`
新しいリクエスト
↓
通常のルーターハンドラが作動
“`

・ミドルウェアがある時

“`
新しいリクエスト
↓
ミドルウェアが作動！
↓
通常のルーターハンドラが作動
“`

##ミドルウェアの設定

“`javascript

app.use()
“`
を用いて設定する

##ミドルウェアの動作例
・リクエストしているHTTPメソッドと、リクエストを送っているパスをターミナルに表示させる

“`javascript
app.use((req, res, next) => {
console.log(req.method, req.path)　
next() //ミドルウェア機能の終了を明示的に表示
})
“`

・ミドルウェアを使ってアクセスを制限する

GETリクエストを送るとアクセスを拒否され、それ以外だと通常のルーターハンドラが

npmコマンドを使えるようにするまでのまとめ【mac】

macの初期状態ではnpmコマンドを使うことができないので、それを使える状態になるまでを記事にまとめました。
macでnpmコマンドを使えるようにするには、Homebrewのインストール,Nodebrewのインストール,Node.jsのインストールが必要なので、それを順番にインストールしていきます。

#### このページの最後に順番にやっていった場合の各場面での画面のスライドを埋めこんでいますので、解説が分からない場合は、そちらで確認しながらやってみてください！

## Homebrewのインストール
パッケージ管理システムのひとつのHomebrewをインストールします。
(パッケージをmacに最適にインストールしてくれるようにするツールです)

[Homebrew公式](htt

Node.jsとJavascriptの違い、関係について

# はじめに
はじめてNode.jsを学んだ方や使用した方はこう思いませんでした？

**「なんで同じJavaScriptなのに名前が違うの？サーバーサイドで動くJavaScript？使ってるけどいまいちよくわからない…」**

そんな疑問を持った方たちのために簡単に解説していきます。

# 言語・処理系について
そもそもプログラミング言語とは、コンピュータに情報や命令を伝えるための**「文字・記号の集まり及びそのルール」**です。そして、プログラミング言語によって書かれた文字列を処理系によって処理することで、コンピュータに情報を伝達することができます。

日本人は日本語を理解することができますよね？逆に、日本語を知らない外国人は日本語を理解することができません。これは、日本人が頭の中に日本語の処理系を持っているから言語を理解できるのです！

このように言語は、その言語の意味やルールを処理・理解してくれる処理系がないと全く機能しなくなってしまいます。

# プログラミング言語における処理系とは？
日本語や英語などを理解するための処理系はそれぞれの人間の頭脳でした。じゃあ、プログラミング

heroku×node.jsでcorsエラーがなかなか解決しないときに気をつけること

node.js（express）でサーバーサイドを記述し、herokuに上げていたのですが、今まではすんなりと解消できていたcorsのエラーに嵌ってしまったので、記事を書くことにしました。
# 環境
– heroku: 7.42.5
– node.js: 12.16.2
– express: 4.17.1
– cors: 2.8.5

# 基本的な対応方法
今回はサーバーサイドとフロントエンドを異なるレポジトリに書いているため、フロントエンドからfetch等でサーバーサイドのAPIを呼ぶ際には、corsのエラーが生じてしまいます。
>Access to fetch at ‘https://xxx.com’ from origin ‘https://yyy.com’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the req

MERNスタックを学べる動画をまとめてみた（外国語の動画です）

# MERNスタック is 何？
MongoDB, Express, React.js, Node.jsの4つを使った開発環境のアーキテクチャのことです。主に、Webアプリ開発に用いられます。

## MongoDBとは
ドキュメント志向のNo-SQLデータベース。データの保存などに使う。DBは、データベースの意。データがJSON形式みたいな感じなので非常にJavaScriptと相性が良い。

## ExpressJSとは
Node.jsのフレームワーク。Node.jsの機能と一緒に使う事で、バックエンドの構築が出来る。

## ReactJS
単一ページWebアプリのUIを作成するUIコンポーネントを構築出来る。アプリケーションのView部分を担っている。

## NodeJSとは
サーバサイドJavaScriptエンジン のことです。

# MERNスタックの良いところは？
ずばり！！
全部JaveScriptで書けることです！JavaScriptはフロントだけでしか使えへんやろ・・・。と思われがちですが、なんでも行けちゃうんです。もし、HTML,CSS,JavaScriptという

Node.js新規アプリケーション作成時の設定手順

**前提条件**
node.jsがインストールされていること

# 手順
1: 任意の場所に、アプリケーションを格納するフォルダを作成する
・・・今回はデスクトップにnodeフォルダを作成
　

2: コマンドプロンプトにて下記コマンドを入力し、package.jsonを生成する

“`sh:入力
> cd C:\Users\yamapi1012bs\Desktop\node
# ↑ユーザー名

> npm init –yes
# package.jsonがフォルダに生成される
“`

“`sh:
#以下のように出力されればOK
Wrote to C:\Users\yamapi1012bs\Desktop\node\package.json:

{
“name”: “node”,
“version”: “1.0.0”,
“description”: “”,
“main”: “index.js”,
“scripts”: {
“test”: “echo \”Error: no test specified\” && exit

MEVN STACKとは〜Vueでフルスタックに作りたい〜

# MEVN STACKって何？
## MEVN STACKってこういうのだよ
### MEVN STACKとは、

– Mongodb
– Express
– Vue.js
– Node.js

の頭文字を取ったもの。
類似にMEAN STACK（Mongodb,Express,AngularJS,Node.js）もありますね！
Qiitaには、MEANはあったけどMEVNについてはなかったので、これから頑張って書いていきたいと思います。
もし少しでもいいね！と思ったら「Looks Good To Me!」をください。励みになります！

## 構成はこうすればできるよ
それぞれの役割についてです。

[引用画像：https://bezkoder.co

【初学者向け】package.jsonについて調べてみた

業務でnpmライブラリのアップデートを行うにあたって、`package.json`についてちゃんと調べてみたので忘備録としてまとめました。

### まずnpmとは
意味としては大きく2種類あると思います。
①npm.Inc社のサービス
https://www.npmjs.com/
npm.Incという会社が提供している上記のサービスことをnpmといいます。今年3月にGithubに買収された会社ですね。このサービス内に、`Javascript`で書かれたライブラリが豊富に存在しています。ここに存在するライブラリを、次に説明するnpmコマンドを使って操作している訳です。

②パッケージを操作するためのCLI
`Node.js`のライブラリを管理するためのコマンドで、ライブラリを生成したり、npm上のライブラリをローカルにインストールしたりするツールです。

## ライブラリとは
ライブラリを使えば、自分で一からコードを書かなくても簡単に機能を実現することができます。

外部ライブラリは自分のプロジェクトに含めるのではなく、「このプロジェクトはnpmのこのライブラリを使っている」という情報

ラジコンをリッチメニューから遠隔操作する。自動ブレーキ付き

#やったこと
前回作成した[【obniz×LINE Messaging API】音と光を使い侵入防止システムを製作する](https://qiita.com/Toshiki0324/items/6ac09efe6ac6ed0102e6)の時に使用したタッパを乗せて走らせてみました。

#できたもの
LINEのリッチメニューから操作でき、10㎝以内に障害物があると自動で停止します。

obniz×LINEBOTを使用して操作するラジコンを製作しました。自動ブレーキを搭載しています。https://t.co/E6R6lLIpXR#obniz pic.twitter.com/Vbu

【obniz】IoTでSpotifyライフを充実させよう【node.js】

#はじめに
__あなたの人生を変えたWebサービスを教えてください__
と問われたらこの三つを答えます。
メルカリ
Twitter
###__そして[Spotify](https://www.spotify.com/jp/)です。__

#Spotifyとは

スウェーデン発のサブスクリプション型音楽ストリーミングサービスです。
有料会員数1億800万人、配信曲5000万曲以上、無料〜1480円のプランが用意されていています。

ランニングやジムなど運動中のBGMにしたり、近所の肉のハナマサ（髭男率高め）
でかかっていた印象的な曲を調べたり、レコメンドででた曲が良かったのでライブに足を運んだり、学生時代にCDで聴いていた曲を見つけて胸が熱くなったり、
__私の音楽生活を一つ上のステージに連れて行ってくれた素敵なサ

TypeScriptを始めよう ~ すぐにできる実行環境構築 ~

## TypeScriptとは？

**TypeScript**とは、マイクロソフトによって開発された、JavaScripで**型定義**を可能にできるように拡張した言語(**AltJS**)です。

AltJS、つまりJavaScriptの代替言語であり、コンパイル時にJavaScriptに変換されます。そして、互換性を持つスーパーセットであるため、JavaScriptと同様の記法が使えます。そのためJavaScriptの知識があればTypeScriptの学習コストはそこまで高くなく、スムーズに理解することができるでしょう。

また、TypeScriptは**漸進的型付き言語**(gradually typed language)であるので、プログラム内の全ての型を指定する必要はありません。これは既存のJavaScriptコードをTypeScriptに以降する際に非常に役に立ちますが、基本的には全ての型の指定をすることをおすすめします。

## 開発環境を整えよう

TypeScriptを試すために、まず開発環境を最低限整えましょう。

プラウザで手軽に試したい人は、こちらを使ってみ

【初心者でもできる】仕事が忙しくても、赤ちゃんの熱中症の危機にすぐに気づけるIoTをつくった

#はじめに

少し前に、２才のこどもを保育園に送り忘れ、
かつ、車の中に放置してしまい、亡くなってしまう
痛ましい事件が起きました。

本当に悲しい出来事であり、あってはならないことですが、
人ごとではないような気がしました。

何かに集中してしまって、
つい何かやるべきことが抜け落ちてしまうことはある人も多いのではないでしょうか。

今回は、それと類似のシーンとして、
「仕事が忙しく、赤ちゃんの部屋が高温になっていることに気づけなかった」ということがないように、高温になればアラートが出て、気づける仕組みをIoTを使って、できないかとチャレンジしました。

#作りたいイメージ

温度センサーによって、常に部屋の温度を監視し、
赤ちゃんにとって快適な温度（26-28度らしい）から外れた時に、
自動でLINEに通知がくるもの。

さらに、LINEの通知に気づかない可能性があるので、
音やLEDの光でアラートを出す。

その２つの仕組みがあれば、仕事に集中していても気づくことができ、
すぐにエアコンをつけにいくことができるはずです。

#実際につくった仕組み

自動でLINEに通知

【JavaScript】ライブラリ化しておく便利な3つの自作共通関数を記録

## 前提
– *※記載の共通関数は、各環境によって動作しない場合がある。
→ES2015からES2019で利用できるメソッドも利用しているため*

## 1. chunk
– **指定の数に応じて、対象配列を分割する関数**

### コード

“`javascript:lib.js
const chunk = (arr = [], size = 3) => {
return Array.from({
length: Math.ceil(arr.length / size)
}, (v, k) => arr.slice(k * size, k * size + size))
}
“`

### 使い方

“`javascript:index.js
import { chunk } from ‘./lib.js’

// 対象配列定義
const target = [1,2,3,4,5,6];

// 利用 : chunk(対象配列, 分割サイズ)
console.log(chunk(target,2));
console.log(chunk(target,4));

dreddで認証付きのAPIをテストする

しばらく書いてなかったけどメモ程度に

# dreddとは

[dredd](https://dredd.org/en/latest/index.html)は[openapi(swagger)](https://swagger.io/)や[API Blueprint](https://apiblueprint.org/)の定義を読み込んでテストを実行してくれる便利なツールです。
例えば `localhost:8080` でAPIサーバを動かして

“`sh
dredd openapi/schema.yaml http://localhost:8080/v1/
“`

のようにすればschema.yamlに定義されたAPIの定義に従ってリクエストを送り、レスポンスが仕様に従っているかテストしてくれます。

が、ログインしてtokenを貰ってそのtokenでアクセスするというようなAPIはそのままではテストできません。
[hooks](https://dredd.org/en/latest/hooks/index.html)という仕組みを使うと、レスポンスからtokenを取得して以後は

【初心者向け】Node.jsとは?を初心者ながらまとめてみた

# 1.はじめに

最近Node.jsを使って開発を始めました。

ただ、現状「とりあえず触ってみている状態」なので、今回はNode.jsとはそもそもなんたるものかということと特徴について勉強し、自分なりの解釈でアウトプットしてみます。

# 2.Node.jsとは

Node.jsの[公式サイト](https://nodejs.org/ja/about/)によると _*非同期型のイベント駆動の JavaScript 環境*_ と書かれています。
「非同期」と「イベント駆動型」と「JavaScript 環境」を一つずつ噛み砕いていきます。

## 2.1. 非同期型とは

非同期型とは、非同期処理が実行可能な環境であることを指しています。
非同期処理とは、「ある処理を実行している間に別の処理を実行できる方式」のことです。(もちろん同期処理もできます)

言葉だけではイメージが掴みづらいので、以下図示(図2.1.1)してみました。
左側が同期処理、右側が非同期処理のイメージです。
ご覧の通り、同期処理では、処理Bが実行している間は処理Aが停止して、処理Bが終わると処理Aが再開されます

Lambda(node.js)とJavaScriptのタイムゾーン

Lambda(node.js)で日付の計算をしたら思ったより面倒だったのでまとめる。

# やりたかったこと

日本標準時(JST)で先週/先月の範囲を、世界標準時(UTC)で取得したい。
例えば、今日が 2020-07-29 とすると先週の範囲は日曜日始まりでこんな感じ。

| タイムゾーン | 開始 | 終了 |
|:-:|:–|:–|
| JST | 2020-07-19T00:00:00+0900 | 2020-07-26T00:00:00+0900 |
| UTC | 2020-07-18T15:00:00Z | 2020-07-25T15:00:00Z |

# やりたくなかったこと

大した処理じゃないので余計なライブラリは使いたくない。

# 結論

– タイムゾーンの設定はそのままにプログラム内で対応する
– タイムゾーンオフセット値からJSTを自力で設定する
– UTCへの変換も自力でやる

# それぞれのタイムゾーン

## Lambdaのタイムゾーン

UTCに固定されている模様。

ググるとTZ環境変数を設定すればいいという記事が大量にヒットする。
ただ、

Node 12 以降の環境で Gulp 3系を動かす

Gulp 3系がサポートされなくなってから結構たちましたが、3系環境の案件を保守する事例はまだ少なくないです。ただ、 Node 12 以降では正常に動作しないので、ほとんどの場合エラーになるかと思います。
なので単純にマシンに Node 11 を入れ直せば一応は動くんですが、代わりに最近の NPM が動かなくなってしまいます。（案件ごとに Node を都度入れ直さないといけない感じになってしまいます。）

## バージョンを切り替えられるようにする

Node を都度入れ直すのはかなり手間だし複数案件やってるとき作業止まってしまうので、自分は Node バージョンを切り替える様にしています。ちなみに以前は [n](https://www.npmjs.com/package/n) を使用していたんですが、Catarina から $PATH env がおかしくなって Node 自体が使い物にならなくなりました。
※ `/usr/local/bin/n` のシンボリックリンクと、 `/usr/local/lib/node_modules/n/bin/n` を削除して対処するはめになりました。

Node.jsのDockerイメージのマルチコア対応をがんばってみた

いろいろ頑張ってみたものの、Docker本家とかその他の情報によると、Dockerfile内部でマルチコア対応は頑張らない方が良いらしい。せっかくがんばったので供養のためにまとめておきます。

* [DockerでNode.jsアプリをイイ感じに保つ4つの方法 #docker](https://www.creationline.com/lab/29422)
* [nodejs.org: Dockerizing a Node.js web app](https://nodejs.org/en/docs/guides/nodejs-docker-webapp/)
* [Docker and Node.js Best Practices](https://github.com/nodejs/docker-node/blob/master/docs/BestPractices.md#cmd)

# マルチコア対応したい！

Node.jsはシングルコアで動くのでマルチコア対応したいですよね？コア数が生かせないのはかっこ悪いですよね？サーバーにそのままデプロイする場合はpm2とかのプロセスマネー

【はじめてのIoT】サイリウムを自動的に光らせてみた【ラブライブ】

#はじめに
　「推しが複数いるとき、どの色にすればいいか悩む・・・」
　「サイリウムで盛り上げたいけど、もっとライブに集中したい」
　「夢中になりすぎて、サイリウムの色を変えるのを忘れてしまう」

ライブに行った時、このように思ったことはありませんか？
__私はあります。__

私はラブライバーなのですが、箱推し（みんな好き）です。
なので全色光らせたいけど、持つのは２本が限界だし・・・
「次はオレンジだ！」とか考えてるとライブに集中できなかったり・・・

ということで、今回は__自動的に光るサイリウム__を作ってみました！

#理想イメージ
ライブと言っても、今はコロナの影響もあって、無観客ライブが増えてきました。
今回もYoutubeのライブをイメージして、曲が始まるとサイリウムが自動的に光ることをゴールにします！
[](https://gyazo.com/d5111f46d64d7f1ff2613dfa29822187)
Y