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

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

【Node.js / Vercel】おまえは今までにプログラミングしたbyte数を覚えているか

# 覚えていますか?[^1]

ということで、こんなものを作りました。
GitHubのレポジトリのプログラミング言語とそのbyte数を集計して、グラフをSVGとして表示するものです。

↓↓ こんな感じ(私のレポジトリ集計結果です)
[![bytes](https://github-repo-bytecounter.vercel.app/api?username=yamaccu&exclude=yamaccu.github.io,Blazor-CharjsTest)](https://github.com/yamaccu/Github-Repo-ByteCounter)

# 何に使うの?

独学において、自分の勉強量の見える化はモチベーションにつながります。
勉強時間でもいいのですが、GitHub APIでレポジトリのbyte数が取得できるので、プログラミングしたbyte数も良いモチベーションになるかもと思い、作ってみました。

GitHubのプロフィールに貼ると少しだけイケイケになります。

[![githubProfile-min.png](https://qiita-imag

元記事を表示

【Express.JS×PostgreSQL】でテーブルのCRUD機能を実装する。

Javascriptフレームワーク「Express.js」を使ってテーブルのCRUD機能を作ってみよう!

【最終目標】の画面はこんな感じの画面です。↓

![2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1169664/f7ffc85b-0e1a-89f5-25ca-fbdeee163d1e.png)

【開発環境】
OS:Windows11
【ミドルウェア】
PostgreSQL
【Node.jsフレームワーク】
Express.js

# 準備
■【Node.js】のインストール
Node.jsは以下からインストール↓
[Node.js](https://nodejs.org/ja/)

■PostgreSQLは以下からインストール↓
[PostgreSQL](https://www.postgresql.org/download/)

# Express Generatorをインストールする。
ExpressのWebアプリケーションを開発するにあたって便利なソフトウェア「Express G

元記事を表示

npmとnpxの違い説明できますか?

![0_wIYZeY_ttgeYFpfA.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2852310/5fd83f50-0cb8-4d6d-7a9f-0156e1a978a1.jpeg)

# はじめに

記事をご覧いただきありがとうございます。
現在私は大学に通いながら日々プログラミングの勉強を進めています。
主に領域としましてはフロントエンドをメインに勉強をしてきました。そこでふと疑問に思った部分があります。

**それは「npm」と「npx」の違いについてです。**

主にlocalhostを立てる際に使用していましたが突然こんがらがってしまいこれは一度しっかりと理解し直すべきと感じこの記事を書くに至りました。

# 対象の読者
* 一度でも「npm」「npx」コマンドを使用したことがある方
* 日々開発でlocalhostを立てている方
* テンプレとして考えておりしっかりと理解し直したい方
* 一度でも私と同じように「npm」と「npx」でこんがらがったことがある方

# 目次
1.そも

元記事を表示

【備忘録】Node.js×pnpm×TypeScript

# はじめに

Vue CLIやviteを利用すると設定ファイルを一通り用意してくれてしまうので、学習のためにイチから各種ライブラリを導入して作成してみた。
またpnpmも初めて使ってみた。

記事作成時点での最新情報を盛り込んだつもりだがNodeやTSまわりの技術は日進月歩なので古い(または古くなった)情報があったらすみません。

### 開発環境
– macOS Ventura 13.1
– Visual Studio Code 1.74.3
– Node.js 18.13.0

### 事前準備

#### pnpm有効化

https://pnpm.io/ja/installation#corepack%E3%81%AE%E4%BD%BF%E7%94%A8

最近のNode.jsにはpnpmがバンドルされているので有効化だけすればよい。
※ドキュメントにはないが自分の環境では`sudo`がないとPermission Deniedになった

“`
sudo corepack enable
“`

有効化確認&バージョン確認

“`
pnpm -v
“`
>7.25.0

元記事を表示

【Node.js】Stripeライブラリの入出力がsnake_caseになっているのをどうにかしたい

## はじめに

Node.jsでStripeを操作する際には、[Stripe Node.js Library](https://github.com/stripe/stripe-node)を利用する事になる。ただ、このライブラリのインターフェースはsnake_caseであり、JavaScriptのcameCaseと乖離があり利用しにくいと感じていた。

そこで今回は、インターフェース(入出力)をcameCaseで行えるようにするために、ライブラリに対しカスタムの拡張を行う実装をやってみたいと思う。

ソースコード全体は以下。

https://github.com/yuta-katayama-23/node-express/commit/3f76584935654a0ca472a7d8f8f42fbfab9dca57

## 実際にやってみる

“`js
import Stripe from ‘stripe’;
import { strict as assert } from ‘assert’;
import snakecaseKeys from ‘snakecase-keys’;

元記事を表示

WingetでNode.jsインストール

## Windows11のノートPCにNode.jsをインストールした時のメモ

超簡単な自分用の備忘録メモです。

## 環境

OS:Windows11 Pro

## パッケージマネージャ何使うか

Windowsのパッケージマネージャーは、scoopとかchocolateyとか有名だが、本家が一番良いのでは?ということで、後発ですが、wingetを利用。

* chocolatey うーん。以下2つに対してメリット感じられず。(個人的に触ったことがあったscoopかwin標準のwingetか)
* scoop 以前はこっちをつかっていたこともあるが、Powershellで実行していた
* winget コマンドプロンプトで実行できた

## 目的はnode.jsのインストールとnpmの利用

### 以下wingetコマンド実行してあるかなチェック

~~~
winget search nodejs
~~~

でこんな結果が返ってくる。(2023/01/16現在)
~~~
名前 ID バージョン

元記事を表示

CognitoユーザープールにAWS SDK for JavaScript v3でアクセス その2 – ユーザ登録

https://qiita.com/pilot/items/df8f3091e5ed0e35b4b4

の続き

# Cognitoクライアントの設定確認
1. AWSコンソール→Cognito→MyUserPool→アプリケーションの統合タブ→MyAppClient
1. クライアントIDとクライアントシークレットをメモ ★1

# 登録メール受取用gmailアカウント
今回はCognitoから送られるメールについてなりすましとみなされる件(メールのFromのドメインと実際の送信元IPアドレスが異なる)の対応は行わない
そのため、例えばdocomoメアドだとメールを受け取れない
gmailだったら受け取れるのでgmailアカウントを用意する (新規でも既存でも良い) ★2

# ユーザ登録 (メール送るまで)
1. 作業フォルダに以下のファイルを作成 → 使用クラス https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/clients/client-cognito-identity-provider/classes/signup

元記事を表示

TypeScriptでコマンドラインパラメーター解析

Node.jsのCLIなツールをいくつかTypeScriptで作っています。

毎回コマンドラインパラメーターの解析が似たような処理になるので、関数にして使い回していました。

せっかくなのでパッケージとして公開しています。

– [optionalist](https://www.npmjs.com/package/optionalist)

## 特徴

– コマンドラインパラメーターの解析として、当然指定されたパラメーターの情報に合わせて解析します。
TypeScript用なので解析結果は指定した名前と型のプロパティを持つオブジェクトとして返します。
このときのオブジェクトの型は可能な限り指定されたパラメーターの情報を反映したものにしてあります。
– 指定されたパラメーター情報からヘルプ用の文字列を生成します。
CLIに指定されたパラメーターにエラーがあれば自動的にヘルプ用文字列を表示するようにもできます。
– プロパティの型情報にはパラメーターのヘルプ用の文字列や制約などの情報を載せています。`VS Code`などの型を表示してくれるエディターであれば、プロパティに

元記事を表示

Node.jsでハッシュ値を生成する

Node.js でSHA1, SHA256のハッシュ値を作成するには、[Web Cryptography APIのdigest メソッド](https://w3c.github.io/webcrypto/#subtlecrypto-interface)を使用します。

もう一つの方法は、[Node.js の Crypto モジュールのcreateHash メソッド](https://nodejs.org/api/crypto.html) を使用します。

## サンプルプログラム(Web Cryptography API版)

SHA1, SHA256アルゴリズムでハッシュ値を生成し、出力するプログラムです。

“`javascript
//Web Crypto APIを使用した場合
const { subtle } = require(‘crypto’).webcrypto;

subtle.digest(‘SHA-1’, ‘Hello World’).then(function(result) {

const hex = Buffer.from(new Uint8Arr

元記事を表示

Node.jsからLighthouseを使用して認証付きサイトを検証する方法

## 目的
Node.jsからLighthouseを使って認証付きサイトの測定を自動化しようとして色々調べていたが、情報が散らばっていて構築するのにすごく手間がかかったので、メモがてら残しておく

## 環境
nodeがインストールされていることが前提
node v16.13.1

## 準備
まずは`Lighthouse`とブラウザ操作をするために`Puppeteer`、パスワードなど環境変数を使用するために`dotenv`をインストールする

“`
npm install lighthouse
npm install puppeteer
npm install dotenv
“`

## Node.jsで動かすためのコード
.envやコンフィグファイルを使用して、ユーザー名やパスワードをフォームに入力し、狙いのURLをLighthouseで検証するコードは以下となる。
Basic認証を通している。

“`lighthouse.js
const fs = require(“fs”);
const puppeteer = require(“puppeteer”);
cons

元記事を表示

Socket.io学習① 簡単なチャットアプリの構築2

前回の続きを書いていく。

“`
const express = require(“express”);
const app = express();

const http = require(“http”);
const server = http.createServer(app);
const { Server } = require(“socket.io”);
const io = new Server(server);

const PORT = 5000;

server.listen(PORT, () => console.log(`server is running on ${PORT}`));
“`

この部分の解説をしていく。
const なになに という部分ではインストールしたモジュールをインスタンス化している。

インスタンス化は分かったつもりにはなるが意外と説明するのは難しい概念である。
一応、インスタンス化は何なのか調べてみる。

調べてみると、オブジェクト指向で出てくる表現の1つでクラスから実体を作ることと書かれている。

自分なりの噛み砕き方で説

元記事を表示

UbuntuにNode.js LTSをインストールする方法

UbuntuにNode.jsのLTS版をインストールする方法を個人的なメモとしてここに置いておきます。
2023年1月13日現在、LTS版は、v18.xになります。

“`
curl -fsSL https://deb.nodesource.com/setup_lts.x | sudo -E bash – &&\
sudo apt-get install -y nodejs
“`

元記事を表示

Socket.io学習① 簡単なチャットアプリの構築1

マルチプレイのオンラインゲーム開発に向けてsocket.ioの勉強をしている。
その中で見つけた良い参考動画がこちら

これを参考にして簡単なチャットアプリを構築しつつ、socket.ioとnode.jsの勉強をしていこうと思った。

まず、ネックになるのはそもそもnpmが何なのかである。
node.jsなどを始める際に必要になるパッケージ管理システムであるがそのインストール方法は複雑に見えた。
さらにMacについての説明は多く見られたがWindows用を探すのにも一苦労した。

結局こちらのサイト

https://zenn.dev/antez/articles/a9d9d12178b7b2

を参考にしてインストールした。割と簡単で

https://github.com/coreybutler/nvm-windows/releases

こちらのサイトからインストーラー(nvm-setup.zip)をダウンロードして実行すれば良い。

そうすれば最低限の動作はするようになった。

そして、

元記事を表示

CognitoユーザープールにAWS SDK for JavaScript v3でアクセス その1 – ユーザ一覧取得

https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/clients/client-cognito-identity-provider/index.html

を使用してみる

Windows 11にて

Cognitoの設定は
・ユーザ名はメアド
・SMSは使用しない
・メアド・パスワードのみ保持 (他に必要なユーザ属性あれば別DBに保持)
とする

ユーザ一覧取得はCognitoのクライアントとしての接続方法は見つけられず、IAMでのアクセスとなる
(実案件ではCognitoのメンテナンス目的でしか使わないかも、しかし今回は最初の一歩ということでここから始めてみることとする)

# AWS Cognitoユーザープール
1. aws.amazon.comにサインアップ/ログイン
1. コンソールのホームからCognitoサービスへ移動
1. [ユーザープールの管理]押下
1. [ユーザープールを作成する]押下
1. ステップ1 サインインエクスペリエンス
1. サインインオプション:Eメールのみ
1. 他:デフ

元記事を表示

CircleCI に登録している secrets を確認する

## はじめに

最近、 CircleCI に登録していた secrets を確認することがありました。
CLI tool の [CircleCI-Env-Inspector] が公開されていたのでその使い方を記載します。

## [CircleCI-Env-Inspector] について

CircleCI に登録している secrets を出力する Node.js 制の CLI tool です。

https://github.com/CircleCI-Public/CircleCI-Env-Inspector

出力出来る secrets は以下 3つです。

– Organization に定義する “Context variables”
– Project に定義する “Project environment variables”, “Project SSH keys”

### 準備

[CircleCI-Env-Inspector] を実行するためには以下が必要です。

– (必須) CircleCI Personal API Token
– Docker, Shell

元記事を表示

オンラインゲーム開発に向けて

エンジニアになるために友人とゲーム開発をする計画を立てているが、全くの無知からのスタートである少しの段差でも躓いている。

ゲームと言ったらやはりオンラインでマルチプレイが出来るものを想像する。
友人と計画したゲームはネプリーグであるクイズに対して複数人で1文字ずつ答えるというマルチプレイを想定したものだ。

はじめはUnityでの実装を考えたが、Unityは多機能なゲーム開発が可能な分オンラインゲームを最初に開発しようと言うのは中々に愚かな話だ。

そこで、socket.ioを用いてJavaScriptで開発するという手段を取ることにした。

この手段に至る理由は大きく3つである。

・JavaScriptの学習が容易であるという点。
・我々が作成するゲームがJavaScriptで十分作成可能であるという点。
・socket.ioは比較的日本語の情報があるという点。

友人と私はJavaScriptの学習を済ませたばかりである。また、1から学ぶのはモチベーションにつながらない。
Unityは後々学ぶにしても1回ゲームを作りたいのである。
我々が目指すゲームが複雑な処理が不要であり、J

元記事を表示

GridDBを用いた小惑星の地球への距離の解析

今回は、小惑星が地球にとって危険かどうか、つまり、軌道を外れて地球に降り、住民に危害を加えるかどうかを科学者がどのように判断しているかをGridDBを使って解析してみます。

ソースコードの全文はこちらでご覧いただけます。

## GridDBを使ったデータセットのエクスポートとインポート

GridDBは、高いスケーラビリティと最適化を実現したインメモリNo SQLデータベースで、特に時系列データベースにおいて、より高いパフォーマンスと効率性を実現するための並列処理を可能にします。今回はGridDBのnode jsクライアントを使用し、GridDBとnode jsを接続し、リアルタイムにデータをインポートまたはエクスポートすることができます。

これらは、我々のデータセットに存在する列です。

1. id : NASAの科学者がつけた小惑星のID。
2. new_name : NASAの科学者がつけた小惑星の名前。
3. est_diameter_min :

元記事を表示

【Firebase】エミュレーターの忘備録

# 忘備録の趣旨

僕は普段、仕事のプロジェクトではReact NativeとFirebaseを使って開発を行っています。

React NativeとFirebaseを使って開発を行うときは、FirebaseのエミュレーターであるFirebase Local EmulatorSuiteを使って開発を行います。

この記事では、どのようにローカルでエミュレータを起動しているかと、どのようにアプリからエミュレータに接続するのかを、将来の自分のためにまとめようと思います。

# Firebase Local EmulatorSuiteを起動する手順

まずは、プロジェクトをビルドします。

“`shell
yarn build
“`

`GOOGLE_APPLICATION_CREDENTIALS`環境変数に、サービスアカウントファイルのパスを指定しながら、`firebase emulators:start`コマンドを実行してエミュレータを起動します。

“`shell
GOOGLE_APPLICATION_CREDENTIALS=’./path/to/serviceAccountK

元記事を表示

Rails(6系)のマイナーバージョンを上げる手法(メモ)

# はじめに
筆者の環境は以下のとおりです。(テンプレート)
 ・VSCodeを使用(CLIでWindows Terminalを利用する場合があります)
 ・Windows10にてWSL2でUbuntu20.04LTSを使用
 ・Bash、Git、asdfを使用

Rails6.0系からRails6.1系にマイグレーションする際、職場の先輩から教わった
Ruby(+bundler再インストール)及びNode.js(+yarn再インストール)のアップデート
+Railsマイグレーションの流れをメモ書きします。

あくまで __メモ書き__ なので過度な期待はしないでください。

■バージョンの呼称方法例
 ・〇〇(ツール名) XX(メジャー).XX(マイナー).XX(パッチ)

■バージョン読み方参考サイト

https://dev.classmethod.jp/articles/versoning-with-pictures/

## 共通する注意点
・「環境の変更」というリスクが高い作業を行うため、gitで管理している場合に
  main(master)ブランチやdevelopブ

元記事を表示

AWS SDK V3 のSNS(Simple Notification Service)で、いくつか動作確認した話(AWS SDK V2 → V3 移行Tips)

# はじめに

https://qiita.com/Syoji_Yonemoto/items/f96a4d10b05715e95d1c

引き続いて、今度は、SNS(Simple Notification Service)についても確認しました。
と言っても、それ程、確認したメソッドは多くありません。

# 結論
SNS(Simple Notification Service)に関しては、私が普段使うメソッド群については、問題ありませんでした。
やはり、Firehoseだけが罠だったのでしょうか、、、

# V2 と同じ使い方で問題なく動作確認できたメソッド

+ subscribe
+ publish

# 余談
subscribeが、「何故あるのか?」というネタ話。その昔、SNS(Simple Notification Service)にLambdaをsubscribeするのに管理コンソールからは、「一覧に表示された100件の中からしか選択できない。」というイケてないUIだった時代があって、LambdaからARNを指定して、subscribeを追加するという運用をしていた時期が

元記事を表示

OTHERカテゴリの最新記事