- 1. viteを使ってみようと思ったら最初から詰まった
- 2. Scratch 3.0(公式)などで独自拡張機能を使わない外部との通信【ソースコード編】(ブラウザの開発者ツールのコンソール、JavaScript、WebSocket が関連)
- 3. Python の input( ) と同様の挙動を JavaScript, Node.js で再現する
- 4. Node16 + Cloud Functions をDocker環境に構築
- 5. MPD管理下の曲をコマンドで操作する。(またはWEB操作、GoogleHomeで操作)
- 6. #Scratch 3.0(公式)などで独自拡張機能を使わない外部との通信【概要編】(ブラウザの開発者ツールのコンソール、JavaScript、WebSocket が関連、 #toio でも利用可)
- 7. HerokuでGoogle認証情報・環境変数を扱う方法
- 8. CloudFunctionsのデプロイエラーの対処方法 error fetching storage source: generic::unknown: retry budget exhausted (3 attempts): fetching gcs source: unpacking source from gcs: source fetch container exited with non-zero status: 2
- 9. JavaScriptでAzure Table Storageを操作する
- 10. Node.jsで「Error: getaddrinfo EMFILE」というエラーが出る
- 11. ESP32をActions on Google Homeの音楽プレイヤにする
- 12. win11にしたらエイリアスが使えなくなった。error: `fnm env` was not applied in this context. Can’t find fnm’s environment variables
- 13. EC2内にexpressで立ち上げたサーバーへALPを介して接続する
- 14. AWS Lambda HTTP APIでPOSTデータを取得・デコードする関数(関数URL対応)
- 15. Angular + Bootstrapの環境構築(nvm導入編)
- 16. GraphQL+NestJS+TypeORM+MySQLにHelloworldしてみた
- 17. ESP32からLINEメッセージとSlackメッセージを送信する
- 18. Docker Compose + Node でコンテナ内に node_modules を保持する
- 19. npmとは
- 20. Windows7でNode.js v14以上を動かしたい! あるいは、なでしこ3PC版 v3.3.3を使いたい!!!
viteを使ってみようと思ったら最初から詰まった
# 起きたこと
viteを使って開発を始めようと思ったらはじめから躓いた
[こちら](https://zenn.dev/sprout2000/articles/60cc8f1aa08b4b)の記事を参考にさせていただき、開発を進めようと思った矢先のことだった。# エラー
ターミナル上で以下の[入力]を行い、開発を始め湯としたところ、次の[出力]が返され、行き詰まった。
“`ターミナル:入力
npm init vite
“`
“`ターミナル:出力
‘create-vite’ は、内部コマンドまたは外部コマンド、
操作可能なプログラムまたはバッチ ファイルとして認識されていません。
“`# やったこと
いろいろ調べてみると、コマンドが認識されていない時はPathが通っていない、`名前 -v`でバージョンを確認して表示されれば問題ないとのことで、自分の場合はPathが通っていないことはないと判断した。
結局、以下のコマンドを実行することで解決した。
“`ターミナル:入力
npm install create-vite
“`
そりゃそうだと思ったが、プログラミング初心者にと
Scratch 3.0(公式)などで独自拡張機能を使わない外部との通信【ソースコード編】(ブラウザの開発者ツールのコンソール、JavaScript、WebSocket が関連)
以下の記事で書いていた仕組みについて、「【概要編】」では ソースコードに関する部分に触れていなかったため、この記事ではその辺りの話を書いていきます。
●#Scratch 3.0(公式)などで独自拡張機能を使わない外部との通信【概要編】(ブラウザの開発者ツールのコンソール、JavaScript、WebSocket が関連、 #toio でも利用可) – Qiita
https://qiita.com/youtoy/items/db6d34a9985eb182042f## 動作している様子の再掲
「【概要編】」の記事でも掲載していた、この記事で扱う仕組みが動いている時の様子の動画です。公式版 #Scratch (https://t.co/0fqczChNyX)で作成したプロジェクトと、公式の #toioDo で作成したプロジェクトの間をつないでシンクロさせる(ちょっと遅延が発生しますが…)、
という少し変わった試作をやってみました。思いつきで作ってみたネタです。#toio pic.twitter.com/guFrSSHScO
— you (@youtoy) May 3, 2022
構成の話などは、「[【概要編】の記事](https://qiita.com/youtoy/items/db6d34a9985eb182042f)」をご参照ください。
## 準備手順
この後に、いくつかのプログラムのソースコード等が出てくるのですが、それらをどのような順番で動作させていく
Python の input( ) と同様の挙動を JavaScript, Node.js で再現する
私と同じ悩みを持つ方のために、共有させていただきます。
以下のQAにてご指導頂いた内容ですので、経緯等は以下のページを参照ください。https://qiita.com/watanabe-tsubasa/questions/07131f97fa0a48897ab2#answer-7d6b619e11e5876f6023
## 動作
実行すると数字1を聞かれます(今回は10を入力)。
入力すると数字2を聞かれます(今回は20を入力)。
Node16 + Cloud Functions をDocker環境に構築
# はじめに
Cloud Functionsをデプロイするまでの環境をDockerで構築する。今回は環境構築が簡単に済む Node.js を選択した。
公式より Node.js 16(推奨)とあるので(2022/05/01)バージョンは Node.js 16 選択した。https://cloud.google.com/functions/docs/concepts/nodejs-runtime?hl=ja
# 概要
### 前提条件
* GCPにプロジェクトが存在し、Cloud Functions使用できる状態になっている
* Docker Desktopを使用### 手順
1. docker-composeを使用してコンテナを作成する
2. firebase-toolsを使用して初期設定
3. Cloud Functionsにデプロイする# Docker環境構築
imageは node:16-alpine を使用し、firebase-toolsをインストールする。
“`:Dockerfile
FROM node:16-alpineENV APP_HOME /app
MPD管理下の曲をコマンドで操作する。(またはWEB操作、GoogleHomeで操作)
#はじめに
●MPD管理下の曲をコマンドで操作する。
WEB操作、GoogleHome操作は下記の記事を参考に修正してください。
[WSLのUbuntuでPC内の音楽データをGoogleHomeで操作する](https://qiita.com/kobbeko/items/04954bc47e407c07d9e7)
[WSLのUbuntu環境でPC内音楽データをWeb操作する(おまけでyoutube音楽とGooglehomeで伝言)](https://qiita.com/kobbeko/items/f4d47c817309bda1e56c)#環境
●WSLのUbuntu環境で構築しています。ラズパイでも問題ありません。
●mpd,mpc,mplayerをインストールする#PC内音楽データを再生するプログラム(pc2play.js)
●単体で起動する方法
$node pc2play.js 松田聖子&赤いスイートピー(artist&title)const exec = require(‘child_process’).exec;
//値取得
cons
#Scratch 3.0(公式)などで独自拡張機能を使わない外部との通信【概要編】(ブラウザの開発者ツールのコンソール、JavaScript、WebSocket が関連、 #toio でも利用可)
デフォルトでは外部と自由に通信をする機能がない
「公式版の Scratch( https://scratch.mit.edu/ )」
や、
「toio Do( https://toio.github.io/toio-visual-programming/beta/?category=do )」
を、以下のようにリアルタイム通信で連動させることができたりする仕組みの話を、この記事で取り扱います。詳細は続きの記事で書こうと思っていて、今回は概要を記事化してみます。公式版 #Scratch (https://t.co/0fqczChNyX)で作成したプロジェクトと、公式の #toioDo で作成したプロジェクトの間をつないでシンクロさせる(ちょっと遅延が発生しますが…)、
という少し変わった試作をやってみました。思いつきで作ってみたネタです。#toio pic.twitter.com/guFrSSHScO
— you (@youtoy) May 3, 2022
今回の仕組みに関係してくる主なキーワードは、以下のとおりです。
– ブラウザの開発者ツール(の中のコンソール)
– JavaScript(Node.js を使うもの、ブラウザ上で動かすバージョン)
– リアルタイム通信(WebSocket のサーバー・クライアント)ちなみに、1つ前に書いていた以下の記事の内容も、今回の話に少し関連していたりします。
●#Scratch 3.0 のキー入力イベントをブラウザの
HerokuでGoogle認証情報・環境変数を扱う方法
# HerokuでGoogle認証情報・環境変数を扱う
## 前置き
通常ローカル開発環境では.envファイルにkey:valueペアの定数を定義したり、Google APIの認証情報をJSONファイルに保持していたりするが、HerokuなどのPaaSでGithubリポジトリ連携する場合、資格情報を公開しない状態でアプリ側で扱えるようにする必要がある。Google資格情報のJSONファイルの一例:
![gcredentials_hidden.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2395846/7955b169-1fcc-9a17-4adc-4df7c327017c.png)“`bash
$ heroku config:set GOOGLE_CREDENTIALS=”$(< /home/charles/Programs/heroku/google-credentials.json)" --app "myapp" ``` ## Herokuでの確認 のSettingsタブ > Con
CloudFunctionsのデプロイエラーの対処方法 error fetching storage source: generic::unknown: retry budget exhausted (3 attempts): fetching gcs source: unpacking source from gcs: source fetch container exited with non-zero status: 2
こんにちは。[virapture株式会社](https://virapture.com)の[もぐめっと](https://mogmet.com)です。
本日はCloudFunctionsのトラブルシューティング記事になります。
結論から言うとnodeのバージョンを変えよう!というお話になります。
## 問題の発生
ある日M1 macの環境でCloudFunctionsをデプロイしようとしたら下記エラーでデプロイができませんでした。
“`
functions[onCreate(asia-northeast1)]: Deployment error.
Build failed: Build error details not available.Please check the logs at https://console.cloud.google.com/cloud-build/builds;region=asia-northeast1/xxx-xxx-xxx-xxx-xxx?project=xxx. Please visit https://cloud.google.com
JavaScriptでAzure Table Storageを操作する
JavaScriptでAzure Table Storageを使用するには、2022年5月現在、[**@azure/data-tables**](https://github.com/Azure/azure-sdk-for-js/tree/main/sdk/tables/data-tables)というライブラリを使用します。(従来は、[**azure-storage**](https://github.com/Azure/azure-storage-node)というライブラリを使用していましたが、現在は非推奨となっています。)
# 利用可能な環境
[GitHub](https://github.com/Azure/azure-sdk-for-js/tree/main/sdk/tables/data-tables#prerequisites)には、
> Currently supported environments:
> * LTS versions of Node.js
> * Latest versions of Safari, Chrome, Edge and Firefo
Node.jsで「Error: getaddrinfo EMFILE」というエラーが出る
Docker上でNode.js + Nuxt.js + log4js-nodeで開発したアプリケーションを稼働したときの障害に対してどのように原因追求したかの記録
# 事象
Docker上にNode.js + Nuxt.js + log4js-nodeで構築したフロントエンドアプリとバックエンドアプリの間のHTTP通信が稼働2~4週間後に通信不能となった。![Qiita_SystemPlatfrom.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1793264/f961e197-1be5-3073-e60f-c72869e7f320.png)
スタックトレースとしは、下記を得ている。
“`text:Stack traces
[ERROR] Error: getaddrinfo EMFILE backend-service
at GetAddrInfoReqWrap.onlookup [as oncomplete] (node:dns:72:26) {
errno: -24,
c
ESP32をActions on Google Homeの音楽プレイヤにする
M5Core2を「OK Google」から操作できる音楽プレイヤにします。
Google Smart Homeのデバイスタイプ「メディアリモコン」を実装します。
また、応答速度を速めるために、ローカルフルフィルメントに対応させます。もろもろのソースコードは以下にあります。
poruruba/MusicSmartHome_Google
https://github.com/poruruba/MusicSmartHome_Google
全体的な流れを示します。
まずは、セットアップ時です。ユーザが、スマホのGoogleのHomeアプリから、デバイスのセットアップをするときのフローです。
ちなみに、後述する自作のスマートホームサーバの登録は済んでいる前提です。![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/261826/231dd5b8-b669-04b9-33c9-dec6683db84a.png)
①セットアップ開始
GoogleのHomeアプリから、デバイスのセットアップ
win11にしたらエイリアスが使えなくなった。error: `fnm env` was not applied in this context. Can’t find fnm’s environment variables
win11にしたら急に登録してたエイリアスが使えなくなった。
原因は、パワーシェルが読み込むファイルのパスが変わったかららしい。
上記コマンドを実行するとパワーシェル立ち上げ時にどこのファイル読み込んでいるかわかる
> $Profilewin10だと
%HOMEPATH%/Documents/WindowsPowerShell/Microsoft.PowerShell_profile.ps1
win11だと
%HOMEPATH%/Documents/PowerShell/Microsoft.PowerShell_profile.ps1
になる。fnmをinstallして使おうと思ったらこのエラーが出た。
Microsoft.PowerShell_profile.ps1にenvの設定してるのにずっと
error: `fnm env` was not applied in this context. Can’t find fnm’s environment variables
って出るから、えってなってた。
こういうの気づきにくいからマジやめれ。。
EC2内にexpressで立ち上げたサーバーへALPを介して接続する
## ec2内にローカルサーバーを立ち上げる
まずはnode.jsとnpmをインストールします。
[公式の手順](https://docs.aws.amazon.com/ja_jp/sdk-for-javascript/v2/developer-guide/setting-up-node-on-ec2-instance.html)を参照してさくっと完了。
一応コマンドで確認しておきます。
“`
node -v
npm -v
“`適当なディレクトリを作成し、expressをインストール。サーバ用jsファイルも作成します。
“`
mkdir sample
npm i express
vi index.js
“`“` server.js
const express = require(‘express’);
const app = express();app.get(‘/’, (req, res) => {
res.send(‘Hello’);
});app.listen(3000, () => console.log(“Server started
AWS Lambda HTTP APIでPOSTデータを取得・デコードする関数(関数URL対応)
## HTTP APIや関数URLでもPOSTデータを受け取りたい
手軽に実装できてお財布にも優しいHTTP APIですが、POSTデータを受け取るのに一手間必要です。
リクエストbodyはbase64エンコードされた状態で取得できるため、 デコード & jsonパースしてあげる関数を使えばOKです。## コード
### Node.js
“`getBodyOnLambda.js
function getBodyOnLambda(event_body) {
let body_string_utf8 = Buffer.from(event_body, ‘base64’).toString(‘utf-8’);
//日本語が含まれる場合はdecodeURIする
//decodeURIComponentでは無くdecodeURIなのは、POSTされたデータの中に&が含まれているとJSON変換時にうまくいかないため
body_string_utf8 = decodeURI(body_string_utf8);
//パラメーター形式文字列のJSONへの変
Angular + Bootstrapの環境構築(nvm導入編)
■nvmとは
nvmとは、node.jsのバージョンを管理するためのツール■nvmインストール(Windows版)
1.[windows-nvm リポジトリ](https://github.com/coreybutler/nvm-windows#node-version-manager-nvm-for-windows
)を開いて、 「manual installation」を選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2353455/5d20c442-1e56-267b-edce-ff2c0f5486b6.png)
2.「Download nvm-noinstall.zip」を選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2353455/e78462f9-3d33-6e18-97ac-0b1cc369ee82.png)
3.「nvm-setup.zip」を
GraphQL+NestJS+TypeORM+MySQLにHelloworldしてみた
## はじめに
GraphQL+NestJS+TypeORM+MySQLという構成でのアプリケーション開発の初期環境構築を試してみました。
MySQL以外は素人なので調べながらなんとか動く構成にしたという感じです。
誰かの参考になれば幸せです。成果物はこちら
https://github.com/shinobushiva/nestjs-typeorm-ts-example/tree/step1
## 事前準備
`Node.js`, `yarn`, `mysql`をインストールしてください(説明は割愛します)
実行時の環境は次のとおりです。
“`
$ npm -v
8.8.0$ yarn -v
1.22.4$ mysql -V
mysql Ver 8.0.28 for macos12.2 on x86_64 (Homebrew)
“`### Nest CLI のインストール
https://github.com/nestjs/nest-cli次のコマンドを実行して `Nest CLI` をインストールします
“`
$ npm install -g @n
ESP32からLINEメッセージとSlackメッセージを送信する
ESP32から、LINEメッセージやSlackメッセージの送信をします。
最初に、各メッセージの送信の方法を説明した後に、ESP32上のJavascript実行環境から送信する方法を示します。# LINEメッセージ送信方法
便利なLINE Notifyを利用します。
以下、参考ページです。
[京急線の運行情報をLINE Notifyする](https://qiita.com/poruruba/items/49956b3db54ca7689b8c)まずは、以下をブラウザから開きます。
https://notify-bot.line.me/
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/261826/59e64789-bb6d-1c62-d863-910d4efbeb32.png)
右上のログインをクリックして、ログインします。その後、同じ右上のところから、「マイページ」を選択します。
連携中のサービスにいくつか登録されている状態ですが、最初は何も登録されていません。
Docker Compose + Node でコンテナ内に node_modules を保持する
## 目的
Dockerfile で `npm install` などとすると,ビルドされたイメージ内には `node_modules` ディレクトリが作られることになる.しかし, Docker Compose で親ディレクトリにボリュームをマウントすると, `node_modules` ごと上書きされてなくなってしまう.“`dockerfile:app/Dockerfile
FROM nodeWORKDIR /app
COPY package*.json ./
RUN npm install # node_modules が作られる
“`“`docker-compose.yml
services:
node:
build: ./app
volumes:
– “./app:/app” # node_modules が上書きされてしまう
“`今まではこれを回避するために
“`
docker compose build
docker compose run npm install # ホスト側にも node_modules を作
npmとは
## npmとは
Node.jsのパッケージを管理するシステム。
アプリケーションを作成する際に便利なパッケージをそのプロジェクト(フォルダ)にインストールして使用することができる。
パッケージとは、他のプログラムから利用することを目的としたクラスや関数などのプログラムのこと。## npmの必要性
自分でダウンロードするパッケージには以下の問題がある– 依存関係
– 競合関係npmはこれらの問題を解決してくれる。
## package.jsonとは
プロジェクト(パッケージ)の構成、構造を示した設計書のようなもの。# 参考記事
https://zenn.dev/antez/articles/a9d9d12178b7b2#npm%E3%81%A8%E3%81%AF
Windows7でNode.js v14以上を動かしたい! あるいは、なでしこ3PC版 v3.3.3を使いたい!!!
# 発端
なでしこ3は近頃、**ESModule化した次期バージョン**が発表されました☆https://nadesi.com/top/
まだテスト版とゆうことですが、早速使ってみなくては!
web版についてはベツに問題ありません。
しかも、v3.3.3で、HTML埋め込みでも「取り込む」文が使えるようになり、別ファイルのなでしこプログラムをライブラリとして使えるようになったので、[Javascript代わりに使う](https://qiita.com/kujirahand/items/a9ac3145a8d535a372dc)ことの利便性が飛躍的に向上し、現実的になりました~:heart_eyes:が! PC版(Win版)が動きません・・・
(Win版とゆう言い方は、なでしこv1に対しても使われますが、ここではv3の[Windows用オールインワンパッケージ「nadesiko3win32」](https://nadesi.com/doc3/index.php?Windows%2FDownload)を指しています。PC版(Node版)とゆう言い方だと、他のOS同