- 1. Jira拡張機能開発(プロジェクト作成～Jiraにインストール)
- 2. Boxアプリ統合でフォルダバージョンを戻す
- 3. [ESLint] Node.jsのES Modulesで__filenameや__dirnameを使ったらエラーにする
- 4. Node.jsのutilモジュールを利用する
- 5. npxを実行した後の残骸（キャッシュ）の場所
- 6. [超初心者]yarnがインストールできない
- 7. 【Mac M1】nvmでのnode.jsバージョン管理 とyarnを追加した話
- 8. Node.jsとmysql2/promiseでqueryを使ったデータの取得
- 9. VRCから外部に情報を送信する方法（API編）
- 10. [Node.js] GitHub Actions上でgcloud CLIからFirebaseの秘密鍵を生成する
- 11. 【Node.js Axios】streamのレスポンスを扱うときの注意点
- 12. npxについて正しく理解する
- 13. stand.fmの楽曲利用申請を少し簡単にするために、楽曲利用申請アプリを作った話
- 14. aptでNode.jsが20.5.1からアップデートされなくなったのを解消した
- 15. JavaScript勉強備忘録
- 16. Node.jsでdotenvがいらなくなったっぽいので使ってみる
- 17. Homebrewでnodeとyarnをインストールする
- 18. Express+SQLite3備忘録2
- 19. Express+SQLite3備忘録1
- 20. 思い立ったが吉日なのでasdfでBunを入れてみたメモ
Jira拡張機能開発(プロジェクト作成～Jiraにインストール)
## 初めに
使い方が悪いだけかもしれませんが、Jiraって微妙に使いづらいな…と思った今日この頃。
同じことを思ったそんなあなたに、Jira拡張機能開発をお勧めします。今回はJira拡張機能ってこんなこともできるんだよということを伝えたく、
npmパッケージのforgeを使用して、ReactにてJiraの拡張機能を作成していきます。
この記事ではforgeの導入、プロジェクトの作成、JiraにDeployまでを記載します。## 開発環境
node：18.16.0## 実現方法
### forge導入～プロジェクト作成
1. forge/cliをインストールします。
“`cmd
npm install -g @forge/cli
“`
1. Atlassian API トークンを使用してログインします。
[Atlassian API token](https://id.atlassian.com/manage-profile/security/api-tokens)にて、APIトークンを発行し、以下コマンドにてログインを行います。
Boxアプリ統合でフォルダバージョンを戻す
# 概要
この記事では、Boxアプリの統合機能を使用してフォルダ内のすべてのファイルを一括で以前のバージョンに戻す方法を紹介します。
Boxは、ファイル[バージョン履歴機能](https://support.box.com/hc/ja/articles/360043697054-%E3%83%90%E3%83%BC%E3%82%B8%E3%83%A7%E3%83%B3%E5%B1%A5%E6%AD%B4%E3%81%B8%E3%81%AE%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B9)によって、過去の状態にファイルを復元することができます。
この機能は、操作ミスにより誤ったバージョンがアップロードされてしまった場合だけでなく、[ランサムウェ
[ESLint] Node.jsのES Modulesで__filenameや__dirnameを使ったらエラーにする
# ES Modulesでは`__filename`と`__dirname`は使えない
Node.jsのES Modulesでは、以下のグローバル変数は存在しないため使用できません。
– `require`
– `exports`
– `module`
– `__filename`
– `__dirname`
– `global`しかし、現状ではこれらの変数を使ったコードを**TypeScriptの型チェックで弾く方法はありません**。
詳細は以下のissueやdiscussionを参照してください。
https://github.com/DefinitelyTyped/DefinitelyTyped/issues/42201
https://github.com/DefinitelyTyped/DefinitelyTyped/discussions/66780
現在はDefinitelyTypedが対応するのを待つしかないようです。
# __filenameや__dirnameの使用をESLintで弾く
前述したように、TypeScriptの型チェックで弾くことは
Node.jsのutilモジュールを利用する
## utilモジュールとは
公式の説明では、`このnode:utilモジュールは、Node.js内部APIのニーズをサポートします。`と書かれているが、私にはよく意味がわからなかった。
→ 要は、ユーティリティ関数 (よく使う処理を簡単に呼び出せるように作成される小さな関数) を提供しているモジュールですということで良さそう。## できること
主な関数。シンプルな機能が提供されている。| Method | Description |
|:———–|————:|
| debuglog() | デバッグメッセージを出力する |
| deprecate() | 指定した関数が呼び出されたとき、非推奨としてwarningを出す |
| format() | 指定した引数に応じて文字列をフォーマットする |
| inherits() | 継承をutil.inherits(Child, Parent);の形で手軽に行える |
| inspect() | オブジェクトを文字列化
npxを実行した後の残骸（キャッシュ）の場所
## 結論から書くと
Windowsの場合、
C:\Users\ [user] \AppData\Local\npm-cache\_npx\
配下のフォルダに格納される。
なお、フォルダ名は固定されておらず、「c67e74de0542c87c」のようなハッシュ（？）されたようなフォルダに名になっている。Macの場合
（すみません。調べられてません）## どのフォルダを削除するか？
キャッシュなので全部消しても問題ないような気はする。
ピンポイントで削除したい場合については、上記の通りフォルダ名が意味を持たない英数字の羅列なので判断は難しい。フォルダのタイムスタンプおよびフォルダ内のpackage.jsonの中身を見て判断するしかない。## おわりに
npxを使えば使うほどこのキャッシュがたまっていくので（意外と容量を食っているので）、ディスク容量が少ないなら消すというのも有効な手段のひとつだろう。※削除は自己責任でお願いします！
[超初心者]yarnがインストールできない
# 目次
[1.環境](#-環境)
[2.インストール手順](#-インストール手順)
[3.背景](#-背景)
[4.エラー内容について](#-エラー内容について)
[5.試したこと](#-試したこと)
[6.結論](#-結論)
[7.解決方法](#-解決方法)
[8.yarnのインストール](#-yarnのインストール)
[9.今回のエラーで間違って試したこと](#-今回のエラーで間違って試したこと)
[10.参考URL](#-参考URL)# 環境
・Windows10
・node.js(node-v18.18.0-x64)
・Visual Studio Code# インストール手順
インストーラーは下記です。
[node-v18.18.0-x64](https://nodejs.org/ja/download)
[Visual Studio Code](https://azure.microsoft.com/ja-jp/products/visual-studio-code/)手順は下記を参考にしました。
https://qiita.com/sefoo0104/it
【Mac M1】nvmでのnode.jsバージョン管理 とyarnを追加した話
next.jsでコード書いてる時に、macを久々再起動したら
“`
The engine “node” is incompatible with this module.
“`
エラーがでる原因としては、next.jsのプロジェクトで必要としているnodeバージョンが18以上なのに
それ以下のv16が入っていたから。で、nodenvとかnodebrewとかnvmとか、nodeのバージョン管理をするには色々な方法があるのだけど、
普段nodeのバージョン変更とか滅多にしないので、前どれでやったかを忘れてしまったりする。
今回は結局nvmでやりました。# 最初に
自分の環境で行った手順です。
※Mac M1 13.2
環境によって変わりうる可能性もあるため、
・node.jsのバージョンがうまく変わらない
・node.jsのバージョンを変えたら、yarnが使えなくなった時に、うまくいかない時に試す、くらいの感覚でいていただければと思います。
※また、nvmはすでに入れている前提です。◼️nvm公式
https://github.com/nvm-sh/nvm#set-de
Node.jsとmysql2/promiseでqueryを使ったデータの取得
# はじめに
Node.jsとmysql共に初めたてなのですが、mysql2でのデータ取得ができるまでかなり時間がかかったので、データ取得の方法を共有したいと思います。# コード内容
自分の場合はcreateConnectionをうまく動作させることができなかったためcreatePoolを使っています。
またconnection.queryはそのまま使うとエラーが出るため、async/awaitを使ってconnection.queryでデータを取得しています。
“` js
const mysql = require(‘mysql2/promise’);//host,user,password,databaseの部分は接続したい先によって変えてください
const connection = mysql.createPool({
host: ‘your_host’,
user: ‘your_user’,
password: ‘your_password’,
database: ‘your_database’
});//your_tableの部分
VRCから外部に情報を送信する方法（API編）
# 初めに
今はまだ、どうあがいても動的にURLを生成(*1)したりHTTP POSTをすることは叶わない（2023/09/22時点）。しかし、“`VRCStringDownloader“`等でリクエストを飛ばすことは可能。そこで、今回はリクエストを飛ばすURLのパスやクエリパラメータを介することで情報を送る方法を紹介する。脳筋な事この上ないが、送りたい情報の**全パターンを網羅してリクエストを送れば解決**という事である。
https://creators.vrchat.com/worlds/udon/string-loading/
(*1) プレイヤーに手動でURLを入力させる場合に限り、動的にURLを設定することができる
# 今回作るもの
今回はシンプルなアンケートを作ることにする。雑だが、こんな感じ。
図のように
１．APIサーバー①でAxiosを利用してAPIサーバー②からExcelファイルを取得
２，APIサーバー①で取得したExcelファイルをサーバー上に保存
する処理を実装したときに、取得したExcelファイルを保存できず＊に結構ハマったので、備忘録として残しておきます。
（＊正しくはエクセルファイルとして保存できるが、ファイルが壊れていて開くことができない）# TL;DR
– Axiosでストリームのレスポンスを受け取る際には、Axiosのoptionsで`responseType: stream`と指定すること
– 指定しないと、レスポンスはJSON（デフォルト値）として扱われてしまう# コード（抜粋）
– APIサーバー②のExcelファイルをストリームで返すAPI
“`javascri
npxについて正しく理解する
# 目次
1. npxとは
2. ユースケース
3. 感想# 1. npxとは
– Node Package eXecuteの略
– ### ローカルにインストールされたパッケージを検索し、実行可能ファイルを見つけて実行できる
実行可能ファイルへのフルパスの入力を省略できるため、開発者は簡単かつ確実にパッケージを実行 できます。
## 実行可能ファイルとは
– node_modules/pacakge名/bin配下にあるファイルです。
– ./node_modules/.bin配下にあるのは実行可能ファイルのシンボリックリンクです。
– このシンボリックリンクはnpm install時に作成されます。
– 実際にlsコマンドを実行すると、シンボリックリンクの場所や、それが指す実際の場所を確認できます。
“`terminal
ls node_modules/.bin/prettier
node_modules/.bin/prettier
“`例えば、以下のコマンドでローカルにインスト
stand.fmの楽曲利用申請を少し簡単にするために、楽曲利用申請アプリを作った話
#### stand.fmという音声配信アプリを使ってます。
* 今回stand.fm用楽曲利用申請アプリを作った理由
* stand.fmアプリで、歌を歌った場合、楽曲利用申請という作業をユーザーが実施します。
* JASRACやNexToneなどの権利管理団体から、歌った曲の作品番号、曲名、アーティスト名、作詞者、作曲者を調べて、楽曲利用申請をします。(この作業がおっくうなんです。)
*
* 【楽曲利用申請のステップ】
【ステップ1】 歌った歌の題名をJASRACやNexToneで調べる。
【ステップ2】 stand.fm側の画面から楽曲申請ボタンを押し、楽曲申請用googleフォームを呼び出す。
【ステップ3】 googleフォームで、メルアド、JASRACかNexToneの選択、作品番号、曲名、アーティスト名、作詞者、作曲者を入力して送信。この後、ロボットチェックが必ずある。（チェックボックスをクリックするタイプではなく、写真をクリックするやつ。 僕の知識ではシステム化が無理）* 何度もやっていて、思っていたこと。 作品番号は1曲につき1つなので、作品番号が分かれば、曲名、
aptでNode.jsが20.5.1からアップデートされなくなったのを解消した
Node.js 20.6系や20.7系がリリースされているのに手元の環境のが20.5.1から更新されず不可解に思っていました。
[Nodesource Node.js DEB][nodesource-url]を訪れてみたところ、下記のように書いてありました。
どうやらdistributionを指定するのではなくnodistroを指定せよとのこと。“`shell-session
sudo apt-get update && sudo apt-get install -y ca-certificates curl gnupg
curl -fsSL https://deb.nodesource.com/gpgkey/nodesource-repo.gpg.key | sudo gpg –dearmor -o /etc/apt/keyrings/nodesource.gpg
NODE_MAJOR=20
echo “deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_$NODE_
JavaScript勉強備忘録
## JavaScript勉強備忘録
友達の開発の内容を理解するためjsの勉強を始めた。### JavaScriptはどんなプログラミング言語か
・主にWebブラウザの中で動くプログラミング言語。
・WebブラウザだけでなくNode.jsというサーバー側のアプリを作る仕組みでも利用されている。
### プログラミング言語の中での位置付け
・スクリプト言語
・インタプリタ方式### JavaScriptの歴史
1995年 JavaScriptはNetscape Communicationsのブレンダン・アイク(Brendan Eich)によってLiveScriptという名前で開発される。
1995年12月にJavaScriptとして、Netscape Navigator 2.0で実装された。
1996年にInternet Explorer 3.0登場 Netscape Communicationsはライセンスを付与せずにInternet Explorer 3.0には別のJScriptという言語が搭載
1997年 Internet ExplorerとNetscape Navigat
Node.jsでdotenvがいらなくなったっぽいので使ってみる
2023年9月頭にリリースされたNode.js v20.6.0に`built-in .env file support`という記載がありました。
まだフラグが必要ですが、`.env`ファイルをデフォで使えるようになる感じですね。
> https://nodejs.org/en/blog/release/v20.6.0
> 参考: [Using Environment Variables In Node.js 20.6.0](https://browsee.io/blog/using-environment-variables-in-node-js-20-6-0/)
## 従来はdotenvを利用していた
通常環境変数を.envファイルを扱うためにdotenvというライブラリを使うやり方が主流でした。
https://www.npmjs.com/package/dotenv
“`bash
$ npm i dotenv
“`“`js
require(‘dotenv’).config()
console.log(process.env.HOGEHOGE); //.e
Homebrewでnodeとyarnをインストールする
## 問題
dockerコンテナを立ち上げようとしたところ
`env: node: No such file or directory`というエラーが出た。
nodeがインストールされていなかったためインストールする。
nodebrewとの競合問題もあるので、ついでにyarnもインストールする。## 環境
macOS Ventura ver13.6 （ Apple Silicon ）
※homebrewインストール済み：[【公式】インストール方法](https://brew.sh/)## 確認すること
以下のコマンドをそれぞれ実行し、インストールされているか確認する。
“`sh
yarn -v
node -v
“`## homebrewでのnodebrew install
1.まずは、nodebrewをインストールする。
“`sh
brew install nodebrew
nodebrew setup
“`
2.pathを通す
“`sh
echo ‘export PATH=$HOME/.nodebrew/current/bin:$PATH’ >> ~/.z
Express+SQLite3備忘録2
ExpressとSQLite3を利用して、動的に検索できるWebアプリの例です。ここではPOSTメソッドで検索文字を送受信しています。
[備忘録1](https://qiita.com/watmot/items/d12ccf0a5aa968a12d10)や、EJSの例については[こちら](https://qiita.com/watmot/items/90e304eba121a1bed352)も参考にしてください。当初うまく結果が反映されませんでしたが、データベースの処理結果を得る前にWebサーバーが応答していることがわかり、Promiseを利用することで解決しました。Promiseについては[こちら](https://qiita.com/cheez921/items/41b744e4e002b966391a)を参考にさせてもらいました。わかりやすい説明で助かりました。
EJSファイル内にJavascriptを記述し、その中で受け取ったオブジェクト配列を展開しているのですが、このあたりがいまいち非効率だなと感じております。おそらくもっとスムーズに行うやり方があると思うのですが、、、
Express+SQLite3備忘録1
WebアプリにてJavascriptオンリーで、データベースへの接続が手できれば便利だなと思い、試してみました。手軽さを求め、WebサーバーはNode.js+Expressで、データベースはSQLite3を利用しています。
node.jsとsqlite3がインストールされている前提とします。
Expressの使い方については、[こちら](https://qiita.com/watmot/items/90e304eba121a1bed352)でも使い方の例を載せています。# 準備
プロジェクト用のフォルダを作成し、そのフォルダに移動して初期化処理を行います。
“`terminal
npm init -y
“`
Expressとejsとsqlite3をインストールします。
“`terminal
npm install express
npm install ejs
npm install sqlite3
“`# SQLite3にてデータベースの作成
プロジェクト内のフォルダにてSQLite3のデータベースファイル「sample_data.db」を用意し、テーブル名「bbt
思い立ったが吉日なのでasdfでBunを入れてみたメモ
“`shell
# asdf-bunプラグインを追加
$ asdf plugin add bun# Bunのバージョンを確認
$ asdf list all bun# 1.0.2をインストール
$ asdf install bun 1.0.2# globalのBunのバージョンを指定
$ asdf global bun 1.0.2# ちゃんと入ったか確認
$ bun -v
“`##### 実際に走らせてみた追記
既存のReactなプロジェクトをBunで走らせてみると、初回はそれなりに時間がかかったけれど2回目は目に見えて早くなった。
良いぞBun、頑張れBun。
