- 1. 【Express】express-generatorで作成した雛形でHTTPSサーバーを起動する【Node.js】
- 2. NodeのVersionUP
- 3. Node.js: setTimeout の使い方
- 4. blastengineのバルクメール編集リミットに達した場合の対応
- 5. express-validatorでJSONのデータ型をチェックする
- 6. 【React】React+Expressの構成でpostを実行する
- 7. Bun, Deno, Go, Node, Rust, Zig: ベンチマーク
- 8. node.jsインストール(nvm for Windows)
- 9. GitHub ActionsでJestを自動実行しよう!Cacheを使ったパッケージのインストールの高速化も解説
- 10. ElasticBeanstalk の環境を Node.js12 から 16 にアップデートする際の躓きポイント
- 11. Node http-serverの使い方
- 12. Twitterで自動投稿する雛形-#脱TwitterAPI。
- 13. nodeのDockerイメージのタグについているalpineとかslimが意味するもの
- 14. Node.js 18以降のSlim/Alpine版Dockerイメージ内からHTTPの疎通確認をワンライナーで行う
- 15. SPFx環境構築
- 16. Node.js で pandas ライクなデータ処理を行う
- 17. Geolonia Mapsを画像でダウンロードして著作権表示して使う方法
- 18. Mock Service Workerを使ってサーバレスでE2Eテストを実施する
- 19. フロントエンド開発でMock Service WorkerをサーバサイドAPIモックとして使う
- 20. node.jsでGZIP圧縮された複数のログファイルを処理
【Express】express-generatorで作成した雛形でHTTPSサーバーを起動する【Node.js】
## 概要
やることとしては、いつもの雛形に
①証明書配置用のディレクトリを作成して秘密鍵と証明書を配置
②bin/wwwを修正してhttpsサーバーを作成
の2点のみ。## 環境
– Node,js:18.12.0
– npm:9.2.0
– Express:4.18.2
– EJS:3.1.8(別に必要ない)## 雛形を作成
いつものやつ(テンプレートエンジンはejs)。
“`
$ npx express-generator –view=ejs <アプリ名>
$ cd <アプリ名>
$ npm install
“`
## SSL証明書を配置
証明書配置用のディレクトリを作成し、
“`
$ mkdir .ssl
“`
秘密鍵と証明書を配置。
※証明書の作成方法は割愛
“`
$ ls .ssl
server.crt server.key
“`
## bin/wwwの修正
fsとhttpsのモジュールを追加して、HTTPSサーバーを作成するように修正する。
express-generatorがvarで書いてるから、なんとなくvarで書く。
“`javascrip
NodeのVersionUP
“`
sudo npm install -g n
sudo n stable
“`このコマンド。
参考記事:https://qiita.com/kerupani129/items/60ee8c8becc2fe9f0d28
Node.js: setTimeout の使い方
## プログラム
“`js:timeout_test.js
#! /usr/local/bin/node
// timeout_test.js
//
// Feb/08/2023
//
// —————————————————————
‘use strict’
// —————————————————————
function first_function(aa,bb)
{
console.error(“This is the first function”)
console.error(“aa = ” + aa)
console.error(“bb = ” + bb)
const sum = aa + bb
console.error(“first: sum = ” + sum)
}// —————————————————-
blastengineのバルクメール編集リミットに達した場合の対応
blastengineはエンジニアフレンドリーなメール送信サービスです。メールを即時配信するトランザクションと、一括配信するバルクメールに対応しています。
バルクメールでは、まずテンプレートを保存します。そして、そのテンプレートに対して宛先情報を登録して送信を行います。その際、以下のようなエラーメッセージが出る場合があります(エラーメッセージは加工済み)。
`Exception: Error in main: number of EDIT statuses exceeds 10.`
これは、EDIT(メール送信されていない状態)のメールテンプレートは10個までしか保存できないことに起因して発生するものです。こうした状態のメールは適宜削除、または送信処理を行う必要があります。
## 削除対応について
今回はNode.js SDKを使って削除してみます。インストールは `npm` コマンドで行います。
“`
npm i blastengine
“`### ライブラリのインポート
ライブラリをインポートします。TypeScriptなので、実行時には `ts-node`
express-validatorでJSONのデータ型をチェックする
## 要旨
JSON形式のリクエストボディについて`express-validator`でデータ型をチェックする場合、以下のようにvalidatorを実装する。“` json
{
“string”: “abc”,
“int”: 123,
“float”: 123.456,
“boolean”: true,
“object”: { “key”: “value” },
“array”: [“a”, “b”, “c”]
}
“`“` js
[
// 文字列
body(‘string’).isString(),
// 数値(整数)
body(‘int’).isInt().not().isString(),
// 数値(浮動小数点数)
body(‘float’).isFloat().not().isString(),
// 真偽値
body(‘boolean’).isBoolean({ strict: true }),
// オブジェクト
body(‘ob
【React】React+Expressの構成でpostを実行する
## 構成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2884542/f858b075-bdb1-9e2c-3ba3-1230793c7979.png)ReactのApp.tsxからnode+expressで作っている、バックエンドにpostをするイメージです。
バックエンドはMySQLと繋がっています。## コード
“`typescript:App.tsx
const App = async () => {
try {
await axios.post(“http://localhost:3100/api”, {
date: “2023/02/07”,
id: 1,
name: “name”,
});
} catch (error) {
console.error(“error=” + error);
}
};
“`“`typescript:inde
Bun, Deno, Go, Node, Rust, Zig: ベンチマーク
# Bun, Deno, Go, Node, Rust, Zig: シンプルな Web Server ベンチマーク
## イントロ
vim-jp slack の #lang-go で、Go vs Node が土日に繰り広げられていました(月曜日気づいた)。
mattn さんが、Go と Node の速度を比較するベンチマークを書いていたので、それを bun, deno, go, node, rust, zig で書いてみました。
(zig わからないので未完成です ?)https://github.com/ekusiadadus/bench-web-server
## ベンチマーク
| Language | Requests per second | Time per request |
| :——- | :———————- | :—————- |
| bun | 11793.40 [#/sec] (mean) | 0.848 [ms] (mean) |
| deno | 32913.58
node.jsインストール(nvm for Windows)
# 前提
Windowsにnode.jsをインストールする。
nvmを使ってインストールすることでnode.jsのバージョンを切り替えられるようにする。現時点、node.jsのバージョンは16.xを使うこととする。
理由 : AWS Lambdaでサポートするランタイムが `Node.js 16` までだから。マイナーバージョンはプロジェクトで利用の関係上、後述のバージョンとする。
## 入手
– https://github.com/coreybutler/nvm-windows
– nvm-setup.exe## インストール
インストーラファイルを実行して以下の画面のように設定を進める。
![nodejsinstall01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/224453/0f21430b-7fc7-9787-6961-a3010c045af9.png)
![nodejsinstall02.png](https://qiita-image-store.s3.ap-
GitHub ActionsでJestを自動実行しよう!Cacheを使ったパッケージのインストールの高速化も解説
## 前提
– GitHub Actionsの基本的な用語についてある程度理解している
– NodeJSを使用
– パッケージマネージャーはnpmを使用
– Jestを使用## 必要なファイル一覧
以下のファイルを編集していきます
“`
❯ tree
.
└── .github
└── workflows
└── test.yml
“`## ワークフローの作成
.github/workflows/test.ymlにテストの自動実行までの処理を記載していきます
“`yml:.github/workflows/test.yml
# アクション名
name: Jest# タイミングを指定
on:
pull_request:
types: [opened, reopened, synchronize, ready_for_review]
branches-ignore:
– “release/**”
– “doc/**”jobs:
Test:
name: Run test codes
ElasticBeanstalk の環境を Node.js12 から 16 にアップデートする際の躓きポイント
# はじめに
フルカイテンではフロントの WEB サーバ構築に ElasticBeanstalk を使用しており、Node.js 12 系で開発を行っていました。
しかし ElasticBeanstalk の Node.js12 プラットフォームは2023/02/01 時点で既に EOL を迎え、 リタイア状態となっています。
環境を複製できなかったり、セキュリティ面でのサポートも切れているため、早期に開発環境の Node.js バージョンアップと EB の Node16 プラットフォームを使用した新しい環境を作成する必要がありました。
実際に作業を行うと色々と躓いたポイントがあったため、本記事ではその具体的な内容と解決策を紹介します。# 本記事の対象読者
– ElasticBeanstalk(Node.js@12 Platform) で WEB サーバを構築している
– Node.js のバージョンを12系から16系にアップデートする予定がある# バージョンアップ時の躓きポイント
## (1) 環境のクローンができない
Beanstalk のプラットフォームのブランチアップデ
Node http-serverの使い方
## パッケージインスコ(グローバルインストール)
“`
npm i -g http-server
“`サーバー起動(事前にhtmlファイルを設置してください。)
“`
http-server .
“`ポート指定
“`
http-server . -p 8080
“`## パッケージページ
https://www.npmjs.com/package/http-server
Twitterで自動投稿する雛形-#脱TwitterAPI。
## エンジニアに悲報としか言えない今回の発表・イーロン・マスク氏って?
2月9日でTwitterAPIが無料で使えなくなるのでその対応をしないといけない。
そんなエンジニアさんもいらっしゃると思います、お疲れ様です?。APIサービスに月、1万円払えないという会社は中小企業には多いと思います、
それで取引を解消される企業とかもあったりするかも。そんな方は一個VPSサーバーを構えてNodeJSをインストールして
下記の雛形コードを元にゴニョゴニョしたら何とかなるかも知れません?。因みにこれはchatGPTとの合作だったりします。
> – [x] 動作保証はしません。HTMLコードが変われば動くなります。尚、これは雛形ですので、これに細工をして常時接続でTweetやRTするようにコードを変更しないといけません、もしくは時間を置いてTweetするなど。
“`
node sample.js ‘username’ ‘password’ ‘テスト投稿’
“`“`javascript:sample.js
const pup
nodeのDockerイメージのタグについているalpineとかslimが意味するもの
# 概要
– nodeのDockerイメージのタグ名についているalpineとslimが意味する物を知らなかったのでまとめてみる。
# `node: バージョン名`のタグ
– このイメージが最も一般的なイメージらしい。「迷ったらこれ使っとけば万事オッケー」的なことが公式にも書いてあった。
– 「迷ったらバージョン名だけのイメージを選択する」は鉄則っぽい。# `node: バージョン名-bullseye`もしくは`node: バージョン名-buster`のタグ
– bullseyeやbusterはDevian(Unix系ディストリビューションを作成しているプロジェクト)がリリースしているDebian GNU/Linuxディストリビューションのバージョンと紐づくスイーツコード(開発コードネーム)らしい。イメージがどのDebian GNU/Linuxディストリビューションをもとに作られているかがわかる。
– `node: バージョン名-bullseye`はDebian 11.0(bullseye)をもとにしている。
– `node: バージョン名-buster`はDebian 1
Node.js 18以降のSlim/Alpine版Dockerイメージ内からHTTPの疎通確認をワンライナーで行う
[Node.js公式Dockerイメージ](https://hub.docker.com/_/node)のうち、[Slim版](https://hub.docker.com/_/node/tags?page=1&name=slim)や[Alpine版](https://hub.docker.com/_/node/tags?page=1&name=alpine)には `curl` も `wget` も[入っていない](https://github.com/nodejs/docker-node/issues/1185)。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63934/002ca289-0606-e7d3-a556-a1e1225041bb.png)
よってコンテナ内からHTTPサーバーの疎通確認・死活監視などを行う際にこれらを使った方法は採用できない。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amaz
SPFx環境構築
# はじめに
SPFx(SharePoint Framework)は、SharePointのカスタマイズおよび拡張モデルです。フレームワークに依存せず、人気のJavaScriptフレームワーク(React、Handlebars、Knockout、Angular、Vue.js、その他) を使用できます。
本記事は、SPFx開発環境構築の備忘録です。
# 目次
1. [事前準備](#Chapter1)
1. [Sheapoint内に任意のサイトを作成](#Chapter2)
1. [yaoman、gulpをインストール](#Chapter3)
1. [yaomanジェネレータをインストール](#Chapter4)
1. [最初のプロジェクトを作ってみる](#Chapter5)
1. [参考文献](#reference)
# 事前準備
– NodeJSがインストールされていることを確認する
下記のコマンドを実行して確認できます。(v14.19.2みたいにバージョンが出てくればOK)
“`bash she
Node.js で pandas ライクなデータ処理を行う
# Pandasとは?
pandas は python でデータ処理を行う時に、大変優れた機能を提供してくれるライブラリです。
csv の読み込みはもちろん、DBからの読み込みも可能ですし、
メソッド一つで統計量の計算、結合処理までやってくれるスグレモノなんです。
ですがこれ、pythonでしか使えないんです。
しかし!!それを解決してくれる素晴らしいライブラリがありました!!# その名はDanfo
それがこのDanfo.jsです。
https://danfo.jsdata.org/Danfo.jsはオープンソースライブラリで、pandas ライブラリに大きく影響を受けている、
と書かれています。
つまり、Node.jsでpandasのノウハウを使えるということです。これは素晴らしい。# 使い方
Nodeでのインストールは以下
“`
npm install danfojs-node
“`
特に難しいこともなくインストール可能です。使用方法は、
https://danfo.jsdata.org/getting-started
に詳しく書いてあります。それではよき統
Geolonia Mapsを画像でダウンロードして著作権表示して使う方法
# 概要
地図アプリを開発していますが、たくさんの地図画像が必要になりました。
「Python 用ライブラリの staticmap を使って OpenStreetMap の画像を取得する」方法を使っていましたが、Leaflet地図のデザインが今一つ(すみません。個人の主観です)なので、別の地図画像を探していました。Geoloniaさんの地図は、月20,000回まで無料で地図を表示できますし、開発環境なら制限を気にせず無料で使えるので、ありがたいです。デザインも素晴らしく、こちらを使わせていただくことにしました。
[Geolonia 料金](https://geolonia.com/pricing/)
最初はcanvasをtoDataUrlメソッドで取得できると考えていましたが、透明な画像しかキャプチャできず困っていました。Geoloniaの中の人に相談したら、「@geolonia/mbgl-export-control」というパッケージを紹介してもらいました。Geolonia Mapsの画像をダウンロードする方法を解説します。Node.jsを使って実装していきます。
# 環
Mock Service Workerを使ってサーバレスでE2Eテストを実施する
## 概要
– [前回](https://qiita.com/tenda_ryo_y/items/4ee8e7b05b026fc985e5)は[Mock Service Worker](https://github.com/mswjs/msw)(以下MSW)のデモを使って仕組みを見ていきました
– 今回も同デモを使用してE2Eテストの流れを見ていきます## 準備
[前回の記事](https://qiita.com/tenda_ryo_y/items/4ee8e7b05b026fc985e5)を参考にMSWのデモ用ブランチからローカルに実行環境を用意してください。## E2Eテストコードを見てみる
E2Eテストコードは **examples/rest-react/e2e** に格納されています。MSWはテストスクリプトに仕込むmockと異なり、ブラウザのリクエストをインターセプトする仕組みなのでテストコードに専用の実装を施す必要はありません。またJavascriptのアセットである[Service Worker API](https://developer.mozilla
フロントエンド開発でMock Service WorkerをサーバサイドAPIモックとして使う
## 概要
– サーバサイドAPIはまだ実装されてないけど、Webフロントエンドの実装を進めたい
– 顧客に見せるために作成したモックの実装を、できるだけ実際の実装に流用したい
– E2Eテストの為だけにビジネスロジックとは関係のない実装を入れたくない
– Mock Service Workerを使えばそんなお悩みを解決できます## Mock Service Workerとは
Service Worker APIを利用してブラウザのリクエストをインターセプトすることで、サーバサイトAPIの振る舞いを模倣するモックを構築できるフレームワークです。[JSON Server](https://www.npmjs.com/package/json-server)のようなモックサーバフレームワークとの違いは、単独のサーバを起動するのではなく、Service Workerを常駐してブラウザのリクエストのインターセプトすることでモック用のレスポンスを返却する仕組みになっている点です。
[MDN – Service Worker API](https://developer.mozilla.o
node.jsでGZIP圧縮された複数のログファイルを処理
# 目的
* Apacheログなど、GZIPされた複数のログ(テキスト)ファイルを処理する時のサンプル
* すべてのログをなめてから処理をしたい場合に、非同期のせいで勝手に次のステップに進むのに悩まされた
* 大容量のログファイルに対応するため、1行ずつデータを読み込む処理にした# コード
## 処理内容
* 指定したディレクトリにあるGZIPファイルの一覧を生成
* 一覧にあるファイルをひとつずつ開いて処理、分析に必要なデータはグローバル変数に追加
* ファイルを全部読み終わったら適宜処理“`javascript
“use strict”;/*
* Modules
*/import fs from ‘fs’;
import log4js from ‘log4js’;
import zlib from ‘zlib’;
import readline from ‘readline’;
import { format } from ‘util’;/*
* Config
*/const SRC_FILE_DIR = “./src_files”;
/*
* Log