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

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

【GraphQL】ApolloServer v4 × PrismaでSubscription実装時に関連するデータを取得する方法

# はじめに
今回は`GraphQL`と`Apollo Server v4`によるDBでリレーションが組んであるデータをリアルタイムで取得する方法(Subscription)を実装していきます。

# 前提
Subscriptionについてわからない人は、公式や以下の記事を参考にしてください。

> – [Subscriptions in Apollo Server](https://www.apollographql.com/docs/apollo-server/data/subscriptions/)
> – [【GraphQL】ApolloServer v4によるSubscriptionの実装方法](https://qiita.com/curry__30/items/287f2bbcff55637374f7)

# 実装
今回実装する機能としては、投稿に対して、投票を行う機能を実装していきます。(いいね機能と概念は同じです)

## スキーマ定義
注意点として、今回はコード全体ではなく、関連する箇所をピックアップするような形で記載していきます。
:::note info
Pris

元記事を表示

Qiita API に Node.js の fetch() で認証つきのリクエストをする

# アクセストークンの発行

まず、認証のためのアクセストークン発行から実施します。公式ドキュメントの認証認可の項目どおりに進めていけば OK です

https://qiita.com/api/v2/docs#%E8%AA%8D%E8%A8%BC%E8%AA%8D%E5%8F%AF

以下のいずれかの方法で発行できます

– ユーザーの管理画面から発行
– OAuth を利用した認可フロー

今回は自分自身のアクセストークンだけ取得できれば十分なので、管理画面からの発行をやってみます。

まずは [ユーザーの管理画面](https://qiita.com/settings/applications) を開き、「新しくトークンを発行する」をクリックします

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/27471/e2616c0f-1b46-1361-30d0-50113a3edd55.png)

次は、アクセストークンの設定画面です

– 説明を埋める
– アクセストークンの管

元記事を表示

アプリケーションはどのようにMySQLと接続するのか

# この記事について
アプリケーションがMySQLと接続する際、基本的には何らかのORMを使用することだと思います。
ORMではMySQLへの通信は**隠蔽**されており、実装の詳細を気にしなくてもよくしてくれています。この記事ではその隠蔽された**中身の仕様について調べ、その実装を解析**してみました。

# MySQLプロトコル
MySQLは**独自の通信プロトコル**を持っており、そのまま「**MySQLプロトコル**」と名付けられています。
このプロトコルはアプリケーションレイヤーに位置しており、下のレイヤーとしてTCP/IPやUnixDomainSocketなどを使用できます。

このプロトコルは2つの段階に分かれています。
1つ目のフェーズは通信の開始を行う「**ConnectionPhase**」2つ目のフェーズはSQLの実行を行う「**Command Phase**」です。[^1]

[^1]: https://dev.mysql.com/doc/dev/mysql-server/latest/PAGE_PROTOCOL.html#protocol_overview

元記事を表示

ReactとNode.jsで作成したウェブサイトをVercelとRender.comを使用してデプロイする方法

はじめまして、エンジニア職へのキャリアチェンジのためカナダへ留学中のMayuです!

初めての記事で突然ですが、苦手なデプロイについて自分のメモ用に記録しておこうと思います。

まず今回デプロイしたいのが、下記を使用して作成したオンライン予約サイト。
デプロイURL: https://salon-booking-system-frontend.vercel.app/
・frontend: Vite+React(https://github.com/MayuHayakawa/salon_booking_system_frontend)
・backend: Node.js, MongoDB(https://github.com/MayuHayakawa/salon_booking_system_backend)

そしてデプロイに使用したサイトが
・frontend: Vercel
・backend: Render.com

なぜこの二つを使用したかという理由は特にありません
(というよりまだよくわかっていないという言い方の方が正しい・・・)
在学中の学校の先生に提示してもらったものをその

元記事を表示

symbol-sdk@3.0.7を試してみる

# はじめに

こんにちは。symbol-sdkの3系が手軽に利用できるようになりましたね。

npmでは、執筆時点で3.0.7が公開されています。

https://www.npmjs.com/package/symbol-sdk/v/3.0.7

では、少し触ってみようと思います。

# インストール

今回はブラウザではなくて、Node.jsの環境で実施します。

以下

“`shell
npm i symbol-sdk
“`

のコマンドで、

“`json
“symbol-sdk”: “^3.0.7”
“`

が入りました。rxjsはいらないみたいです。

また、REST Gatewayとの通信のためにaxiosをインストールしておきます。

“`bash
npm i axios
“`

# Typescriptは使えない

最初Typescriptで始めようとしたら、コンパイルでこけました。どうやらTypescriptは対応していないようです。

“`bash
> tsc

src/index.ts:1:23 – error TS7016: Could not

元記事を表示

symbol-sdk@3.0.7で作るモザイクとネームスペースのトランザクション

# はじめに

こんにちは。

symbol-sdkの3.0.7、トランザクションシリーズ第二弾です。

今回はモザイクとネームスペースをやっていきます。

https://www.npmjs.com/package/symbol-sdk/v/3.0.7

## シリーズ

https://qiita.com/planethouki/items/860d9f1095c087ccd98f

## 注意事項

書いてあるコードについて、正確性や完全性を保証するものではありません。あくまで参考程度として頂き、最新情報は公式ドキュメンテーションをご確認ください。

# 共通

まずはモザイクのトランザクションとネームスペースのトランザクションで共通となる個所について。
デッドラインと鍵ペアです。

“`jsx
import symbolSdk from ‘symbol-sdk’;

const network = symbolSdk.symbol.Network.TESTNET;
const deadline = network.fromDatetime(new Date(Date.now(

元記事を表示

【Unity】WebRTCで複数クライアントをルームごとに相互接続する

# この記事の概要
この記事では,[WebRTC for Unity](https://github.com/Unity-Technologies/com.unity.webrtc)の[DataChannelのサンプル](https://github.com/Unity-Technologies/com.unity.webrtc/tree/main/Samples~/DataChannel)をもとに作成した複数クライアントのP2P接続を行う方法について解説します.[WebRTC](https://github.com/Unity-Technologies/com.unity.webrtc)と[Websocket](https://github.com/endel/NativeWebSocket)のパッケージを使用しました.

# Gif
![ouput.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3358989/1c0171b3-4d2d-8a62-7f20-98b86010de86.gif)

#

元記事を表示

無料でインターネットペットカメラを作ろう

## 概要

仕事中に、家でお留守番しているペットを見たくなったことはありませんか?

この記事では、

使わなくなったスマホやRaspberry Piを自宅のペットカメラにして外出先からペットを見ることができるシステムを作ります。

このシステムの特徴は
– 無料
– 3分で利用開始できる
– 自宅ネットワークの設定変更不要で、インターネットから見られる

です。

完成すると、この図のように、いつでもペットが見られます!
![構成図](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/141013/1d5849c4-82e1-5104-725e-0bf955f2fb57.png)

## さぁ始めよう

この記事では

1. SkyWayのセットアップ
2. デモサーバーを使ってインターネットペットカメラを動かす
3. SkyWayの説明
4. ローカルでペットカメラを動かす
5. GitHub Pagesを使ってホスティングする
6. プログラムの解説

という流れで進めていきます。

1, 2だけでも、

元記事を表示

【GraphQL】ApolloServer v4によるSubscriptionの実装方法

# はじめに
今回は、`GraphQL`と`ApolloServer v4`を用いて`Subscription`の実装を行いました。
(v4になると記事がないので大変でした・・・)

備忘録として残しておこうと思います。

# Subscriptionとは
まず、簡単にですが、Subscriptionとはサーバーに登録や更新処理などのイベントが発生するたびに、データを即時に更新(反映)できるというものです。
(`結果整合性`がとれるApollo Serverの機能のことです)

現実のサブスクの定期購入に近く、サーバーにサブスク登録されているクライアントにプッシュすることでデータを即時に更新することができるというものです。
(実際のコードを見るとしっくりくるはずです)

# ライブラリの導入
以下のコマンドで必要なライブラリをインストールします。

“`terminal
yarn add graphql-ws ws @types/ws @graphql-tools/schema graphql-subscriptions cors @types/cors express
“`

元記事を表示

JavaScriptでPDF生成5パターン

PDFの生成は様々なシチュエーションで必要とされる機能です。JavaScriptではいくつかの方法があります。
以下5パターンについて一通り実装した経験からメリット・デメリットを簡単に書きます。

## バックエンドでの生成

### 1. HTML + Puppeteer

PuppeteerはGoogle ChromeまたはChromiumをヘッドレス(UIなし)で操作するためのNode.jsのライブラリです。Puppeteerを使えばHTMLをレンダリングしてPDFとして保存することが可能です。

**メリット**:

– HTMLとCSSを用いたレイアウトなので、デザインの自由度が非常に高いです。

**デメリット**:

– レンダリングのためにはブラウザのエンジンが必要なので、サーバー側のリソース消費が大きいです。
– ブラウザのセキュリティ制限により、一部の機能が利用できない場合があります。

### 2. PDFKit

[PDFKit](https://github.com/foliojs/pdfkit)は、PDFをプログラムで生成するためのNode.jsのライブラリ

元記事を表示

symbol-sdk@3.0.7で作る転送トランザクション

# はじめに

こんにちは。
symbol-sdkの3.0.7がついに出ました。学習のために、様々なトランザクションを作ってみようと思います。

https://www.npmjs.com/package/symbol-sdk/v/3.0.7

全部いっぺんに書くと長くなってしまうので、少しずつ分けて書いていく予定です。

今回は、転送トランザクションについて書いてみたいと思います。

## 注意事項

書いてあるコードについて、正確性や完全性を保証するものではありません。あくまで参考程度として頂き、最新情報は公式ドキュメンテーションをご確認ください。

# Transfer Transaction

まずはデッドラインと鍵ペアです。

“`jsx
import symbolSdk from ‘symbol-sdk’;

const network = symbolSdk.symbol.Network.TESTNET;
const deadline = network.fromDatetime(new Date(Date.now() + 7200000)).timestamp;

c

元記事を表示

ECサイトで決済システムStripeを使いたい

Node.jsとStripeを使った決済システムの作り方

ユーザー側のWEBサイトの構築(index.html等)
 → サーバーサイドをnode.js
 → 決済システムはStripeを使用

Node.jsの知識が少し必要かもしれないがそこはスルーします


好きなファイル名でフォルダを作成
フォルダ名はECサイトで決済システムStripeを使いたい(英語推奨)

ターミナルを開いてpackage.jsonを構築
“`php:terminal
npm init -y
“`

【index.js】の名前を今回は【server.js】に変えて作業をしようと思うので【package.json】を開き”main”:server.jsとscript ”dev”: “nodemon server.js”の記述を追記する
“`php:package.json
{
{
“description”: “”,
“main”:”server.js”,//ここを追記
“scripts”: {
“dev”: “nodemon server.js”

元記事を表示

Next.js v13 App route で Web Crypto API が undefined

## TL;DR

以下の形でインポートする。

“`typescript
import { webcrypto as crypto } from “crypto”;
“`

または、 Node.js を v19 以降にアップグレードする。

## 問題:Next.js App Route で Web Crypto API が使えない

Next.js v13 にて、 App Route を使っていた。
Web Crypto API、特に `SubtleCrypto` を使用したコードを書いたところ、以下のように `undefined` とエラーが出た。

“`
TypeError: Cannot read properties of undefined (reading ‘digest’)
92| const hash = await crypto.subtle.digest(“SHA-1”, arr);
“`

## 原因:Node バージョンまたは Next.js ランタイムの違い

v19 以前の Node.js では Web Crypto API は

元記事を表示

google-api-nodejs-client で Calendar API をよんだら Rate Limit Exceeded (403)を踏んでリトライした話

## 概要
[google-api-nodejs-client](https://github.com/googleapis/google-api-nodejs-client)を使って、Calendar のAPIを叩くオレオレAPIを作ってみた際に、一定のアクセス量から、Rate Limit Exceeded を引いたため、それの原因っぽいものと、ある程度の緩和策について備忘録として記載しようかと思います。

– ※ Rate limit など、Google に関する API の仕様などは常に変動する可能性があります。
– この記事の情報は2023/06/30時点の情報になります。

– ※ 当人は Node.js もgoogleのAPI についても初学者です??‍♂️

## 何が起きた?
概要でも記載しましたが、[google-api-nodejs-client](https://github.com/googleapis/google-api-nodejs-client)を使って、Calendar のイベントを作るAPIを叩くオレオレAPIを作っていたのですが、APIの一

元記事を表示

nodebrewによるNode.jsのインストール手順まとめ

# はじめに

nodebrewによるNode.jsのインストール手順をまとめました。

**実行環境**
– Apple M2 Max
– macOS Ventura 13.2.1

# インストール手順
## 準備:Homebrewをインストール
Homebrewがインストールされているかを確認。
“`bash
brew -v
“`

バージョンが表示されない場合はHomebrewをインストール。
([Homebrewのホームページ](https://brew.sh/index_ja)にあるインストール用のスクリプトを実行)

## nodebrewをインストール

以下のコマンドでnodebrewをインストール。

“`bash
brew install nodebrew
“`

インストールできたら以下のコマンドを実行しておく。

“`bash
nodebrew setup
“`

パスに関する記述を`~/.zshrc`に追加する。
“`bash
export PATH=$HOME/.nodebrew/current/bin:$PATH
“`

`~/.zshr

元記事を表示

TypeScriptでAWS SQSを使う

AWS SDK for Javascriptを使って、AmazonSQSを試してみます。

# AmazonSQS
公式サイト:https://aws.amazon.com/jp/sqs/

マイクロサービス、分散システム、およびサーバーレスアプリケーション用の完全マネージド型メッセージキューです。
メッセージの順番が保証されず、ちょっと安く利用できる**標準キュー**と、高スループットでメッセージの順番が保証されている**FIFOキュー**の2種類のキュータイプがあります。

細かい機能は公式サイトを見ていただけたらと思います。

SQSは使用した分で課金される&一定量を超えない限り課金されない、ので放置していても課金が発生せず、作った後に削除する必要がないのも試しやすい点です。

# AWS SDK for Javascript
公式サイト:https://aws.amazon.com/jp/sdk-for-javascript/

JavaScriptから呼び出すAWS SDKです。AWSのサービスを簡単に使うことができます。
当たり前ですが、今の業務がTypeScript、No

元記事を表示

nodejsでsqlite3のデータを表示する

## やりたいこと
sqliteにテストデータを作成しconsoleに表示する。

## 書いたコード
“`terminal:install
npm install sqlite3
“`

“`typescript:テストデータの作成と表示
const sqlite3 = require(‘sqlite3’).verbose();

// データベース接続の作成
const db = new sqlite3.Database(‘mydatabase.db’);

// テーブル作成のクエリ
const createTableQuery = `
CREATE TABLE IF NOT EXISTS users (
id INTEGER PRIMARY KEY AUTOINCREMENT,
name TEXT,
email TEXT
)
`;

// テーブルの作成
db.run(createTableQuery, function(err) {
if (err) {
console.error(err.message);
} els

元記事を表示

npmでよく使うコマンド

## 環境構築

### npm init

Node.jsプロジェクトを新規作成します。
具体的には `package.json` が作成されます。

### npm install

`package-lock.json` を見てパッケージをインストールします。
`package.json` や `package-lock.json` は書き換えません。

`package-lock.json` が存在しない場合、 `package.json` を見てパッケージをインストールします。
インストール後、 `package-lock.json` が作成されます。

### npm install {パッケージ名}

指定したパッケージをインストールします。
インストール後、`package.json` と `package-lock.json` を書き換えます。

`npm i {パッケージ名}` と省略できます。
`-g` オプションを付けるとグローバルにインストールします。(他のコマンドも同様)

`–save-dev` オプションを付けると `dependencies` でなく

元記事を表示

【AES256-GCM】暗号化メソッドをNode.js・TypeScriptで実装する

Node.js・Express・TypeScriptを使い、自前で暗号化処理を作成したので備忘録として書きます。この記事では、AES256-GCMという強固な暗号化アルゴリズムを利用して、データを安全に暗号化する方法を解説します。

## はじめに
この記事では、Node.js、Express、およびTypeScriptを使用して、AES256-GCM暗号化アルゴリズムを使ってデータを暗号化するプロセスを書いています。AES256-GCMは共通鍵暗号化方式の一部で、安全なデータ保護を目的として広く使用されています。

## AES256-GCMとは
暗号化方式には主に以下の2種類が存在します。

– 共通鍵暗号化
– 公開鍵暗号化

AES256は共通鍵暗号化方式の一つで、特にセキュリティが強化されています。AES256には、ECBモードとGCMモードの2種類があり、GCMモードは認証付き暗号化を提供し、データの機密性と完全性の両方を保護するため、より堅牢です。

## bcryptとの違い
bcryptは、主にパスワードのハッシュ化に使用される一方向性関数です。ハッシュ化されたデータ

元記事を表示

YouTube Data API v3 を使ってプレイリストを作成する(業務実例付き)

## はじめに
本記事では、Node.js上でYouTube Data API v3を使いプレイリストを一括作成する手順を紹介します。

言語はTypeScript、[Google APIs Node.js Client](https://github.com/googleapis/google-api-nodejs-client)を用います。

https://github.com/googleapis/google-api-nodejs-client

そもそも大量のプレイリストを必要とするケースがどんなものか、さほど明白ではないと思われる[^1]ので、最初に筆者の業務実例を簡単に触れておきます。(記事本文に進みたい方は[こちら](#環境))

[^1]:日本語で書かれたYouTube Data API v3に関する過去記事を見ても「プレイリストへの動画の追加」を扱ったものはあっても、プレイリスト自体を作る記事は管見の限りありませんでした。

#### 業務実例 〜コンクールでの動画審査
[全日本ピアノ指導者協会(ピティナ)](https://qiita.com/organ

元記事を表示

OTHERカテゴリの最新記事