- 0.0.1. 依存パッケージの脆弱性修正には、package.jsonのoverrides / resolutionsフィールドを使いましょう
- 0.0.2. RPi + CHIRIMEN + Node-REDの環境づくり
- 0.0.3. 【緊急】トイレの蓋を閉め忘れ彼女にブチギレられたので、obnizを使って解決しにいった話
- 0.0.4. node-configのlocal.json
- 0.0.5. VercelでLineボットを作って総理大臣の名前を暗記するゲームをやってみる
- 0.0.6. MySQLのテーブルのデータをJson形式で出力（エクスポート）する
- 0.0.7. Vue.jsで文字列をBase64に変換する方法
- 0.0.8. Volumio3(Raspberry Pi)でRadikoを再生する環境構築
- 0.0.9. クラスオブジェクトの@Expose()ってなに？
- 0.0.10. npm のライブラリ（モジュール）のドキュメントを見るコマンド
- 0.0.11. Class Transformerの概要について備忘録を書いた
- 0.0.12. Node.js 18の気になる点を挙げてみる
- 0.0.13. Progate HTML&CSS中級編終わり
- 1. 2h未満程度で終わった
- 2. progateを始めてみる
依存パッケージの脆弱性修正には、package.jsonのoverrides / resolutionsフィールドを使いましょう
## はじめに
この記事は、npmとyarnの依存関係ツリーを上書きする`overrides` / `resolutions`フィールドの使い方を共有するためのものです。
### 想定する環境
– node.js 16.17.1
– npm 8.15.0
– yarn v1.22.19:::note warn
overridesフィールドは、npm [v8.3.0](https://github.com/npm/cli/releases/tag/v8.3.0)で導入されました。それ以前のバージョンでは動作しません。
::::::note warn
この記事は[yarn v1](https://classic.yarnpkg.com/lang/en/)系統を対象としています。[yarn v2+](https://yarnpkg.com/)では挙動が変わるかもしれません。各自でご確認ください。
:::## 依存関係ツリーを上書きして脆弱性に対応する
依存パッケージが以下のような状態だと、セキュリティ更新に追従するのが難しくなります。
– 脆弱性を持ったパッケージに依存
RPi + CHIRIMEN + Node-REDの環境づくり
# はじめに
Web IoT MakersというIoTの演習＋ハッカソンイベントでCHIRIMENというJavaScriptでRPiを動かせるフレームワークを学びました。
Web系のエンジニアの方はJavaScriptですいすいコーディングできるのだと思うのですが、すこしでも楽をしたいのでNode-RED環境も作って併用する環境を作ってみます。
少々回りくどいですが、CHIRIMENのコア部分はWeb I2C APIとWeb GPIO APIです。htmlでUIを使ってJSのAPIでセンサやGPIO制御してMQTTでデータをNode-REDに投げてごにょごにょするイメージです。# CHIRIMEN用のマイクロSDを作る
CHIRIMENの基本的な情報は次のサイトを参考にしてください。
https://chirimen.org/
https://tutorial.chirimen.org/pizero/#chirimen–1
https://chirimen.org/chirimen/gc/top/examples/起動用のmicro SDカードの作り方はこちらです。
ht
【緊急】トイレの蓋を閉め忘れ彼女にブチギレられたので、obnizを使って解決しにいった話
# やばい状態です
現在、彼女と半同棲しているのですが、人間が共に暮らすと様々な問題が発生します。
我々の場合、それはトイレで起こりました。
僕はとてもズボラな人間で、よくトイレの蓋を閉め忘れてしまいます。
僕自身、「だから何？」程度の話なのですが、彼女はそれを許すことができないようで、この世の終わりくらいキレ散らかします。いつもならば彼女に平謝りをして許して頂いているのですが、あまりに改善されないので、ついに彼女が僕に対して「制裁」を始めました。
**晩ご飯が豆腐とキムチだけになったのです、、、、**
さすがにいつか死んでしまう気がするので、緊急でなんとかしようと躍起になっております。# インスパイアを受ける
そんなとき、これを見つけました。https://twitter.com/togenkyoo/status/1413742448036126722?ref_src=twsrc%5Etfw%7Ctwcamp%5Etweetembed%7Ctwterm%5E1413742448036126722%7Ctwgr%5E1706c5c7d80f021a34cfa6953b83e
node-configのlocal.json
# はじめに
[node-config](https://github.com/node-config/node-config) が `NODE_ENV` の言うことを聞いてくれなくて困ったことがあったので記録しておく。# 起こったこと
`NODE_ENV` の値は `dev` になってるのに、どうしても`local.json`の値が読み込まれてしまう# 原因
仕様だった。local.jsonとかlocal-xxx.yamlとかそういうのを設定ファイルに含めると、`NODE_ENV`の値に関係なく必ずそいつを読み込むらしい → https://github.com/node-config/node-config/issues/685「この仕様のおかげで、ローカルではテスト通ってたのにプッシュしたらテスト通らない みたいなことがなくなるよ」などと言っている → https://github.com/node-config/node-config/wiki/Configuration-Files#local-files
# おわりに
https://github.com
VercelでLineボットを作って総理大臣の名前を暗記するゲームをやってみる
どうも。今までQiitaに3つ記事を書いたんですけど、なんだかそれらが時代に取り残されている気がしてたんですよ。エラストテネスとか紀元前3世紀じゃねえか。だから今回はもうちょっと若くなろうと思って、Lineボットを作ってみました。内容はシンプルです。スクレイピングしてきた内閣総理大臣の一覧を使って、古今東西・内閣総理大臣の名前ゲームをしてくれるチャットボットです。
ボットが句読点打ってる時点で
MySQLのテーブルのデータをJson形式で出力（エクスポート）する
MySQLのテーブルのデータをJSONで出したくなり、その際に作ったスクリプトを紹介します。
Node.jsで書きます。
“`bash
root
|- docker-compose.yml
|- node-script/
|- package.json
|- export-mysql-data.js
|- db.js“`
まずは docker-compose ファイルを用意して、環境を整える。
“`yml:docker-compose.yml
version: “3”
services:
# #######################################
# # Script
# #######################################
script:
image: node:16
working_dir: /usr/src/app
volumes:
– ./node-script/:/usr/src/app
tty: true# #######
Vue.jsで文字列をBase64に変換する方法
## 概要
– Fitbitのアクセストークンを更新する際に `client_id:client secret` をBase64に変換する必要があったので、やり方を備忘録として残します。**Fitbitの公式ドキュメント**
[Fitbit Developer – Refresh Token](https://dev.fitbit.com/build/reference/web-api/authorization/refresh-token/)## 環境
Windows10
Vue.js 3## やり方
#### 1. ターミナルでnpm install ####
“`terminal:powershell
npm install buffer
“`#### 2. 変換コード ####
“`javascript:Sample.vue
import { Buffer } from ‘buffer’// base64にエンコード
const beforeText = “HogeTaro:example”
const afterText = Buffer.from(
Volumio3(Raspberry Pi)でRadikoを再生する環境構築
はじめまして、mOqOmです。
突然ですがVolumioでRadikoを再生したいですよね！
有志の方が作成したvolumio_jpradioだと私の知識が足りなく起動ができず困っていたのでNode.jsに移植してみました。
20221010時点ではダウンロード機能はないですが、サービスとして自動起動設定を行うことも可能となっています。早速ですが、volumio_jpradioをNode.jsに移植した私のvolumio_jpradioについてのインストール方法を記載したいと思います。
まずインストールする環境は以下の通りとなっています。
※npmは後述の手順でアップデートを行い、その他のバージョンについてはVolumio3(Ver:3.378)をインストールした環境のままのバージョンです。
以前のバージョンではインストールされていなかったffmpegがデフォルトでインストールされているので手順を飛ばしています。
### 動作環境
+ Raspberry Pi 4 Model B
+ Volumio3(Ver:3.378)
+ Node.js(Ver:14.15.4)
+ npm
クラスオブジェクトの@Expose()ってなに？
# はじめに
API開発を進めていく中で、クラスオブジェクトの定義の中になにやら`@Expose()`という呪文が書いていたので調べてみることにしました。また、過去にはclass-transformerの概要についても書いてみました。
https://qiita.com/enomoto11/items/aa9c9faa508b3aed6540
# plainToClass()関数
まず、（プレーンオブジェクトを要素とする）連想配列usersと独自に定義したUserクラスがあるとします。
“`index.ts
import { plainToClass } from “class-transformer”;const users = [
{
id: 1,
firstName: “Johny”,
lastName: “Cage”,
age: 27,
},
{
id: 2,
firstName: “Ismoil”,
lastName: “Somoni”,
age: 50,
},
{
id
npm のライブラリ（モジュール）のドキュメントを見るコマンド
探したけどそれっぽいものが見つからないので自前で。
[glow](https://github.com/charmbracelet/glow) というコマンドに依存しているので事前に brew install などして入れてください。.bashrc や .zshrc に下記を記述
“`bash:.bashrc
nodedoc() {
local readme_path
if [ -f “node_modules/${1}” ]; then
readme_path=”node_modules/${1}/README.md”
else
readme_path=”$(npm root -g)/${1}/README.md”
fi
glow -p “$readme_path”;
}
“`使い方
“`
nodedoc“`
Class Transformerの概要について備忘録を書いた
# はじめに
API開発を進めていく中でclassTransformerがかかわってくるところがあったので調べていると日本語記事があまり見つからなかったので備忘録を兼ねてこちらの記事を書くことにしました。
本記事は`class-transformer`の説明の導入部分についての記事になります。# 自己紹介
はじめまして！
私は2022年4月から現在までCatallaxyという会社でエンジニアインターン生として勤務しているエンジニア志望の大学生です。# class-transformerを理解する前に
JavaScriptには、
– プレーンオブジェクト
– クラスオブジェクトの2種類があり、これらの違いを知る必要あります。
### プレーンオブジェクト
プレーンオブジェクトは、`{}`を使って作られるオブジェクトのことで例えば以下の配列の各要素に見られるような形になります。（以下の形式は特に`JSON形式`とも呼ばれます）
“`users.json
[
{
“id”: 1,
“firstName”: “Johny”,
“lastName”
Node.js 18の気になる点を挙げてみる
## はじめに
こんにちは、NamedPythonです。
ちょっと個人開発の熱が戻ってきたのもあり、技術選定も兼ねて色々調べているところです。
BunとかDenoもあるけど、一周回って **次のLTSなNode.js(18.x)が気になる** という気持ちになったので、公式ドキュメントを読みくだしながら気になったところをちょ〜〜っとだけ深掘ってピックアップしようと思います。Node.js 18がActive LTSになるのは **2022-10-25** からなので、実はもう結構近いのです。
https://github.com/nodejs/release#release-schedule
## 読むドキュメントたち
### Node.js v18 のリリースニュース
https://nodejs.org/de/blog/announcements/v18-release-announce/
### リリースブログのうちのNode.js v18.x.y についてのもの
https://nodejs.org/ja/blog/release/
## ピックアップ
#
Progate HTML&CSS中級編終わり
2h未満程度で終わった
初級編の続きをしている感じであった。
btn img の概念等よく作られているサイトだとしみじみ感じた。
しかし実際に１からプログラムを書けって言われると、これ終わらせただけでは未だうまくコーディング出来ないんだろうなってのが正直なところ。
次はjavascript！早くアニメーションで動的サイトを作りたい。（簡単なボタンは中級編で作ったが）
作業ディレクトリ依存のnodeバージョン確保する
direnvをインストールする
https://qiita.com/kompiro/items/5fc46089247a56243a62
nvmをインストールする
https://qiita.com/chatrate/items/88046663236fc546e9d3このファイルを作る
“`.envrc
__=`pwd`
export NVM_DIR=$__/.nvm
if ! [[ -d $NVM_DIR ]];
then
mkdir $NVM_DIR
fi
source $(brew –prefix nvm)/nvm.sh
“`:::note alert
direnv: error /Users/pooh/Workshop/ibushigin/code/ibushigin-gohe_2/.envrc is blocked. Run \`direnv allow\` to approve its content
:::
このエラーが出たらあせらず`direnv allow`を実行###### 経緯
他の作業環境のglobal汚染やnodeバージョンをあやまって
大学２年後期から３年前期のインターンまでにまともなポートフォリオを作成する軌跡
progateを始めてみる
まずはウェブ開発コースを進めることにする。
HTML&CSS>>Javascript>>Node.js の予定。
～追記～
Reactもとりあえずやるっぽい。
React(Node js +Express +Reset API)の構成でアプリを作成をしました【CRUD Rest API】
## C (create)
R (read)
U (update)
D (delete)Get ⇨ /Users get all users
Post ⇨ /Users create a new user
Get ⇨ /User/:id get single user details
Delete ⇨ /User/:id delete a user
Put ⇨ /User/:id update a user## APIとは ?
APIは「Application Programming Interface」の略語。
3つの単語には、それぞれ下記のような意味がある。– アプリケーション： パソコンやスマホの中で動くソフトのこと
– プログラミング： プログラミング言語を利用して、パソコンやスマホに実行させる指示を出すこと
– インタフェース：ITの分野では、機器を繋ぐ接続部分や接触する箇所のこと##### つまりAPIとは、
『2つのアプリケーションやソフトウェア同士が情報をやり取りする際に使用される、プログラミング上の窓口』
【Node.js】ファイル処理周りで調べたことmemo
# はじめに
expressでファイル関連の処理を実装する際に前提知識がなさすぎたので初歩的なことを調べました。
その際にメモしたものをつらつらと書いていきます（雑です## バイナリデータ
– コンピュータが見て分かる/扱えるデータ
– `binary`は「2進法の」という意味
– 具体的には画像、音楽、動画、圧縮されたファイルなど
– 一般的には人間が読めるテキストデータ**以外**のデータを指すことが多い
– バイナリとテキストは対比の意である## バイト
– 1byte = 8bit
– 1か0を並べた数値の1個をbitと言う## Buffer
– Node上でバイナリデータを扱うためのクラス
– 文字列とは全く別ものであるバイナリデータ（バイト列）を扱う
– ちなみに文、字列を扱うクラスは`String`
– ちなみに、C言語ではこの両者を同じ型として扱える
– `new Buffer(128)`のような形で書くと128バイトのバッファを作成できる## ArrayBuffer
– JavaScriptでバ
nvm useでバージョンが切り替わらない（windows環境）
# nvm useでバージョンが切り替わらない（windows環境）
## 経緯
– 元々nodeバージョン16.16をインストール済み
– nodeバージョン12.22.3を使用する必要ことになった。
– nodeバージョン管理ツール**nvm-windows**をインストール。インストール方法の参考サイト（[nvm-windows の導入と簡単な操作をやってみた](https://qiita.com/akipon0821/items/eaeffe79221cfcd4d258)
– **nvm-windows**インストール後、再起動が必要ヨ！
– `nvm install 12.22.3`でnodeバージョン12.22.3をインストール。
– しかし、`nvm use 12.22.3`でバージョンの切り替えができない。#### 具体的なエラーメッセージ
“`cmd
C:\Users\atom>nvm use 12.22.3
exit status 5: ・A・N・Z・B・・・・・・・・・B
exit status 1: ・・・a・・・・・・・t・B・・・・・・低・・・B
hygenのテンプレートファイルレンダリング方法を確認する
社内のコーディングの生産性向上のために、[hygen](https://www.hygen.io/)でファイルを追加するスクリプトを作っていたのですが、[hygenのTemplateドキュメント](https://www.hygen.io/docs/templates)を見てもどういう風にテンプレートファイルがレンダリングされているのかよくわからなかったので調べてみました。
# 前提
– yarnでhygenを実行して、複数のテンプレートファイルから数種類のファイルを生成したかった。
– オプションの値によってテンプレートファイルの処理方法を変えたかった。
– 条件分岐の書き方などでわからないところがあった。
– hygenのバージョンはv6.2.11# hygenのコードを読む
ドキュメントは使い方がざっくり書いてあるだけなので、コードを読みました。
[render.tsのrender関数](https://github.com/jondot/hygen/blob/v6.2.11/src/render.ts#L38)## front-matterでパース
実際にファイ
setTimeoutを書くのがめんどいから少し楽にしてみた
1ヶ月ぶりですねこんにちはトマトです
“`js
setTimeout(() => {
console.log(“Hello World”)
},5000)
“`
いっつもsetTimeoutをこんな風に書いていてめんどいなって思って色々してたら
`timers/promises`っていうのが元々入ってるのを発見
使ってみたところ結構楽になったので紹介します。早速ですがコード
“`js
const time = require(“timers/promises”).setTimeoutasync function main() {
await time(5000)
console.log(“Hello World”)
}
main()
“`自分的にはこっちの方が書いてて楽なので見つけてよかったなと改めて思った。多分みんな知ってる
JavaScriptはやめれないっす
ではまたー
