- 1. azure app service で kintone アプリデータ公開
- 2. TypeScriptのExpressアプリケーションを作る
- 3. コメント欄はいらない!Webmentionを使ってブログにツイッターでの反応を表示する (Part 1)
- 4. localStrageメモ
- 5. TypeScriptのクラスをドラクエ風のステータスを実装しながら学んでみた
- 6. node.jsからWebsockets経由でOBSを操作する
- 7. nuxtでDOMException: Failed to execute ‘appendChild’ on ‘Node’エラー
- 8. amazon-qldb-driver-nodejsからQLDBを使う①(接続編)
- 9. docker コマンドだけで起動する proxy サーバ
- 10. Auth0のログをリアルタイムでエクスポートできるようになったぞー
- 11. 花粉症対策デジタル医療相談Botの開発 GASでユーザー毎に飛散予測を定時プッシュ
- 12. AWS Lambda入門(Node編)
- 13. AIに歌を聞かせた。そして彼は笑顔?になった。(COTOHA-感情分析API)
- 14. Windowsでnpm startしたときに「内部コマンドまたは外部コマンド~」と出てくる現象と戦う
- 15. RESTサーバのMockを簡単に作る方法
- 16. Kabaneroプロジェクトアップデート(2020年2月25日)
- 17. node.js学習メモ
- 18. GETとPOST
- 19. npmコマンドの直列処理、並列処理の簡単な記述
- 20. Windowsでのnpm installの使い方
azure app service で kintone アプリデータ公開
kintone のアプリデータをazure app service で公開してみます。
# 概要
プラグインを購入いただいたお客様のサポートやプラグインのバージョンアップなどで、kintone アプリを使ってどうにか出来ないかと調べています。
kintone アプリデータを外部に公開する外部サービスがありますが、簡単にできる反面、いろいろ制約があったりします。
azure app service で、kintone アプリデータを外部に公開する試作をしてみます。# 環境
いつも使っている PC 環境で開発・テストして、azure へデプロイ。– 開発環境
– Windows 10
– Visual source code
– node.js, Express, pug
– [kintone JS SDK](https://developer.cybozu.io/hc/ja/articles/360025484571)– azure環境
– east asia (東京)# 開発準備
vscode, node, npm あた
TypeScriptのExpressアプリケーションを作る
## 動作環境
– macOS Mojave
– node v12.14.1
– npm 6.13.4
– express 4.16.4
– typescript 3.8.2## 最終的なコード
最終的なコードは以下に上げてあるので、先に見たい方は御覧ください。
https://github.com/jumperson/quick-start-express-typescript## 作成手順
### JavaScriptのExpressアプリケーションを作成する
[Express のアプリケーション生成プログラム](https://expressjs.com/ja/starter/generator.html) に従って作成していきます。
グローバルにexpressをインストールします。
“`
$ npm install express-generator -g
“`インストールしたコマンドで作業ディレクトリに `quick-start-express-typescript` という名のExpressアプリケーションを作成します。
“`
$ expre
コメント欄はいらない!Webmentionを使ってブログにツイッターでの反応を表示する (Part 1)
2020年。Gatsbyなどを使ってブログをゼロから一晩で作れる時代になった。特に投稿を、レポジトリの一部として、Github/Gitlabに保管すると、staticなプロジェクトとしてデプロイもすごく楽。だが、コメント機能を実装したければ、もともと不要だったデータベースが必要になって、一気にめんどくさくなる。自分でDBを管理したくない人は、Disqusのようなthird-partyサービスを使う選択肢もあるけど、有料。そこにWebmentionが登場する!
## Webmentionとは
厳密にいえば[Webmention](https://ja.wikipedia.org/wiki/Webmention)というのは**プロトコル**の名前である。そして現在は、[W3Cの勧告](https://www.w3.org/TR/webmention/)である。
ただ、SNS・チャットによくあるみんなお馴染みの「メンション」のような概念として理解しても良い。Twitter/FB/Instagramと違って、自分のブログを誰が読んで、どこでリンクをシェアしているかは、Googleの分析を
localStrageメモ
#localstrageとは
クライアント側のみで動く、データを保管するもの。
「情報をブラウザ上に保存しておく場所」クライアント側のみで動く為、メッセージを送信する際はIDも一緒に送る必要がある。
(inputのvalueに値を指定などで)#身近な例
ユーザーがあるサービスにログインした場合、ログイン情報をローカルストレージ上に保存しておくことで、次回ユーザーが訪れた時に自動ログインが完了しているパターンなどが考えられます。#参考
https://toukei-lab.com/localstrage
TypeScriptのクラスをドラクエ風のステータスを実装しながら学んでみた
## はじめに
– `npm: 6.13.7`
– `node: 13.8.0`
– `TypeScript: 3.8.2`TypeScript 学習のため、ドラクエ風のステータス出力をクラスで実装してみました。
– ステータス
“`
HP: 体力
ATK: 攻撃力
DEF: 防御力
“`今回はステータスの出力までですが、次の機会はダメージ計算なども追加して実際にバトルをさせてみたいと思います。
## TypeScript のクラスについて
– 完成
“`dorakue_style.ts
class Brave {
name: string;
hp: number;
atk: number;
def: number;constructor(name: string, hp: number, atk: number, def: number) {
this.name = name;
this.hp = hp;
this.atk = atk;
this.def = def;
}
node.jsからWebsockets経由でOBSを操作する
動画配信ソフトのOBSをコードから操作して自動化したいなと思ったので調べたメモです。
## obs-websocket
WebSocketsでOBSを操作出来るようにするプラグインです。
https://github.com/Palakis/obs-websocketインストーラーが用意されているのでGUIからインストールするだけでOBSメニューの「ツール」に`WebSockets Server Settings`という項目が追加されます。
## obs-websocket-js
上記のWebsockets APIのJSラッパーです。
https://github.com/haganbmj/obs-websocket-jsREADMEに書いてある通りに書けば動きます。
exampleそのままですがコメント付きのサンプルコードも乗せておきます。“`javascript
// ライブラリのimport
const OBSWebSocket = require(‘obs-websocket-js’);// インスタンス初期化
const obs = new OBSWeb
nuxtでDOMException: Failed to execute ‘appendChild’ on ‘Node’エラー
#Failed to execute ‘appendChild’ on ‘Node’
`nuxt` でこんな感じのエラーが出る
因みに`dev` では出ない。“`
DOMException: Failed to execute ‘appendChild’ on ‘Node’: This node type does not support this method.
at Object.appendChild
“`#原因
`` タグ内に `` が入ってると起こる
色々なエラーにつながるので原因究明がしづらい。注意。
amazon-qldb-driver-nodejsからQLDBを使う①(接続編)
## QLDBとは
https://aws.amazon.com/jp/qldb/
Amazonが提供するフルマネージド型の台帳データベースです。
ブロックチェーンとは異なり中央集権で管理されます。データに対する変更は全て記録され、後から確認可能なようです。
また、変更履歴が正確であることを暗号的に検証する機能を提供しています。
https://docs.aws.amazon.com/qldb/latest/developerguide/verification.html中央集権からトランザクションの実行時にネットワーク参加者の合意を経る必要がないため、一般的なブロックチェーンベースのフレームワークより高いスループットが出るようです。
以上から、「データの信頼性やトレーサビリティを担保したいけど、分散型である必要はない」などの場合にとても魅力的な選択肢になりそうです。
## amazon-qldb-driver-nodejsについて
プログラムからアクセスする場合は現状はJavaのdriverを使うのが主流なようです。
nodejs用のdriverも用意されており、今
docker コマンドだけで起動する proxy サーバ
[proxy](https://www.npmjs.com/package/proxy) という npm パッケージを node コンテナで実行するだけでお手軽に proxy サーバが起動できる。
## コマンド
“`terminal
$ docker run –rm -p 8888:3128 node npx proxy
“`* proxy コマンドはデフォルトで `3128` ポートをListenするのでそれをホスト側の `8888` にポートマッピングしている
## ブラウザの設定(Firefoxの場合)
[![Image from Gyazo](https://i.gyazo.com/2eb1934ca5363809fe8d8e68da81b73b.png)](https://gyazo.com/2eb1934ca5363809fe8d8e68da81b73b)
* Manual Proxy setting でホスト名を `localhost`、ポート番号を先のコマンドでポートマッピングしたportに設定
## 参考
* [npm 5.2.0の新機能
Auth0のログをリアルタイムでエクスポートできるようになったぞー
[Auth0のログをBigQueryを使って永続化したかった – Qiita](https://qiita.com/akagire/items/4e9f2028915f6e31c8b4)
こちらの記事でも書かせていただいたとおり、 Auth0 のログ保有期間 Enterprise でも30日と、比較的保有期間が短いことがネックになっていました。私が今担当しているプロジェクトでは Firebase を利用しているため、
ログを定期的に API を使って取得し、 Storage にエクスポートしています。ふとダッシュボードを見ると、Logs の中に Streams という機能が追加されており、見ると AWS の EventBridge と Webhook が使えそうなので、早速使ってみました。
## Log Streams
[Log Streams – Auth0](https://auth0.com/docs/logs/streams)
[HTTP Event Log Streams – Auth0](https://auth0.com/docs/logs/streams/ht
花粉症対策デジタル医療相談Botの開発 GASでユーザー毎に飛散予測を定時プッシュ
##概要
現在スギ花粉症患者さん向けに医療機関を受診しなくてもLINEで市販の医療用医薬品を使い分けることが出来るサービスを開発中です。3月4日までCAMPFIREでテスト版ユーザー募集中です。花粉症の方は是非ご参加ください!
CAMPFIREのプロジェクトページはこちら
[LINEで花粉症の重症度や最適な市販薬がわかるデジタル医療相談【アレルナビ】](https://camp-fire.jp/projects/view/218592)以前のQiita記事はこちら
[花粉症対策デジタル医療相談Botの開発 ユーザーIDと位置情報をFirestoreで管理](https://qiita.com/doikatsuyuki/items/375a827c8f8e9fbc4937)ユーザーが特定した地点のピンポイント花粉飛散予測を定時にプッシュする機能を開発中なのでその辺りをまとめました。
##作成方法
**1. 気象予測API**
今回のアプリではこちらの気象APIを利用しています。
[Lifesocket](https://lab.life-socket.jp/life_so
AWS Lambda入門(Node編)
## 概要
– ServerlessFrameworkを使ってLambda関数を作り、ローカルで動作確認したあとにAWSにデプロイしてアクセスするところまでやってみます
## Lambdaとは
– LambdaはAWSが提供するサービスの1つで以下のような特徴を持ちます
### サーバーレス
– 通常のアプリケーションはサーバにデプロイし稼働させることでアクセスすることができますが、当然サーバが止まっていたら利用することはできません
– Lambdaはサーバーレスに分類されるサービスで、アクセスがあるとそのつど起動し処理が実行され終了すると停止します
– つまりLambdaはサーバの死活監視のようなことをする必要がなく、また課金も実行時間単位なので金銭面でもお得といった特徴があります### FaaS
– LambdaはいわゆるFaaS(Function as a Service)に分類されます
– つまり、Function(関数)をデプロイして、それを公開するサービスというわけですね## 関数の作成
– 今回は[ServerlessFramework](https
AIに歌を聞かせた。そして彼は笑顔?になった。(COTOHA-感情分析API)
# 概要
歌を聞かせた。
彼はその歌を聴き、
Positiveな感情になると笑い?、
Negativeな感情になると怒り?、
Neutralな感情になると。。。?([COTOHA](https://api.ce-cotoha.com/contents/index.html)の[感情分析API](https://api.ce-cotoha.com/contents/reference/apireference.html#sentiment)を使って、歌の歌詞からどのような感情をくみ取るのかを試した。[COTOHA API for Developers](https://api.ce-cotoha.com/contents/developers/index.html)に登録してすぐに、感情分析APIを試せるよう[**WEBアプリ**](https://cotoha-demo.now.sh/)も作った。)
# 結果
とりあえず歴代CDシングル売り上げ枚数ランキングを聞かせた。
「1位から順に!カウントアップ!?」## 1.(457.7万枚)およげ!たいやきくん
“`:?
“
Windowsでnpm startしたときに「内部コマンドまたは外部コマンド~」と出てくる現象と戦う
# 1. 問題発生
[Webpackをglobalにインストールすることが非推奨](https://webpack.js.org/guides/shimming/)であることを知り、
“` cmd
> npm remove -g webpack webpack-cli
“`としたところ、既存のプロジェクトにて
“` cmd
> npm run build
‘webpack’ は、内部コマンドまたは外部コマンド、
操作可能なプログラムまたはバッチ ファイルとして認識されていません。
“`と出てしまった。
package.json の scripts はこんな感じ“` package.json
“scripts”: {
“build”: “webpack –mode development”,
}
“`ひとまずこれは再度グローバルにインストールすることで回避していたが、
ある日、Reactの勉強を始めようとしたところ、“` cmd
> npx create-react-app pwa-sample
> cd pwa-sample
> yarn
RESTサーバのMockを簡単に作る方法
# node.jsのjson-serverを利用する
json-serverというライブラリが素敵な感じ。## 導入
ローカルに導入するとして。。。
1. 展開場所確保
npm init
2. インストール
npm install json-server
3. キック用にpackage.jason書き換え“`package.json
“scripts”: {
“test”: “echo \”Error: no test specified\” && exit 1″,
“json-server”: “json-server”
},
“`
4.mockデータファイル用意。例えばこんな感じのjsonだとするとtop下の階層がエンドポイントになる感じ。“`mockdata.json
{
“movies”: [
{ “title”: “マトリックス”, “rating”: 9.1},
{ “title”: “タイタニック”, “rating”: 8.8}
],
“user”: [
{“name”: “fukuhara”,
Kabaneroプロジェクトアップデート(2020年2月25日)
昨年プロジェクトが発表されたKabaneroですが順調にいろんなコンポーネントが揃ってきたようです。今日は実際にどんな風に使えるのという観点でまとめてみました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/59741/5b9b8f0d-8424-6831-9b65-365a21cb3f09.png)
https://kabanero.io/GitHub
Kabanero https://github.com/kabanero-io#Kabaneroとは?
昨年 @yamachan360 が書かれている基本方針は変わらないです。参考にしてください。
Kabanero 公式ページをざっと翻訳してみた (2019年8月版)
https://qiita.com/yamachan360/items/7b4a53758ecdbe876a5f-日本IBMの紹介サイト
BLOG IBM から始まった新しいオープン・ソース・プロジェクト Kabanero を使用して、Kubernetes
node.js学習メモ
関数の引数のrequestには、ブラウザからアクセスがあった時に情報が入ってきて(url,methodなどの情報)、情報を取り出すときは、関数内で
“`
request.メソッド
“`で情報を取り出せる。
GETとPOST
#GET
普通にwebサイトにアクセスするとき、Webブラウザは「GET」という方式でアクセスをしています。
GETはアクセスの基本と考えていいでしょう。GETは「いつ、どこからどうアクセスしても同じ結果が返されされる」というようなものに使います。
#POST
「POST」といのは、フォームなどを送信するときの基本となる送信方式です。POSTは「その時、その状況でその表示」を行うような場合に使われます。
#参考
node.js超入門 p130
npmコマンドの直列処理、並列処理の簡単な記述
`npm`コマンドを簡単に記述して、直列処理、並列処理を行います。
# 前提条件
– npmがインストールされていること
– package.jsonがあること# インストール
“`shell
$ npm install -D npm-run-all
“`# 使い方
## 設定`run-s`の後にコマンドを書くと直列、`run-p`の後にコマンドを書くと並列で処理を行ってくれます。
コマンドを`hello:*`と書くと、当てはまるすべてのコマンドを処理します。“`json:package.json
{
“scripts”: {
“hello:foo”: “echo FOO”,
“hello:bar”: “echo BAR”,
“hello-s”: “run-s hello:foo hello:bar”,
“hello-p”: “run-p hello:*”
}
}
“`## 実行
`npm`コマンドで`hello-s`または`hello-p`を実行します。“`shell
$ npm run hello-s
“
Windowsでのnpm installの使い方
# サマリ
– npm installでパッケージをインストールする際「-g」オプションの有無による違い
– npm install -gによる資材の配置場所の変更方
– npm installでインストールされたパッケージの確認方法
– npm installでインストールされたパッケージの削除方法# 目的
node.jsを学習する際、npm installの使い方がわからず挫折しそうになった。
原因として、各記事で「-g」オプションの有無にばらつきがあり、
「-g」オプションの有無による具体的な違いやnpm install実行後の確認方法がまとまって説明されている記事がなかなか見つからなかった。
同じことで困った人の参考として、自分の実行例と合わせて説明を記載する。# 本文
## 1. npm installコマンドの効果
node.jsで利用するパッケージをダウンロードできる。
ダウンロードしたパッケージはrequireで取得・利用できるようになる。
例)expressをインストールした場合
`var express = require(‘express’)`## 2