- 1. 【小ネタ】Node.js v21.7.0 の新機能で環境変数用のファイル読みこみを軽く試す: process.loadEnvFile()
- 2. 【AWS】Pinpointの通知をLambdaで設定する(キャンペーンを作成する)
- 3. ESP32で気兼ねなくHTTPS通信する
- 4. Slack の CLI と無料サンドボックス環境でサクサク快適開発
- 5. Node.jsでCSVファイルを読み込む方法
- 6. VirtualBox 環境で node.js を実行すると、「Assertion failed: new_time >= loop->time, file c:\ws\deps\uv\src\win\core.c, line 327」のエラーが発生する
- 7. 14.仮想通貨自動売買プログラムを作る(1) | TypeScript入門講座
- 8. Node16.20.2環境でhusky+lint-stagedを使ってlinterを自動化する(no use prettier)
- 9. Angularのインストール~最小限構成の設定手順
- 10. npmとnpxの違い
- 11. MacOS の PC 上に開発環境を構築する
- 12. 【MacOS】シェルスクリプトでミリ秒単位まで取得する方法4種紹介 (gdate, python, perl, node.js)
- 13. WindowsでのAngular環境構築(Node.jsのインストール~Hello Worldまで)
- 14. Mac(M1)のnodeバージョンアップ
- 15. Playwright 入門
- 16. huskyのv8とv9の違いを確認しつつ、npm scriptsを理解する
- 17. passport.jsでユーザー認証を実装してみた
- 18. WebSocketをローカルで試す
- 19. node.js で VRT – PlayWright で Webページにアクセスしてスクリーンショットを撮影し、reg-cli で差分レポートを出力する例
- 20. Javascript Registry (JSR) とは
【小ネタ】Node.js v21.7.0 の新機能で環境変数用のファイル読みこみを軽く試す: process.loadEnvFile()
今回の記事は、記事執筆時点での Node.js の最新バージョンである v21.7.0 の新機能の話です。
●Node.js — Node v21.7.0 (Current)
https://nodejs.org/en/blog/release/v21.7.0![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/a2a69d3c-0dc3-de7e-9c5c-6c6e3a577095.png)
新機能はいくつかあるのですが、その中でも、「process.loadEnvFile(path)」という項目の話です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/50868/772580e7-0bc7-fe7d-57cd-a7a694e29d5f.png)
## サクッと試す
それでは、軽く試していきます。### path の指定なし
以下のファイルを用意して試してみます。
【AWS】Pinpointの通知をLambdaで設定する(キャンペーンを作成する)
## Pinpointがリファレンス通りに動いてくれなかった話
::: note warn
注意:この検証を行なったのは 2023年2月17日 です
:::### 時間指定のプッシュ通知を作成するための 3つ のパラメータ
以下3つです
“`node.js:
startTime : ‘YYYY-MM-DDThh:mm+09:00’ // *1
Timezone : ‘UTC+09’ // *2
isLocalTime : false // *3
“`#### *1 startTime | プッシュ通知を行う時間を指定
ISO 8601 を厳守する必要があります
– 通知したい時間を `YYYY-MM-DDThh:mm`(2024-03-09T09:06)と記載
– 末尾に日本時間を意味する `+09:00` を記載#### *2 Timezone | 時差を表す値を入れる
~~リファレンスには「TimeZone」と書かれてますが「Timezone」が正しいです。現在は修正されていました~~
これを指定しないと **日本から9時間遅れ** で通知されます
ESP32で気兼ねなくHTTPS通信する
ESP32でHTTPS通信はできなくはないですが、かなりメモリを消費するため、結構不安定だったりします。
また、HTTP通信といっても、GETやPOSTの中でも、単にJSONをBodyに含めたものだけでなく、multipart/form-dataであったり、application/x-www-form-urlencodedであったり、送信方式にも種類があります。それをESP32の中でそれぞれ実装するのは面倒です。そこで、HTTP通信をHTTPS通信にブリッジしてくれるサーバを別途用意することで、ESP32ではTLS通信を意識する必要がないようにします。
また、ESP32とブリッジサーバとの通信方式はJsonをボディとしたHTTP POST通信に限定し、ブリッジサーバにて各種Content-Typeに合わせてその先のHTTPS通信をしてくれるようにすれば、HTTP Post(JSON)だけを実装すればよいので楽になります。![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/261826/
Slack の CLI と無料サンドボックス環境でサクサク快適開発
こんにちは、Slack の[公式 SDK 開発](https://github.com/slackapi)と日本の Developer Relations を担当している瀬良 (@seratch) と申します :wave:
## サンドボックス環境が使えるようになりました
米国時間 3/6 にサンフランシスコで開催された TrailblazerDX にて、Slack の新しい開発者向けサポート機能が発表されました。
https://slack.com/intl/ja-jp/blog/developers/developer-program-launch-jp
Bolt for Python / JavaScript でのカスタムファンクションなどのトピックもあるのですが、この記事ではこれまでよりもはるかに簡単な取得・管理が可能となった Enterprise Grid の**サンドボックス環境を使ったローカル開発の方法**について紹介したいと思います。
## 何が嬉しいの?
今までの Slack アプリ開発は、最初に以下のような手順が必要でした:
* https://api
Node.jsでCSVファイルを読み込む方法
# はじめに
`Node.js`でCSVファイルを読み込む実装をしたので、備忘録として記事にしたいと思います。
`TypeScript`で実装しているので、`Node.js` + `TypeScript`で、CSV読み込みを実装したい方の参考になれば幸いです。# 必要なパッケージをインストール
`csv-parse`を使うので、以下をターミナルで実行してください。
“`bash
npm install csv-parse
“``Node.js`でCSVファイルを読み込むパッケージはいくつかあるそうです。
気になる方は以下をご参照ください。https://qiita.com/t-yama-3/items/ab488c5a026de3cc92ab
# CSVを作成
“`
ts_demo // プロジェクトのルート
├ dist // コンパイルしたjsファイルを格納
├ src // tsファイルを格納
├ package.json // package.json
└ users.csv // 読み込む
VirtualBox 環境で node.js を実行すると、「Assertion failed: new_time >= loop->time, file c:\ws\deps\uv\src\win\core.c, line 327」のエラーが発生する
# はじめに
掲題の通り、node.js でのビルドや実行時にエラーになることがあるようです。
私が発生したときの環境は以下の通りです。| | バージョン |
| —- | —- |
| VirtualBox | 7.0.10 |
| ゲストOS | Windows10 |
| node.js | 20.9.0 |
| npm | 10.1.0 |ネットで検索すると、
・node.jsをバージョンアップすると直った。
・時計を同期したら直った
・WSLでやればOKなどと出てきましたが、今回はこれでは解決しませんでした。
よく見たら、上記の記事はエラー発生の行数も違うようですので(「line 327」ではない)、別件のようです。# 解決方法
以下の掲示板にあった通り、VirtualBoxの設定で、「Enable Hardware Clock in UTC Time」を有効にすれば回避できるようになりました。https://github.com/nodejs/help/issues/2470
![image.png](https://qiita-ima
14.仮想通貨自動売買プログラムを作る(1) | TypeScript入門講座
https://youtu.be/geYY9OJ7lH0?si=mNcJs21_bELxO6rW
Node16.20.2環境でhusky+lint-stagedを使ってlinterを自動化する(no use prettier)
# 背景
Gitへのコミット時に、linterのルールに則ってないコードを弾きたい。
業務でNode16.20.2指定の環境だったので、最新の導入記事が参考にならない。
また、巷の記事ではセットでprettierを使って自動整形をしているが、意図しない変更が加わるため無駄な変更を増やしたくない。
コードの整形はESlintでカバーできない範囲は手動で行いたいのでprettierは利用したくない。# 使用モジュール(執筆当時の最新バージョン)
– husky@8.0.3(9.0.11が最新版)
– lint-staged@14.0.1(15.2.2が最新版)ひとまずNode16に対応しているかで上記バージョンを選択
# 設定手順
### 1. モジュール類のインストール
“`sh
$ npm i –save-dev lint-staged@14.0.1
$ npm i –save-dev husky@8.0.3
“`### 2. huskyのセットアップ
下記サイトが参考になった。ありがとうございます。https://zenn.dev/g_okawara/art
Angularのインストール~最小限構成の設定手順
Angularのインストール、Angular Material導入、HttpClient導入手順を解説します。
## Angularの導入
### Angular の特徴
– TypeScriptをベースとしている
– SPA(single-page-application)を実現するフレームワークの一つ
– テンプレートシステム(html/CSS)の実現
– 双方向データバインディング(html – JavaScript)
– コンポーネント指向### Node.js インストール
[Nodeダウンロードサイト](https://nodejs.org/en/download/)
### Angular インストール
[Angular setup](https://angular.io/guide/setup-local)
“`sh
npm install -g @angular/cli
ng version
“`👇記事執筆時点の出力です。
“`text
_ _ _
npmとnpxの違い
日頃の業務開発で気づいたこと、わからなかったことを超簡潔にメモ的なことを残していくシリーズ。
その名も「(後で考える)」# 今日のお題
`npm`と`npx`の違い# 結論
`npm`はパッケージ管理。
`npx`はインストールなしでのパッケージ実行# 解説
### npm
`npm`は`node package manager`でパッケージの管理を目的としている。
`package.json`に記載されているインストール済みのパッケージを指定して利用したい場合に使用する。
npmでインストールされたものはnpmを利用して実行される必要がある。
“`sh
$ npm install –save {xxxx}
$ npm run {xxxx}
“`### npx
`npx`は`node package executer`で、パッケージの実行を目的としている。
npmとの大きな違いは、__パッケージをインストールせずに直接実行できる__ というところ。
特にプロジェクト作成時に一回だけ実行したい場合や、linter系のその場だけ実行するもの等が該当しやすい。
“`s
MacOS の PC 上に開発環境を構築する
AppleSilicon の Mac mini (macOS Sonoma) に Node.js + Next + Typescript の開発環境を構築する手順です。
次の順でインストールしていきます
## コマンドラインデベロッパツール (Command Line Tools for Xcode)
– バージョン確認
“`
m@mopnoMac-mini ~ % git –version
xcode-select: note: No developer tools were found, requesting install.
If developer tools are located at a non-default location on disk, use `sudo xcode-select –switch path/to/Xcode.app` to specify the Xcode that you wish to use for command line developer tools, and cancel the installation dial
【MacOS】シェルスクリプトでミリ秒単位まで取得する方法4種紹介 (gdate, python, perl, node.js)
# 概要
MacOSにてシェルスクリプトを使ってAPIコールを行うと以下のように出力されます(`curl`コマンドの進行状況)。
この時、TimeSpentがミリ秒で欲しいなと思い、シェルスクリプトで表示されるように実装しましたので紹介します。“`
$ sh ./api_request_xxx.sh http://xxxx/api/
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
100 62083 100 60043 100 2040 4315 146 0:00:13 0:00:13 –:–:– 16347
“`全部で4種類あります。
# 前提
以下みたいにすれば取得できるんじゃ?と思っていましたが、これではできませんした。
“`sh
START_TIME=$(date
WindowsでのAngular環境構築(Node.jsのインストール~Hello Worldまで)
## Node.jsのダウンロード
以下サイトで最新バージョンのダウンロード。
https://nodejs.org/en/downloadWindowsの一番上をポチっと。
## Node.jsのインストール
画面に従いNextを押下していく。
※今回はすべてデフォルト。## バージョンとnpmの確認
コマンドプロンプトで以下のコマンドで確認できる。
“`
Node –version
npm –version
“`◆参考
## Angularの最新をインストール
以下のコマンドを実行する。
“`
npm install -g @angular/cli
ng version //確認
“`バージョンはこの通り。
“`
Angular CLI: 17.2.2
Node: 20.11.1
Package Manager: npm 10.2.4
OS: win32 x64
“`## 統合開発環境(IDE)のインストール
Visual
Mac(M1)のnodeバージョンアップ
## 背景
nodeのバージョンをあげずに放置していたらv16系だったので、バージョンをあげることにしました。
その際のまとめです。## 現在のバージョン確認
### Homebrew
“`
$ brew -v
“`### nodebrew
“`
$ nodebrew -v
“`### Node.js
“`
$ node -v
“`### npm
“`
$ npm -v
“`## バージョンのアップデート
### Homebrew
“`
$ brew update
“`終わったらちゃんと上がっているか先ほどのコマンドでバージョン確認。
### nodebrew
“`
$ brew upgrade nodebrew
“`自分の場合はここでエラーが出ました。
“`
Error: Failure while executing; `/usr/bin/env cp -pR /private/tmp/d20240303-30797-co2iaz/nodebrew/. /usr/local/Cellar/nodebrew`
Playwright 入門
# はじめに
この記事では、E2E テストツールの Playwright の概要や基本的な操作方法について記載します。https://playwright.dev/
# Playwright の概要
Playwright は、Microsoft で開発が行われている E2E テストツールです。2020年にリリースされました。
複数ブラウザ・プラットフォーム・言語で利用可能などの特長があります。他の E2E テストツールとしては、Cypress、Puppeteer などがあります。
Playwright は、2023年の後半から利用者数が伸びているようです。![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/318188/774db41f-bd67-5603-6323-c6d361e2cf3c.png)
https://npmtrends.com/cypress-vs-playwright-vs-puppeteer-vs-selenium-webdriver-vs-testcaf
huskyのv8とv9の違いを確認しつつ、npm scriptsを理解する
# 概要
husky がずっとv4のプロジェクトがあるので、 Node.js のバージョンアップに合わせてアップデートをしようとしました。
2024/1/25にv9.0.1がリリースされていたので違いを確認しつつ、 npm について理解したことをまとめます。# v8とv9の違い
Release Notehttps://github.com/typicode/husky/releases/tag/v9.0.1
v9に変わり、インストール時のコマンドが一つで済むようになり、 .husky/pre-commit もシンプルになっています。
例えば、v8のインストール手順のコマンドは以下です。
“`bash
npm pkg set scripts.prepare=”husky install”
npm run prepare
npx husky add .husky/pre-commit “npm test”
“`v9では上記のコマンドは以下で全て実行されます
“`bash
npx husky init
“`他には、v9にあたり Node.js のv14とv16
passport.jsでユーザー認証を実装してみた
## はじめに
Passportは、認証や認可を簡単に実装できるNode.js用ミドルウェアです。
非常に柔軟なPassportはExpressベースのWebアプリケーションで利用できるため、ローカル認証やTwitter、FaceBookなどの外部認証にも使用されます。
今回はその中のローカル認証機能を実装していきます。・使用するライブラリのインストール
“`zsh:zsh
npm install passport passport-local bcrypt express-session
“`## ストラテジの設定
はじめに、ストラテジの設定を行います。新しく`config`フォルダを作成し、その下の`passport.ts`ファイルに設定内容を記述します。“`typescript:config/passport.ts
import passport from “passport”;
import { Strategy as LocalStrategy } from “passport-local”;
import { PrismaClient } from “@
WebSocketをローカルで試す
仕事でwebsocketを使って試験をする必要があるということで、やり方を事前に調べておこうと思いました。
## ローカルでwsを立ち上げる
* まず、node.jsをインストールしておき、npm install wsにてwebsocketをインストールします
“`
// グローバルの場合は-g を付ける
npm install ws
“`* 以下の処理を 例)server.jsとして保存します
“`js
const WebSocket = require(‘ws’);// WebSocketサーバーを作成し、ポート8080でリッスンします
const wss = new WebSocket.Server({ port: 8080 });// 接続時の処理
wss.on(‘connection’, function connection(ws) {
console.log(‘新しいクライアントが接続しました’);// メッセージを受信した時の処理
ws.on(‘message’, function incoming(message) {
co
node.js で VRT – PlayWright で Webページにアクセスしてスクリーンショットを撮影し、reg-cli で差分レポートを出力する例
# 事前準備
## npm インストール
`package.json` の例
“`json
{
“devDependencies”: {
“playwright”: “^1.42.0”,
“@playwright/test”: “^1.42.1”,
“http-server”: “^14.1.1”,
“reg-cli”: “^0.18.1”
}
}
“``npm install`
## Playwright セットアップ
`npm init playwright@latest`
質問にはてきとうに Yes と答えておく
# localでWebサーバーを起動しておく
## HTML
見た目の違うページを2個用意しておく
例:
`example1.html`
`
Javascript Registry (JSR) とは
### 概要
JSRとはjavascriptのパッケージのためのレジストリです。npmやNodeとも互換性がありますが、npmを進化させたようなレジストリです。
### レジストリとは
パッケージ等を管理するストレージのようなものです。例えば `npm install lodash` をすると、通常はnpmに設定されているデフォルトのレジストリである `https://registry. npmjs.org/ ` からパッケージをインストールしようとします。ここで注意すべきはパッケージ管理ツールとレジストリは別の概念であることです。`npm`コマンドはあくまでもパッケージ管理ツールであり、`npm`コマンドを使っていても実際にパッケージをインストールしてくるストレージは自由に設定可能です。この記事で紹介しているJSRは**レジストリ**であり、したがってnpmコマンドを使ってJSRからパッケージを取得することが可能です。
例えば企業などでは独自のレジストリを管理しており、npmコマンドなどでもデフォルトのレジストリが会社の管理するものになっているケースも多いと思います。