- 1. 内容
- 2. 原因
- 3. 解決策
- 3.1. ①webpackをインストールする
- 3.2. ②node.jsをダウングレード
- 3.3. 【覚書】create-react-app でホットリロードが効かないときの対処法
- 3.4. Nuxtで画像ダウンロードツール作ってみた
- 3.5. React コマンドメモ
- 3.6. nexeでNode.jsのアプリをパッケージングしようとしたらNode.jsのバージョンで怒られた
- 3.7. 数字に日本語の桁（万・億・兆）を付ける JavaScript
- 3.8. [Node] requestを使わずに標準ライブラリでPOST
- 3.9. TypeScriptでNodeモジュールを作成してnpm公開するまで
- 3.10. strapiの自作プラグインを左メニューに表示させる方法
- 3.11. 【覚書】ts-node で Node.js のバッチを書く
- 3.12. Content security policyはレスポンスヘッダの記述が優先される
- 3.13. Brightcove LIVE APIからデータ取得する方法(Lambda@Edge)
- 3.14. 【BTP】Node.jsとPostgreSQLでシンプルなアプリケーションを作成（2）CRUD処理編
- 3.15. [m1]asdfでバージョン管理を行なったnodejsを使うまで[mac]
- 3.16. 【BTP】Node.jsとPostgreSQLでシンプルなアプリケーションを作成（1）準備編
- 3.17. FATAL ERROR: wasm code commit Allocation failed – process out of memory
BLEビーコンとソラコムAPIでつい押してみたくなる出退勤記録ボタンを作る
#初めに
業務開始・終了を記録するときに、うっかり忘れてしまうことないでしょうか？
私はあります。パソコンを起動するとすぐに仕事のことが気になって。。
そこで、業務開始・終了、昼食開始・終了を記録したら、”少しだけ”メリットをもらえる、つい押してみたくなるボタンを作りました。+ 業務開始：業務開始時刻と今日の天気予報を教えてくれる。（＋励ましてくれる）
+ 昼食開始：休憩開始時刻と今日のニュースを教えてくれる。（＋いたわってくれる）
+ 昼食終了：業務再開の時刻を教えてくれる。（＋励ましてくれる）
+ 業務終了：業務終了時刻と明日の天気予報を教えてくれる。（＋いたわってくれる）工夫した、新規性のある部分は以下かと思います。
+ BLEビーコンボタンを使用して、ボタンのアクションごとに業務開始・終了 etc.を記録。
+ 天気予報を入手するための位置情報として、ソラコムの接続先基地局の位置情報を利用。#システム構成
システム構成を以下に示します。
ラズパイはビーコンの信号を受信したら、ソラコムの基地局情報や、OpenWeatheMapの天気情報、NHKのニュース情報を入手し
LinuxサーバーにPostgreSQL導入～外部サーバー接続まで
# 今回の流れ
➀PostgreSQLの導入
➁ローカルアプリ接続（Node.js）
➂外部サーバーアプリ接続（Node.js）# ➀PostgreSQLの導入
サーバーはさくらのVPSのCentOS8です。まずは下記からOSに応じたリポジトリURLを取得します。
https://yum.postgresql.org/repopackages/
今回はCentOS 8 – x86_64のリンクをコピーします。
続いてサーバーにインストールしていきます。
“`
sudo dnf install -y https://download.postgresql.org/pub/repos/yum/reporpms/EL-8-x86_64/pgdg-redhat-repo-latest.noarch.rpm
sudo dnf -qy mod
DockerでTypeScript×Node.js×Expressの環境構築
# やること
Node.jsとExpressの環境構築をDocker上で行います。
また、TypeScriptでの開発を行うためにTypeScript環境のインストールも行います。まずNode.js×Expressの環境構築後、TypeScriptをインストール、設定します。
# 準備
### Docker Desktopのインストール
[こちら](https://www.docker.com/products/docker-desktop)からDocker Desktopをインストールします。
Mac/Windows/Linuxに対応しています。### VSCodeのインストール
[こちら](https://code.visualstudio.com/download)からVSCodeをインストールします。
他のエディタでも問題ないですが、諸々使いやすいのでおススメします。
MacやLinuxをお使いの方であればvimでも問題ありません。# Node.js×Expressの環境構築
以下、ホスト上の作業は :file_folder: 、Dockerコンテナ上の作業は :
PWAでお手軽にクロスプラットフォームでテキスト共有
PWAを使えば、簡単にアプリ化できて、なおかつ通知を受けられるので、今回は、Windows・Android・iPhoneで、テキストを共有するPAWアプリを作成します。（世の中にいろんなツールがありますが、自分で作った方が安心なので。。。）
大した技術は使っていなくて、以下の投稿さえわかれば実装できます。
[PWAを試してみよう](https://qiita.com/poruruba/items/77cbb6448d804e6e996b)
GitHubにもろもろ上げておきました。
poruruba/pwa_notification
https://github.com/poruruba/pwa_notification念のためですが、問題が起こっても責任はとりません。。。
#サーバの立ち上げ
https://github.com/poruruba/pwa_notification
上記から、ZIPをダウンロードして展開します。
“`
> unzip pwa_notification-master.zip
> cd pwa_notification-maste
rails6 でrails sしようとしたらエラーが出た。（Webpacker::Manifest::MissingEntryError)
rails6はあまり使って開発したことがなく、半日以上時間がかかってしまったので、備忘録として、
内容
rails s でサーバー起動
デフォルトページは表示されていた？
ルーティングを設定して、簡単にtopページを表示しようとしたらエラー発生（Webpacker::Manifest::MissingEntryError）・ruby 2.7.2
・rails 6.1.3
・mac os原因
・Webpackerが上手くインストールされていない可能性
・Node.jsのバージョンとWebpackのバージョンが噛み合っていない可能性
・webpackerがコンパイルされていない上記のようなことが原因みたいです。
解決策
①webpackをインストールする
rails webpacker:install②node.jsをダウングレード
brew uninstall --ignore-dependencies nodejsアンイ
【覚書】create-react-app でホットリロードが効かないときの対処法
まず cross-env を入れる
“`
npm i -D cross-env
“`次に package.json の scripts.start を書き換える
“`json
{
“scripts”: {
“start”: “cross-env FAST_REFRESH=false react-scripts start”
}
}
“`以上。
Nuxtで画像ダウンロードツール作ってみた
以前、↓の記事でCLIの画像ダウンロードツールを作ったのですが、不要な画像までダウンロードされてしまうのでGUI化し、選択してダウンロードできる様にしてみました。
https://qiita.com/teracy55/items/f8a7c90b021368b12ab6
# 今回作ったツール
https://teracy-img-downloader.herokuapp.com/
# 機能紹介
使い方は簡単です
1. ダウンロードしたい画像のあるサイトのURLを入力し、検索します
2. ダウンロードしたい画像を選択します（選択した画像は赤くなります）
3. ダウンロードボタンを押してダウンロードします
※「いらすとや」さんのページを使わせていただいてますが、このツール使用時は対象のサイトがスクレイピングを禁止していないことを確認
React コマンドメモ
# 新規作成
“`shell
$ npx create-react-app [プロジェクト名]# TSX(JSXのTypeScript版)で作りたい時
# –template typescriptをつける
$ npx create-react-app –template typescript [プロジェクト名]
“`
# 開発サーバー起動
“`shell
$ npm start
“`# ビルドしてHTML/CSS/JSファイルを生成
“`shell
$ npm run build
“`# jestによるテストの実行
“`shell
$ npm test
“`
nexeでNode.jsのアプリをパッケージングしようとしたらNode.jsのバージョンで怒られた
# nexeでNode.jsのアプリをパッケージングしようとしたらNode.jsのバージョンで怒られた
久しぶりにNode.jsのアプリのパッケージングで、exeファイル作ろうとしてみたらエラーで怒られたので回避策を掲載しておきます。
## 私の環境(ERROR再現時)
– Windows 10
– nvm-windows で node.js のバージョン管理
– node.js : v14.17.0
– npm : v6.14.13## 結論
nexeのv3.3.3でリリースしている、リストの一覧からnode.jsのバージョンを合わせないといけいない。
windows環境なら、`windows-x64-14.15.3`なので、node.jsのバージョンは、`v14.15.3`にする。[nexe の github releases](https://github.com/nexe/nexe/releases/tag/v3.3.3)
 => {
if (typeof num === “number”) {
num = num.toString();
}let prefix = “”;
if (num[0] === “-“) {
num = num.slice(1);
prefix = “-“;
}return (
prefix +
num
.slice(0, -12)
.replace(/^0+/, “”)
.replace(/([0-9]+)/g, “$1兆”) +
num
.slice(-12, -8)
.replace(/^0+/, “”)
.rep
[Node] requestを使わずに標準ライブラリでPOST
こんにちは take-2405です。
AWS LambdaでSlack botを作成しました。参考にさせていただいた記事
https://qiita.com/rei-ta/items/931caaaef2684c97e4cf
## お急ぎの方用
“`javascript
const https = require(‘https’);
const querystring = require(‘querystring’);
.
.
.
var post_data = querystring.stringify({channel:”,text:}, null);
let options = {
host: ‘slack.com’,
path: ‘/api/chat.postMessage’,
port: 443,
headers: {
‘Content-Type’: ‘application/x-www-form-urlencoded’,
//他にtokenなど
},
TypeScriptでNodeモジュールを作成してnpm公開するまで
## 0. はじめに
Nodeモジュールをnpm公開までしたことなかったなーと思い、ひまだったので備忘録として手順をまとめました。## 1. Nodeモジュールを作成する
今回はmicroCMS(じゃなくてもいいけど)からデータを取得するだけの超ミニマムなNodeモジュールを作成していきます。
### 1-1. package.jsonを作成する
以下のコマンドを実行してpackage.jsonを作成します。
(:writing_hand:package.jsonは、Node.jsのプロジェクトが依存するパッケージ情報をまとめたファイルになります。)“`
> npm init
“`色々聞かれますが、質問内容は以下を指します。
– package name・・・プロジェクト名
– version・・・プロジェクトのバージョン (:writing_hand:開発段階では0.1.0とか0.0.1の方がいいかも。お好みで)
– description・・・プロジェクトの説明
– entry point・・・エントリポイントに指定するファイル
– test command
strapiの自作プラグインを左メニューに表示させる方法
# はじめに
strapiはポストwordpressとして非常に期待しているのですが、日本語の資料が少ないので苦労しており、少しでも参考になればと思います。
今回は、自作したプラグインを管理ページに表示させようとしたところ、`yarn develop`と`yarn start`で起動した場合にプラグインが表示されない問題が発生したので解決方法を記載しています。
# 動作環境
– Mac: MacBookPro macOS Big Sur 11.3.1
– node: v12.18.3
– yarn: 1.22.10
– Strapi v3.6.2現象を再現するために新規にプロジェクトを作成します。
“` terminal
$ yarn create strapi-app my-project –quickstart
“`適当にadminユーザーを作成してログインします。
で動くExpress.js+Vue.jsなWebアプリを趣味で製作していたときのこと、HTML上でCSPを記述しているのにGoogle アナリティクスが読み込めないという不具合が発生。ローカルで動かしていた分には発生しなかったが、GAE上にデプロイすると読み込めなくなる# とりあえずmetaタグに書く
そもそもCSPとは
[コンテンツセキュリティポリシー (CSP) – HTTP | MDN](https://developer.mozilla.org/ja/docs/Web/HTTP/CSP)HTML上からアクセスできるリソース、通信先を明示してセキュリティを保つ仕組みらしい。
記述方法は2種類あり(ここ大事)– httpレスポンスヘ
Brightcove LIVE APIからデータ取得する方法(Lambda@Edge)
# サーバーサイドの実装(Lambda@Edge – node.js)
※注意: GETとPUT(パラメータなし)のみ動作確認しています。
POSTやDELETEはパラメータの書き方が違うはずなので、別途実装する必要があります“`javascript:index.js
/**
* フロントから直接ブライトコーブAPIに問い合わせると、
* CORSポリシー違反でデータ取得ができないため実装した
*
* 2021.05時点ではGETとPUTのみ動作確認済
*
* フロントからAJAX経由で送られてくるHTTPメソッドとURLを用いて
* それに応じたブライトコーブAPIのレスポンス(JSON)を返す
* 例えば、AJAXで次のURLにGETリクエストが届いたら、Lambda@Edge(このindex.js)が発火
*
* https://www.example.com/bc-proxy/redundantgroups/xxxxxxxxxxxxxxxx
*
* bc-proxy以下のURLを切り取ってLambda@Edgeに渡し、ブライトコーブAPIに
【BTP】Node.jsとPostgreSQLでシンプルなアプリケーションを作成（2）CRUD処理編
##はじめに
この記事は、[Node.jsとPostgreSQLでシンプルなアプリケーションを作成](https://qiita.com/tami/items/267cf5a32ce0547eaa46)シリーズの2回目です。
前回の記事では、Node.jsで作ったシンプルなアプリケーションがBTP上のPostgreSQLに接続できるところまでを確認しました。##この記事のゴール
– Node.jsアプリケーションからPostgreSQLのテーブルに対してCRUD処理を行えるようにする
##ステップ
1. Read処理（全てのレコード）
1. Read処理（指定したidのレコード）
1. Create(Insert)処理
1. Update処理
1. Delete処理###1. Read処理（全てのレコード）
srvフォルダの配下にdb-op.jsというファイルを作成し、ここにCRUD処理を記述します。
プロジェクトの構成は以下のようになります。“`
node-postgres-sample
└ srv
|- package.json
|- d
[m1]asdfでバージョン管理を行なったnodejsを使うまで[mac]
# asdfとは
いろんな言語のバージョン管理がまとめてできるやつ（雑）
類似ツール: anyenv# 環境
– MacBook Air (M1, 2020)
# asdf
https://github.com/asdf-vm/asdf
https://asdf-vm.com/#/core-manage-asdf?id=install
“`
% brew install asdf
“`zshを使ってるので以下を実行
“`
% echo -e “\n. $(brew –prefix asdf)/asdf.sh” >> ${ZDOTDIR:-~}/.zshrc
“`# node
## 準備
https://github.com/asdf-vm/asdf-nodejs
“`
% brew install gpg gawk
“`“`
% asdf plugin-add nodejs
“`## インストール可能なバージョンの確認
“`
% asdf list all nodejs
“`## 最新安定板の確認/インストール
h
【BTP】Node.jsとPostgreSQLでシンプルなアプリケーションを作成（1）準備編
##はじめに
先日、以下の記事を書きました。
[【CAP】CAPをBTPのPostgreSQLにデプロイ](https://qiita.com/tami/items/a7a6b019cf8e82efcf8e)上記の記事で紹介した[cds-pg](https://github.com/sapmentors/cds-pg)、[cds-dbm](https://github.com/mikezaschka/cds-dbm)を使うと、CAPで作成したCDSモデルをPostgreSQLにデプロイして使うことができます。
CAPはテーブル、ビューの登録やCRUD処理を自動的に行ってくれるので、開発者がこれらの作業を意識する必要がありません。一方で、「もしCAPを使わなかったら何をする必要があるのか？」についても知っておきたいと思いました。以下のサンプルプロジェクト（チュートリアル）があったので、これを参考にシンプルなNode.jsアプリを作成して手順を確認してみます。
[SAP-samples/cloud-cf-helloworld-nodejs](https://github.com/S
FATAL ERROR: wasm code commit Allocation failed – process out of memory
node.jsのバージョン15にあげれば解決するらしいけど、どうしてもNode.jsのバージョン12で作業する必要があったので、その時のメモ。
“`
vi ~/.zshrc
“`で下記を記入して、
“`
export NODE_OPTIONS=–max_old_space_size=4096
“`あとは更新。
“`
source ~/.zshrc
“`これで一応、エラーは回避できた。
これが良き方法かはわからないけど、とりあえずまぁ、このまま作業しようっと。笑
