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

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

【感想】Vue.js & FirebaseでTwitterライクなSNSアプリを作ろう

## はじめに

– 今回、私が学習に使用した教材はこちらです。教材提供サイトはこちら[Techpit](https://www.techpit.jp/)です。

– [Vue.js & FirebaseでTwitterライクなSNSアプリを作ろう](https://www.techpit.jp/p/vue-js-firebase-twitter-like)

※有料です。

## 開発環境

– Vue.js

– Node.js

– Firebase

## 今回作ったもの
– Twitterのようにユーザーが投稿できるSNSのようなものを実装しました。
![SNS.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/594117/d525de81-699b-45d7-f548-d2516ad62a99.png)

– 教材の通りにデプロイまで完了しています。

## 感想
– Googleアカウントでのサインイン
– 投稿の新規作成、リスト表示、更新、削除です。

上記の2点が機能として今回この教材で

元記事を表示

FirebaseからGoogleSpreadSheetに書き込みをし、その更新をメール通知する

#はじめに
当記事は、FirebaseのCloudFunctionからGoogleSpreadSheetにFirestoreへ新規追加されたデータ内容の書き込みをし、その更新をメール通知する実装についての備忘録です。

CloudFunctionの導入は省略しますが、宜しければ[こちら](https://qiita.com/shotashimura/items/32f71b41ac78745fb82d)を参考にしてください。

##FirebaseからGoogeleSpreadSheetに書き込みを行う

大まかな手順
・FIrebaseの設定
・GoogeleSpreadSheet APIの取得
・CloudFunctionの実行

###FIrebaseの設定
FirebaseからGoogleSpreadSheetに書き込みを許可するために、
幾つかデフォルトの設定から変更をする必要があります。

①Firebaseコンソールから「プロジェクトの設定」(歯車のボタン)をクリック

②「サービスアカウント」のタブをクリック

③その他のサービスアカウントの項にある、Googleサービ

元記事を表示

SemanticSegmentationを行うnpmパッケージを作ったので使い方を説明してみる

### はじめに
先日、大きな画像を分割してsemantic segmentationを行うnpm パッケージを作成したので、使い方の説明を兼ねてデモの作り方を説明してみます。

このパッケージは、スマホなどの性能の限られたデバイス上で精度と応答速度のトレードオフを調整しながらSemanticSegmentationするためのものです。
今回のデモとしては、このようなものを作ります。バーコードを検出してセグメンテーションを行います。

![https___qiita-image-store.s3.ap-northeast-1.amazonaws.com_0_365991_425fef2a-7eef-9bc4-21e0-3960a4c8154e.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/365991/9b749fde-e439-d835-4245-f6e7b404f146.gif)

前回のnpmパッケージを作成した際の投稿はこちらです。
https://qiita.com/wok/items/a64

元記事を表示

HTMLのタイトルを取得する [Node.js, シェルスクリプト]

httpリクエストでHTMLのページを取得して正規表現でタイトルを引っ張り出します。Node.jsを使う方法とシェルスクリプト(Bash)を使う方法で出来たので書き残しておきます。

ちなみに、Node.jsもシェルスクリプトも初心者です。

環境
Mac OS 10.14.6

## Node.js

[Node.js](https://nodejs.org/ja/)からダウンロードします。

“`
$ node -v
v12.18.1
“`

### requestモジュール

Node.js標準でもHTTPリクエストできるそうですがrequestモジュールを使うと楽、らしい。[](https://www.npmjs.com/package/request)

“`
$ npm install request
“`

これはできるだけ上位のディレクトリでやったほうがいい。インストールしたところ以下で`request`が使えるがそれより上のディレクトリでは使えない。(個人的な実験の結果)([npmについてのまとめ – Qiita](https://qiita.com/riho

元記事を表示

AWS Lambda Nodejsのバージョンが8から12に強制アップデートされたら Error: Cannot find module ‘jmespath’ と出る問題

# 要約
AWS Lambdaで利用するnodejsのバージョンが nodejs8 -> nodejs10以降のアップデートすると aws-sdkが組みこまれるようになるため
node_modulesにaws-sdkを含んでいるとエラーになるので、取り除く必要がある

# 本文

nodejs8で書かれたAWS Lambdaスクリプトは非推奨となりました。
AWS Lambdaのnodejs10やnodejs12環境で同じスクリプトを実行すると、以下のようなエラーメッセージが表示される。

“`
{“errorType”:”Runtime.ImportModuleError”,”errorMessage”:”Error: Cannot find module ‘jmespath'”,”stack”:[“Runtime.ImportModuleError: Error: Cannot find module ‘jmespath'”,” at _loadUserApp (/var/runtime/UserFunction.js:100:13)”,” at Object.mod

元記事を表示

【JWT(JSON Web Token)】Node.jsで実際に使ってみた(公開鍵・秘密鍵方式)

# はじめに

以前、JWTをNode.jsで使ってみる記事([コチラ](https://qiita.com/sa9ra4ma/items/67edf18067eb64a0bf40))を書きましたが、これは共通鍵暗号化方式を使用したものでした。
今回は公開鍵・秘密鍵暗号化方式を使用した場合のサンプルを作成したので、紹介したいと思います。

JWTとは何かをまだ理解していない方は以下の記事から読んでみてください。

– [【JWT(JSON Web Token)】Node.jsで実際に使ってみた](https://qiita.com/sa9ra4ma/items/67edf18067eb64a0bf40)

# 実際に使ってみた
JWTの説明は以前まとめたので、いきなり使ってみようと思います。

# ソースの説明

ソース全部貼っておきます。

“`javascript
// ➀
const express = require(“express”);
const jwt = require(“jsonwebtoken”);

const PORT = 3000;

const app

元記事を表示

async/awaitを使った非同期処理

##async/awaitとは
Promiseをベースにした非同期のコードを簡単に処理するメソッド

##asyncを使った時、使わない時
asyncを使うと、返り値をPromiseを使って表示させることになる。

・asyncを使わない時

“`javascript
const doWork = () => { }
console.log(doWork())
“`

「undefined」が返ってくる
(まだdoWork関数は何も定義されていないため)

・asyncを使った時

“`javascript
//asyncを用いて実装
const doWork = async() => {}
console.log(doWork())
“`

「Promise{undefined}」が返ってくる

★asyncは常にPromiseを返す!!!
asyncを使うメリット

→「.then()」「.catch()」を用いて、成功時、失敗時の次の処理を記述することができる。

“`javascript
const doWork = async

元記事を表示

webworkerを含むnpmパッケージの作り方(仮)

### はじめに
先日、Virtual背景のnpmパッケージを作成しました。これは自分史上初めてのnpmパッケージ作成でした。
今度は、以前作成したマルチバーコードリーダのバーコード検出部位(SemanticSegmentation)をパッケージ化してみることにします。

このバーコード検出部位はwebworkerを用いて作っていたのですが、いろいろ検索してもwebworkerを用いたパッケージの作成方法がわからない。試行錯誤で作ってとりあえず動くところまで行ったので、その内容を備忘録も兼ねて記載します。
なお、試行錯誤の末動かしたので、正式なやり方になっているかは結構不安です。もし変なところがあれば是非ともご指摘のほどお願いします。

なお、今回パッケージ化するものは、大きな画像を分割してセマンティックセグメンテーションを行うもので、分割数をパラメータ化することで、精度と速度のトレードオフを可能にするものです。スマホなどの性能が限定されているデバイス上で使うと効果的かなと考えています。

挙動はこんな感じです。画面を分割するとSegmentationの精度が上がるが、速度が下がるとい

元記事を表示

sequelizeを利用したコードのtypescript化

# 背景

今回は、前回書いたsequelizeのコードのtypescript化を試してみます。
https://qiita.com/yusuke-ka/items/448843020c0406363ba5#sequelize%E3%81%A7%E5%AE%9F%E8%A3%85

上記で作成したプロジェクト「sequelize」を直接変更してtypescriptのコードにしてみようと思います。

# typescriptへの変更

typescriptおよびexpressの型とts-node(typescriptのコードを直接実行できる)をインストール。

“`
> yarn add -D typescript @types/node @types/express ts-node
“`

package.jsonにscriptを追加してtsc(typescript)とts-nodeが簡単に実行できるようにしておく。

“`package.json

“scripts”: {
“sequelize”: “sequelize”,
“tsc”: “tsc”,
“d

元記事を表示

Node.js を動かす Dockerfile のサンプル

## 概要

– Node.js アプリケーションのシンプルなサンプルを作成する
– Node.js を動かす Dockerfile を作成する
– Dockerfile から Docker イメージを作成する
– Docker イメージから Docker コンテナを作成する
– Docker コンテナを起動する

## 今回の環境

– macOS Catalina
– Docker Desktop Community 2.3.0.3
– Node.js v14.4.0

docker コマンドは Docker Desktop に付属のものを使う。

“`
$ docker –version
Docker version 19.03.8, build afacb8b

$ which docker
/usr/local/bin/docker

$ ls -l /usr/local/bin/docker
lrwxr-xr-x 1 root admin 54 5 24 23:06 /usr/local/bin/docker -> /Applications/Docker.a

元記事を表示

【Node.js v11】ディレクトリ内のファイルパスを再帰的に取得するワンライナー

ディレクトリ内全てのファイル一覧を取得するというありふれた処理ですがたまたまワンライナーを思いついたのでメモ代わりに紹介します
同期メソッドなので使いどころには注意してください

## JavaScript

“`javascript
const fs = require(‘fs’)

const listFiles = (dir) =>
fs.readdirSync(dir, { withFileTypes: true }).flatMap(dirent =>
dirent.isFile() ? [`${dir}/${dirent.name}`] : listFiles(`${dir}/${dirent.name}`)
)

console.log(listFiles(‘hoge/fuga’))
“`

fs.readdirに `withFileTypes: true` オプションが追加されてたんですね、最近知りました
https://nodejs.org/api/fs.html#fs_fs_readdirsync_path_options

`${dir}/${

元記事を表示

virtual背景のロジックのnpmパッケージを使ってデモを作成する話

### はじめに
先日、自分史上初めてnpmのパッケージを作成したので、これを使ったデモの作り方を説明しようと思います。

前回の記事です。
https://qiita.com/wok/items/9025059893a406f4307f

こんな感じのものを作ります。
![movie2.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/365991/8b03b47a-2754-0cea-c341-7373be540680.gif)

なお、今回のパッケージバージョンは1.0.19を想定しています。

### 前準備
今回はReactでデモを作成します。
まずは環境構築をしましょう

“`
create-react-app demo –typescript
“`
### パッケージをインストール
それではvirtual背景のパッケージをインストールします。

“`
npm install local-video-effector
npm install
“`

### 背景画像の準備
virtua

元記事を表示

Deno と Node.js 共通ソースコードで開発する方法

# 概要

それなりにわかる人向けの記事なので各種説明を細かくは書きません。わからない用語は調べてください。

Deno がリリースされていますね。モジュールシステムが Node.js と異なっているためにコード互換性がなくて問題になっている方もおられると思います。

そういう方向けの記事です。

Node.js は CommonJS が標準です。
Deno は ESModules のみ対応です。

CommonJS は「読み込み:require」「書き込み:module.exports」
ESModules は「読み込み:import」「書き込み:exports default等」という構文になります。

Node.js でも package.json に type: module とすると ESModules に対応しますが、そうするとプロジェクト内コードで、Babel や Webpack などの Node.js のエコシステム的なものが(たぶん)使えないので、今回は Node.js は ESModules に対応しません。拡張子 .mjs にして node –experimen

元記事を表示

Goのプロジェクトでもタスクランナーとしてnpmを使う

[Go](https://golang.org/) のタスクランナーとして [npm](https://www.npmjs.com/) を使ってみたら案外よかった。Go に限った話ではないけど、Go が特に開発ツールチェーン周りの管理がしにくいので噛み合いやすいのではないかと思う。

[npm](https://www.npmjs.com/) は [Node.js](https://nodejs.org/ja/) 用のパッケージマネージャだが、[npm-scripts](https://docs.npmjs.com/misc/scripts) という簡易なタスクランナー機能がついている。また、Node.js 用の便利な開発ツールをそのまま利用できて、開発ツールのインストールも一括で管理できる。

## npm をタスクランナーとして使う利点

– Node.js のインストールだけで利用できる
– 簡易なタスクランナーが利用できる
– **Node.js 用の開発ツールが利用できる**
– husky + lint-staged, Prettier, etc
– 開発ツールのイ

元記事を表示

Node.jsからobnizでBME280(気温、湿度、気圧)センサーを動かす

# これまでのおさらい
– [Raspberry piにNode.jsをインストールする](https://qiita.com/takashi53/items/69d4395c70d76ddbb0ab)
– [Node.jsでrequestモジュールを使ってHTTPリクエストを実行する](https://qiita.com/takashi53/items/76c5987b73b76ba9ea96)
– [Node.jsでIFTTTのWebhooksを使う(requestモジュール利用)](https://qiita.com/takashi53/items/7f1679c52edd741c3ed8)

# 今回のお話
– Raspberry Piで、Node.jsからobnizを利用する。
– obnizでBME280センサーを動かす。
– BME280センサーで気温、湿度、気圧のデータを取得したら、IFTTTを使って、Google スプレッドシートにデータを書き込む。

順番にやっていきます。

## Raspberry Piで、Node.jsからobnizを利用する

参考[Obn

元記事を表示

Promiseは何時呼ばれるのか?

Promiseは何時呼ばれるのか?
使う分には今まであまり意識してこなかったのですが、async/awaitを呼ぶことで処理がブロッキングされるのではないかというのを懸念していたのと、そもそもどのタイミングでPromiseのcallbackがされるのか気になったので今更ですが調べてみました。
Promiseが呼ばれる仕組みについては先にEventLoopとmicrotaskについて知る必要があります。

先に結論から書くと以下の感じです。

– PromiseはEventLoop内のmicrotaskキューでFIFO実行される。
– Timer系の処理(setImmediateやsetTimeout)はmicrotaskが全て実行された後に実行される。(つまり、`setTimeout(fn, 0)`はmicrotaskを全て実行した後にfnを実行するという意味)
– async/awaitはPromiseの箇所でsuspendしているに過ぎない(イベントループをブロッキングするかどうかはPromise内部の処理に依存する)、ジェネレータ文法(yield)やコルーチンの概念と同じ。

元記事を表示

【JavaScript】値がundefined/nullの時だけtrue判定にする

# 値が`undefined`と`null`の時だけ`true`として判定したい(`0`は`false`判定にしたい)
タイトルの通り、こんな場合どうするか。

[[JavaScript] null とか undefined とか 0 とか 空文字(”) とか false とかの判定について](https://qiita.com/phi/items/723aa59851b0716a87e3)に全て書いてあるが、このトピックの部分だけまとめてみた。

## 1. `if (!value)`
まず初めにこれを使っていたのだが、JSでは**`0`は`false`判定なので普通に間違い**。

勘違いして使っていたらバグの元になってしまう。

## 2. `if (value === undefined || value === null)`
これならOKだが、どこか野暮ったい。

この書き方が最も明示的で誰にもわかりやすいと思うが、もっとシンプルに書きたい場合もあるだろう。

## 3. `if (!value && value !== 0)`
2番目の書き方よりは短くなったが、少し分か

元記事を表示

Promiseとは・非同期処理時にPromiseを使うメリットとは

##Promiseとは
非同期処理のコードを扱いやすくするもの。
Promiseを用いると、非同期処理のコールバックの扱いがより簡単になる。

##Promiseを使った実装・使わない実装

・Promiseを使わずに実装

“`javascript
//doWorkCallback関数の定義
const doWorkCallback = (callback) => {

//非同期処理。2秒後に[1,2,3]を返す
setTimeOut(() => {
callback(undefined, [1,2,3])
}, 2000)
}

//doWork関数の実行
//第一引数:エラー時の返り値、第二引数:処理成功時の返り値
doWorkCallback((error, result) => {

if(error){
return console.log(error)
}
console.log(result)
})

“`

2秒後に[1,2,3]が返る
または、2秒後にerrorが返る

・Promiseを使って実装

“`javascript
//doWorkPromis

元記事を表示

MongoDBで配列内の特定の値だけを更新する

# やり方
Mongo公式ドキュメントの[$set](https://docs.mongodb.com/manual/reference/operator/update/set/)と[arrayFilters](https://docs.mongodb.com/manual/reference/operator/update/positional-filtered/)を利用する

## 実例
このようなドキュメントを持つコレクションがある時。

“`js
{
“_id” : 1,
“grades” : [
{ “grade” : 80, “mean” : 75, “std” : 6 },
{ “grade” : 85, “mean” : 90, “std” : 4 },
{ “grade” : 85, “mean” : 85, “std” : 6 }
]
}
{
“_id” : 2,
“grades” : [
{ “grade” : 90, “mean” : 75, “std” : 6 },
{

元記事を表示

node.js(express)でDB(Postgresql)にアクセス

# 背景

今日はバックエンド関連。

これまでバックエンド(主にDBアクセスまわり)は、ほぼJavaでしか書いたことがなかったので、
node.jsでDB(Postgresql)にアクセスする際には、どんな方法があるのか簡単に調べてみる。

ついでに、接続先のDBがAWSのRDS(Aurora/Postgresql)だった場合に、現時点ではどういう構成が最適なのかについても調べてみようと思う。

# 実装

まずは、node.jsでDB(Postgresql)にアクセスする際の実装(コーディング)方法について調べて試してみる。

## 調査

ネットを漁って軽く調べてみた感じ、以下の2つのパターンがありそう。

1. ORマッパーとしてSequelizeというライブラリを利用してDBにアクセスする
2. pg(node-postgres)を直接使って、自分でSQLを書いてDBにアクセスする

参考)
https://sequelize.org/
https://node-postgres.com/

ネット上の記事を見る限り、Sequelizeを使うケースのほうが多いような印象(ま

元記事を表示

OTHERカテゴリの最新記事