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

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

Next.js+TypeScriptでマルチプロセス対応カスタムサーバ作成

# Next.js+TypeScriptでマルチプロセス対応カスタムサーバ作成

– リポジトリ

– 原文リンク

## カスタムサーバ

 Next.jsはWebServer機能を標準で内蔵していますが、マルチプロセスや特殊なセッション処理などを組み込む場合には、カスタムサーバという形でWebServer部分を自分で実装する必要があります。

 公式にサンプルはある物の、以外に日本語の情報が少ない、それどころかマルチプロセスやfastifyでの実装記事は皆無だったので、書いていきたいと思います。

## マルチプロセス化について

 Next.jsを動かしているNode.jsは基本的にシングルスレッドで動作します。シングルスレッドといってもI/Oアクセスに関しては非同期で行われているため、無駄なブロックは起こらず、実用的な速度で動作することが可能です

元記事を表示

MyAnimListのアニメランキングをグラフ入りMDにする

## 使用例

個人的に、[はてなブログ](https://blog.andoryo.com)で使っています。投稿する部分は割愛。

## レポジトリ

https://github.com/and0ry0/myanimelist-email

## 前提

“`package.json
“dependencies”: {
“json2md”: “^1.9.2”,
“node-fetch”: “^2.6.1”,
}
“`

## アニメオブジェクト

“`index.js
const fetch = require(‘node-fetch’)

function convertAnime(anime) {
const jaTitle = anime.title
.replace(‘Shingeki no Kyojin’, ‘進撃の巨人’)
// 日本語翻訳適当ですいません

return {
rank: anime.rank,
url: anime.url,
title: jaTitle,
score:

元記事を表示

JavaScript でコンストラクタをプライベートにする

# はじめに

* コンストラクタを不可視にしたい
* 即時関数でもできるが、読みづらいので他の方法を考えてみた
* 可視性の境界をモジュール単位にするのがシンプルっぽい

# やりかた

インスタンスを生成する関数だけエクスポートする。

“`js:Point.js
class Point {
constructor (x, y) {
this.x = x
this.y = y
}
}

// ファクトリーメソッド
function pointAt(x, y) {
return new Point(x, y)
}

// ファクトリーメソッドだけ export する
export { pointAt }
“`

“`js:利用側
import { pointAt } from ‘./Point.js’

let p = pointAt(0, 1)
“`

# 使いどき

インスタンスの生成方法を強制したいとき。
Java の [Integer クラス](https://docs.oracle.com/javase/jp/15/docs/api/ja

元記事を表示

Gatsby.jsで無限スクロールを実装する方法

## この記事について

無限スクロールしたいというのは、割と良くあることだと思います。
純粋なReactだと無限スクロールのコンポーネントはGithubにもたくさん上がっていて、それらを導入するだけで済むのですが、Gatsby.jsを使用する場合にはちょっとした注意点と対策が必要なので、それを書きます。

## まず素直に書いてみる

無限スクロールのコンポーネントには、スター数が多い[ankeetmaini/react-infinite-scroll-component](https://github.com/ankeetmaini/react-infinite-scroll-component)を使います。

“`jsx
import React, { useState } from “react”
import { graphql } from “gatsby”
import InfiniteScroll from ‘react-infinite-scroll-component’

const IndexPage = ({ data: { allVideo }}) => {

元記事を表示

Node.jsからDynamoDBのテーブルの作成・削除と行追加・読み取り

表題の通りNode.jsからDynamoDBのテーブルの作成・削除と行追加・読み取りをメモします。
動作確認した後Qiita掲載用に少々手を入れているのでもしかしたら動かないかもしれません。

# テーブルの作成

プライマリキーに「accessKey」を指定する場合

“`javascript
const AWS = require(“aws-sdk”);
AWS.config.update({
region: “ap-northeast-1”
});
// DynamoDB Local使うならendpointの指定が必要
const dynamo_opt = {
apiVersion: ‘2012-08-10’,
endpoint: `http://localhost:8000`
};
const dynamodb = new AWS.DynamoDB(dynamo_opt);

const dynamoCreateParams = {
TableName : “テーブル名”,
KeySchema: [
{ Attribut

元記事を表示

rails6を使おうとしたら、Webpackerがインストールできない。

#Rails6使いたい
rails6を使ってシステムを使おうとすると、
Webpackerがインストールできない事態に遭遇しました。

“`
rails webpacker:install
“`
してくださいと言われたので、してみると…

“`
sh: /usr/local/heroku/bin/node: cannot execute binary file
sh: nodejs: command not found
Node.js not installed. Please download and install Node.js https://nodejs.org/en/download/
“`

と表示されインストールできません。

Node.jsをサイトからインストールしたり、

“`
alias nodejs=’node’
“`

というエイリアスも追加してみましたが、変化はありませんでした。
#解決策

“`
sh: /usr/local/heroku/bin/node: cannot execute binary file
“`

上のエラー文

元記事を表示

Node.jsとElectronを使った WebAPIで画像を取得して一定時間ごとに画像が切り替わるデスクトップアプリ

# デスクトップアプリを作りたかった
Node.jsとElectronを使ってデスクトップアプリを作成しました。
そして、今回はデスクトップアプリ上にWebAPIを使って犬の画像を取得して一定時間ごとに切り替わって表示するようにしました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/199067/5ff9b448-8dbb-f943-4b2a-301bbf6d377c.png)

# 環境
Node.js : v10.16.0
Electron : v11.2.1

# ソースコード
ソースコード自体は以下のリンクに載せています。
https://github.com/r-kuno-zer0/DogClock

# 環境構築方法
今回作成するにあたり以下のサイトの構築方法を参考にさせて頂きました。
環境構築方法(Electronのインストール方法等)についても参考にさせて頂きました。
そのため今回の環境構築については割愛させていただきます。
https://qiita.

元記事を表示

mongoDBで複数行をインクリメントしたい時

今回は、1つのステートメントで1つのドキュメントに対して複数のmongo更新をする話について紹介します。
(mongo2.4環境)

例えば、カラムaとカラムbの複数行のレコードを`inc`値だけ増やしたい時。

“`
db.test.update({“name”:”sample_data”},
{$inc:{a:inc}, $inc:{b:inc});
“`

このようにして書くと、bの数値だけ増加します。
複数$incを付けた場合、最後のステートメントだけ反映される仕様のようです。
以下のようにして解決します。

“`
db.test.update({“name”:”sample_data”},
{$inc:{a:inc, b:inc});
“`

これで、aとb両方の数値がインクリメントされます。

なお、「この値は増加させて、このフィールドをセットして…」と、`$inc`と`$set`を組み合わせる場合もあるかと思います。
その場合は、*ドキュメントの異なる部分に影響を与える場合は、複数の更新を組み合わせることができます*。

“`
db.t

元記事を表示

Node.jsの基礎

![img01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/618885/e117f78f-3f1b-386f-e7eb-cff9dc6e5217.png)

# Node.js

### イベントループによる並行処理
Node.jsの第一の特徴としてあげられるのは、並行処理をマルチスレッドではなくイベントループによって実現するというものです。イベントループは単一のスレッド(シングルスレッド)で動作するため、マルチスレッドのようなリクエスト数の増大に伴う問題が起きづらくなっています。
 イベントループは実行すべきタスクをキューに積み、これを1つづつ取り出してシングルスレッドで実行していきます。逐次処理のようですが、これで並行処理を実現できるのは、ここでのタスクが一連の処理をI/Oの発生するタイミングを境に分割した物だからです。プログラムはI/O実行時にその完了後のタスクを指定し、実際にI/Oが完了すると指定されたタスクがキューに追加されます。

# Ecmascript, Web標準
JavaScri

元記事を表示

node.jsでgoogleapiのリダイレクトURIに任意の文字列(state)を追加する方法

#この記事について
バックエンドで Google API を使っています。
言語はNode.jsで書いています。
Google APIの使用には、[Google APIs Node.js Client](https://googleapis.dev/nodejs/googleapis/latest/calendar/index.html)
を使っています。

今回は、Google APIのユーザー認証後のリダイレクトURIに任意の文字列を指定する方法を記載します。

#事前準備
GCPコンソールにてGoogleプロジェクトを作成し、認証情報を作成し、何かしらのAPIを有効化しておいてください。
↓GCPコンソール(developers)
https://console.developers.google.com/apis

#やり方
リダイレクトURLに任意の文字列を含めたい場合は、__state__パラメータを認証URLに含めることで可能です。
https://developers.google.com/identity/protocols/oauth2/web-server#re

元記事を表示

今までに私が遭遇したgulpエラーの解説と解決方法まとめ

今回は私がgulpなどを触っていくなかで、発生したgulpエラーとその解決方法についてまとめました。
同じようなエラーに遭遇された方で、エラー解消の一助になれば幸いです。

参考にしたサイトのURLも一緒に載せておきます。

それでは早速いきましょう。

**【目次】**

+ **1 Error: Cannot find module ‘gulp-sass’**
+ **2 Error in plugin “gulp-imagemin”**
+ **3 Error: Node Sass does not yet support your current environment: Windows 64-bit with Unsupported runtime (88)**
+ **4 Error in plugin “gulp-imagemin”**
+ **5 SyntaxError: Identifier ‘<変数名>‘ has already been declared**
+ **6 ERR! missing script: start**
+ **7 Er

元記事を表示

Node.js 特定の値が含まれているJSONファイルを振り分ける

エンタメ系企業の社内もろもろを担当しているakibinです。

[Twitterアカウント](https://twitter.com/akibinmusic)
[Youtubeチャンネル](https://www.youtube.com/channel/UC-JOpwEnJn3gCrUA4NdCYgg)

最近、[Shuta Hasunuma Philharmonic Orchestra / HOLIDAY feat. Moeka Shiotsuka](https://www.youtube.com/watch?v=MZ6rCoJGTdA)にハマってます。春らしくて春が待ち遠しくなりますよ寒いの飽きたよいいかげんにしてほしい。

# 概要
Node.jsで特定の値が含まれているJSONファイルをピックアップして、他のディレクトリにコピーしました。
なぜかと言うと、Markdown形式のWikiアプリから他のアプリに移行するのに、特定の値から移行したいJSONファイルを振り分ける必要があったからなのです。

# そのもの
今回はJSONファイルのgroupsという項目の中のIDが”111

元記事を表示

フレームワークexpressのインストールと起動

#初めに
以下コマンドでコンソール起動

“`
vagrant up
vagrant ssh
“`

#次に
以下コマンドで Express application generatorをインストール

“`
yarn global add express-generator@4.16.0
“`

#最後に

以下コマンドでファイルでファイル作成
hoge部分はファイル名

“`
express –view=pug hoge
“`

以下コマンドでPORT=8000で起動
http://localhost:8000/ にアクセスすると開ける

“`
yarn install
DEBUG=hoge:* PORT=8000 yarn start
“`

元記事を表示

Puppeteerで3rd-party cookieを保存・利用する

Puppeteerで3rd-party cookieを保存・利用したい場合の処理についてまとめました。ログイン処理がクロスサイトになっているWebページをPuppeteerで利用する場合など、以下で紹介するコードが必要になることがあります。

## cookieのセーブ

cookieを保存するファイルをtmpdirに作る方針のコードです。別のパスに保存する場合はよしなに変更してください。

“`javascript
const os = require(‘os’);
const path = require(‘path’);
const fs = require(‘fs’).promises;

/*(中略)*/

try {
const client = await page.target().createCDPSession();
const allBrowserCookies = (await client.send(‘Network.getAllCookies’)).cookies;
const cookiePath = path

元記事を表示

nodenvでNode.jsをバージョン管理

※この記事はMacOSを前提として書かれています。
※Windowsの場合は、「[nodistでNode.jsをバージョン管理](http://qiita.com/satoyan419/items/56e0b5f35912b9374305)」を参照してください。

# nodenvの環境の準備

[nodenv](https://github.com/nodenv/nodenv)を使ってNode.jsのインストールやバージョン管理をおこないます。

## nodenvのインストール

まず、ターミナルで以下のコマンドを実行します。

“`:ターミナル
git clone https://github.com/nodenv/nodenv.git ~/.nodenv
“`

次に以下のコマンドを実行します。このコマンドで失敗しても、`nodenv`は正常に動くので大丈夫です。[^1]
[^1]: [GitHub – nodenv/nodenv: Manage multiple NodeJS versions.](https://github.com/nodenv/nodenv#basi

元記事を表示

フロントサーバ、バックサーバの分離された構成でミニマムなサービスを作る。

# はじめに
本記事はモノリシック**でない**分離されたアーキテクチャ(マイクロサービス)について理解を深めるため、
ミニマムなアプリを作ってみたときのまとめ記事です。
※当方初心者のため、間違いありましたら是非ともご指摘お願いいたします。

## 著者について
以下著者のスペック

– エンジニア一年目
– WebアプリといえばMVCしか知らない
– マイクロサービス?なにそれおいしいの

## 背景
基本情報などの勉強中、よくこんな図が出てきて混乱していました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/290859/dc183023-3b4a-1083-0e57-355bbfeaf9b1.png)

– Webアプリのアーキテクチャ?、MVCしかしらんけど?
– アプリのサーバって一つだけじゃないの?
– でもReactとかは独立してサーバーが立っているぽい、、
– どうやってバックエンドと連携させるんやろ、、?

このような疑問を持った私は、「わかんないなら触ってみればい

元記事を表示

Node.js on Raspberry Pi Zero WHのはまりどころ

# 概要
Raspberry Pi Zero WH上にNode.jsの実行環境を構築しました。
やりたいことは**Raspberry Pi Zero上での形態素解析と画像生成**です。

しかしRaspberry Pi Zero WHはARMv6コア、RAM512MBと最小限のアーキテクチャです。
リッチなことをやろうとすると一筋縄ではいきません。
色々工夫して何とか実行環境を構築できました。

その時のはまりどころを情報共有します。

# Agenda
主に以下3つではまったので、それぞれを説明します。
1. ARMv6コア起因
2. RAM不足起因
3. ライブラリ不足起因

# はまったところ
## 1. ARMv6コアによるnpmエラー
Raspberry Pi ZeroはARMv6コアを実装しています。
v6コアは2000年代前半のアーキテクチャでちょい古です。
なので、

* apt/apt-getのインストールしてもnpmがエラーを吐く
* スクリプトを使わず手動でインストールしようにもNode.js公式のTOPではv7以降しか載っていない

よって過去のdistを

元記事を表示

Reactでの認証時にJWTをCookieに設定する方法

SPAでの認証といえばJWTを使うことが多いと思いますが、
localStorageに保存するとセキュリティリスクが高いとかで、
CookieにHttpOnlyな値として保存するのが良いとしばしば言われることもあります。
今回はReact × ExpressでJWTをCookieに保存する具体的な方法を紹介します。

(そもそもJWTを使うべきかとか、localStorageを使うことのリスクなどについては要件次第なのであまり言及しません)

調査にあたっては以下の記事を参考にしました。
[React Authentication: How to Store JWT in a Cookie](https://medium.com/@ryanchenkie_40935/react-authentication-how-to-store-jwt-in-a-cookie-346519310e81)

記事の方法そのままでは自分の環境では上手くいかなかったので、ハマりポイントも含めて手順を解説します。

# 最終的に出来上がったもの

– **JWTをCookieに保存する**
https:/

元記事を表示

node.jsの基本

node.jsは僕にとってはじめてお金を稼げた言語でとても特別なものなのですが、仕様を端から端まで熱心に勉強したわけではなく、壁にぶつかってはググっての繰り返しで身につけたので自分の理解をちゃんと整理するための備忘録として、また初学の人たちへ少しでも役に立てばとまとめました。

#node.jsとは
node.jsはサーバーサイドのイベント駆動型JavaScript環境です。イベント駆動型というのは、プログラムの実行から何かしらが起きるまで待機して、起きた事物が規定の条件を満たしたときに指定された命令を実行するプログラミングの概念です。node.jsはJavaScriptを用いてPHPやPythonなどで書くようなサーバーサイドアプリケーションを作成することができます。

#Hello World

node.jsにおける最も基礎的なHello Worldです

“`javascript:server.js
const http = require(‘http’)
const port = 3000
const hostName = “127.0.0.1”
const headers

元記事を表示

discord.jsでメンションするとmp3ファイルを再生するbot

## はじめに
実装/実行環境: glitch.com : https://glitch.com/
定期bot監視: UptimeRobot : https://uptimerobot.com/
開発環境: Node.js
discord API: v12

botの作成等はこちらの記事を参考にしてください(コーディング部分以外)
https://note.com/bami55/n/ncc3a68652697#KRily

この記事の現バージョンより古いコードや、今回作成するbotのための追加作業を敵船説明していきます。
※ botの招待でURLの作成時にパーミッションをAdminにするのは嫌!!という方は、
  下記画像のようにBOT PERMISSIONSを設定してください
![disco.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1049024/74e5d228-6501-d23e-1169-20dd4e304f19.png)

・View Channels: プライベート

元記事を表示

OTHERカテゴリの最新記事