- 0.1. LINE Pay APIを使った決済機能を作ってみた Node.js版 (Version3対応)
- 0.2. 【discordjs】v13でbotを作ってみる
- 0.3. 文字コードを指定してURLエンコードを行う（Node.js）
- 0.4. 【初心者向け】結局package.jsonって何なの？
- 0.5. AtCoder Beginner Contest 213 ~JavaScriptの練習~
- 0.6. 【個人開発／LINE Messaging API】Node.js, TypeScriptで現在地から美味しいお店を探すアプリを作ってみた（②）
- 0.7. 【個人開発／LINE Messaging API】Node.js, TypeScriptで現在地から美味しいお店を探すアプリを作ってみた（①）
- 0.8. node puppetterでwait系の処理を結構書いたので、メモ
- 0.9. nodeで.envを作る
- 0.10. Node.jsで簡易なWebシステムの構築②
- 0.11. Ubuntuに最新版のNode.jsをインストールする
- 0.12. Node.jsからVOICEVOXを使ってみる。
- 0.13. TypeScript + Node.jsで書くTwitterBotの作り方
- 0.14. 学習済みモデルによるYOLOV4(V3)のRTPストリーミングデータ取得処理
- 0.15. 【LINE Messaging API＆Google Sheets API】プッシュ通知で週末に家計簿を通知
- 0.16. DBDリザルトログアプリ
- 0.17. Nuxt.js×Vuetify×Firebaseでポケモン図鑑を作ろう！
- 1. はじめに
LINE Pay APIを使った決済機能を作ってみた Node.js版 (Version3対応)
# 概要
LINE Pay APIを利用したいと考えていましたが、version3の記事が少なかったと感じたので使い方について紹介していければと思います。
また、Node.js版のSDKがversion3ではなさそうだったので、直接APIを実行しています。
（現在はPython版SDKしかない模様？）
今回はLINE botを利用した決済機能という想定で作成しています。# LINE Pay APIについて
LINEユーザーがLINE pay加盟店のサイトで利用できる決済システムを提供しています。
LINE Pay APIを利用するためには加盟店登録を行う必要がありますが、検証目的でのSandbox環境も提供されているので、試してみたい方はこちらの環境を利用します。
登録すれば`Channel Id`と`Channel SecretKey`が渡されますので、こちらを利用していきます。[Sandbox環境の利用方法はこちら]
(https://www.puti-banbeena.com/cgi/2019/11/01/linepay-sandbox/)# LINE Pay API
【discordjs】v13でbotを作ってみる
初書 ： 2021/08/09
node : 16.6.0
discord.js: v13.0.1# 前書き
先日、discord.jsがv13をリリースしたので、早速使ってみる。
なお、初書時点ではスレッドやボタンなど、v13で新しく登場した機能の一部は触れていないが、興味はあるので近々追記もしくは別記事で投稿する予定。# 前提
・botのトークンの取得やサーバーへの導入の準備が終わっていること
・nodejsの基本的な扱いは出来ること。# インストール
まずはnodeのバージョン確認。v13は最低要件で16.6.0を要求するので、それ以下の場合はアップデートする必要がある。
“`zsh
% node –version
v16.6.1
“`もし更新していない場合はnodebrewなどでアップデートする必要がある。
出来れば、次はプロジェクトの作成。今回は単純に`% npm init -y`で作成した。
あとはdiscord.jsをインストールする。
“`
% npm install discord.js
“`また、discordのapiを使
文字コードを指定してURLエンコードを行う（Node.js）
文字コードを指定してURLエンコードしたい。日本語（が含まれるん）だもの。
そういう話です。# encodeURI()はUTF-8を表すエスケープシーケンスで置換される
Node.jsを用いて、あるAPIをGETメソッドでリクエストする処理を実装していました。そのAPIはクエリストリングを
`APIの名前?key1=value1&key2=value2&signature=認証用の値`
にしてリクエスト送信してくださいね、ということで下記のようなソースでクエリストリングを作成。“`js
// 例えばユーザーの情報を取得するAPI
// API名称
const apiName = ‘getUser’;// リクエスト内容
const params = {
name : ‘則巻アラレ’,
age : 13
}/**
* クエリストリングを作成する
* @param {String} apiName API名称
* @param {Object} params リクエスト内容
* @returns クエリストリング
*/
function
【初心者向け】結局package.jsonって何なの？
# 概要
難しい活字は読む気が起きずこれまで目をそらしていた**package.json**だが，いつまでもこのままではいけないのでしっかり理解してみようと思い，重い腰をあげて色々と調べてみた．自分と同じような駆け出しエンジニアの方たち向けに，自分が調べたことの共有ができればと思う．
何かご指摘等ありましたらコメントをいただけますと幸いです．# はじめに
package.jsonがなんたるかを理解するうえで**Node.js**と**npm**の理解は必須であり，本記事もこの2つの知識を前提に書いていく．この2つをしっかり理解した上で読んで欲しい．分量が多くなりそうなので自分は書かない．
本記事ではpackage.jsonとはそもそも何なのか，どういった役割があるのか，どうやって作成するかの3点について書く．近いうちにpackage.jsonの中身については別途詳しくまとめる．# package.jsonとは
`package.json`を一言で表すならば，「**アプリ開発の際に自分がインストールして使ったライブラリと同じライブラリを，他の開発者の人にも使ってもらうための情報が
AtCoder Beginner Contest 213 ~JavaScriptの練習~
# 感想
リアタイで参加したが、実装ミスなどにより最悪な結果となった。
D問題までは難しくなかったが、E問題が大きな壁になった。
E問題のように、操作をコストと捉えてダイクストラや01BFSに落とすのは以前に見たことがあったが、実戦から離れすぎて忘れてしまった。
再び精進する気があまりないので、Kaggleなどの別の競技をやってみるのが良いのかもしれない。
# [A問題](https://atcoder.jp/contests/abc213/tasks/abc213_a)
## 考察
$A \oplus C=B \leftrightarrow C=A \oplus B$なので、xorを計算するのみ。
## 文法
入力の部分が面倒なので、簡素化した方が良いかもしれない。
それ以外は特に感じたことはなかった。
## コード
“`javascript
// inputに入力データ全体が入る
function Main(input) {
// 1行目がinput[0], 2行目がinput[1], …に入る
input = input.split(“\
【個人開発／LINE Messaging API】Node.js, TypeScriptで現在地から美味しいお店を探すアプリを作ってみた（②）
LINE Messaging APIを使って現在地から美味しいお店を探すアプリを作ってみました。
完成形としては以下の通りです。
## アーキテクチャ
今回はサーバーレスアーキテクチャの根幹の機能である、**「AWS Lambda」**, **「Amazon API Gateway」**, **「Amazon DynamoDB」**の3つを使用してアプリを作成します。
## アーキテクチャ
今回はサーバーレスアーキテクチャの根幹の機能である、**「AWS Lambda」**, **「Amazon API Gateway」**, **「Amazon DynamoDB」**の3つを使用してアプリを作成します。;const wait = {
/**
* 指定時間処理を止める
*/
sleep : async (time)=>{
if(time === undefined){
time = process.env.puppet_wait_ms;
}
return new Promise(resolve => {
setTimeout(() => {
resolve();
}, time);
});
},
/**
* 指定のエレメントにselecter要素が表示されるまで待つ
* @param ElementHandle elem puppeteerのElementHandle
* @param string selecter
* @return Promise listで返す
*/
forChildSelecter:async (elem,selecter) =>{
let isShow = false;
nodeで.envを作る
node.jsで設定ファイルを一か所に集めたくなったので、
envファイルで設定値を保存したくなったので調べたら
[dotenv](https://www.npmjs.com/package/dotenv)っていうパッケージを見つけたので、
使ってみた。## dotenvのページ
https://www.npmjs.com/package/dotenv
## インストール
“`bash
npm install dotenv
“`## .envファイルを作る
プロジェクトルートに.envファイルを作る
中身はこんな感じ
“`env:/.env
hoge = hogehogehogehoesetting# 環境変数を定義コメントはこんな感じ
fuga = 設定値“`
## 使う
index.jsに以下を配置
“`javascript
require(‘dotenv’).config();
“`他のファイルでは、読み込む必要は無い
### 設定値の読みだし
“`javascript
console.log(process.env.hog
Node.jsで簡易なWebシステムの構築②
#目的
Node.jsを用いて簡易なWebシステムを構築する。[Node.jsで簡易なWebシステムの構築①](https://qiita.com/MARTOON/items/3a7a4cbd161d07c0ff20)のアプリの拡張で、今回はデータの登録を可能にする。#環境条件
[Node.jsで簡易なWebシステムの構築①](https://qiita.com/MARTOON/items/3a7a4cbd161d07c0ff20)で作業した環境をそのまま利用。#構築手順
ec2-userでログイン
“`
# rootユーザにスイッチ
sudo su –
“`##1.基本的な環境設定
“`
#/opt/nodejsのディレクトリに移動
cd /opt/nodejs
“`express-generatorを用いてアプリケーションのベースを構築。
“`
#expressのインストール
npm install express –save
“`npm WARN saveError ENOENT: no such file or directory,
Ubuntuに最新版のNode.jsをインストールする
Ubuntuに最新版のNode.jsをインストールする方法を紹介します。
また、簡単にですがnpmの使い方も紹介します。OSは「Ubuntu Desktop 18.04.5」です。
## Node.jsのインストール
バージョン14.15.5を利用するため、ディストリビューションの安定版ではなく、NodeSourceで管理されているPPAをインストールします。まず、curlをインストールします。
“`
$ sudo apt install -y curl
“`curlコマンドでNodeSourceからPPAをダウンロードします。
続いて、ダウンロードしたモジュールのビルドに必要になるため、build-essentialをインストールします。“`
$ curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash –
$ sudo apt install -y build-essential
“`下記コマンドでPPAをインストールします。
インストール後は、バージョン確認をします。“`
Node.jsからVOICEVOXを使ってみる。
思い出しながらソースをペーストしているので違ってる部分もあるかも
解説というより思い出す為のメモ程度だと思ってください。# VOICEVOXとは
つよつよエンジニアが作った音声読み上げソフト、詳しくはここ見て
https://voicevox.hiroshiba.jp/# こんなツイートがあったので試してみた
「 #VOICEVOX を外部のソフトウェアから使えますか？」という質問をよく貰います。すごく簡単に使えます！
VOICEVOXの音声合成エンジンはローカルにHTTPサーバーが立っているだけなので、こんな感じでPOSTを叩けばテキスト読み上げができます。
詳しくは localhost:50021/docs をご覧ください。 TypeScript + Node.jsで書くTwitterBotの作り方# はじめに
おはようございます。こんにちは。こんばんは。
Watatakuです。
今回の内容はTypeScript + Node.jsで書くTwitterBotの作り方です。この記事の対象者は以下のとおりです。
# 対象者
– 初学者
– モダン環境でTwitterBotが作りたいって方#書かないこと
– TwitterAPIキーの取得方法
# プロジェクト作成
作業ディレクトリに行き、以下のコマンドを入力する。“`console
$ mkdir twitter-bot
$ cd twitter-bot
$ touch index.ts
$ npm init
“`## typescriptを使えるようにする
“`console
$ npm install -D typescript
$ npm install -D @types/node
$ npx tsc –init$ npm install -D ts-node
“`ts-nodeはjsのトランスパイルなしにtsコードを実行してくれます。
sc –initでtsconfig.jso学習済みモデルによるYOLOV4(V3)のRTPストリーミングデータ取得処理
# 概要
* 前回、運動中にRaspberryPiからMacのキャプチャ画面を保存する処理を作成しましたが、下記気づきがありました。>[RaspberryPiとMESH(ボタンタグ+カスタムタグ)を使ったPCスクリーショット(Mac)の保存操作](https://qiita.com/7rikaz_h785/items/584739d89ac7b7095761)
> ただ、スクリーンショット操作は運動に集中しているとキーでもボタンでも押せないことや押し忘れることがあったため、自動で実行できるような仕組みがあると良いかと思いました。こちらは今後検討予定ですが、映像解析や他デバイスからのトリガーから実行できる仕組みを検討してみようと思います。* 他デバイスからトリガーを送るのもいいですが、個人的な興味と応用の点で映像解析で検討することを考えます。
* 最終的にはZwiftなどの映像をリアルタイムに解析し、トレーニング活用ができるといいですが、まずは、解析結果を元にSSHコマンド送ることを考えます。
* 映像解析はYOLOを使用します。# やること
1. YOLOの環境構築と動作確
【LINE Messaging API＆Google Sheets API】プッシュ通知で週末に家計簿を通知
# はじめに
[前回](https://qiita.com/tacchan5424/items/eae56319e9b84692edfe)は応答通知を作成したので、今回はプッシュ通知に挑戦してみました。
正しい実装かどうかは不明ですが参考程度になりましたら幸いです。# 背景
今年の6月からGoogleのspreadsheetを使って家計簿をつけ始めました。
最初はいくら使ったのか気になって、お金を使ってもいないのに見ていました。
7月は興味が薄れて最終的に何にどれくらい使ったか、把握できていませんでした。そこで、決まったタイミングで支出がどのくらいになっているのか通知しれくれたら便利だなと思い作成しました。
# アウトプット
このようになります。
# 目次
・[LINE Developersの登録とチャンネル作成](#line-de
DBDリザルトログアプリ
前回作ったdbdのマップログアプリを拡張したくなったので、いっそのことリザルトをまとめて記録するアプリを作りました。
Githubにあげてみました。
扱う情報
- 勝敗
- キラー
- 残り発電機
- マップ
- キラー使用パーク
- サバイバーそれぞれの使用パーク
開発環境
- node.js
- Ex
Nuxt.js×Vuetify×Firebaseでポケモン図鑑を作ろう！
はじめに
Nuxt.js×Vuetify×Firebaseでポケモン図鑑をSPA(Single Page Application)で開発していきます。
何回になるのかわかりませんが複数回に渡って実装の手引きを紹介します。######ポケモン図鑑の機能は以下の通りです。（多いぞ笑）
・ユーザー認証（登録・ログイン・ログアウト）
・約900匹のポケモン一覧表示
・約900匹それぞれの個人ページ
・ポケモンをお気に入りに追加する
・ポケモンを手持ちに加える
・ポケモンをタイプで絞り込む
・ポケモンを名前で検索する
・種族値をグラフ化する
・自分の手持ちをタイムラインに投稿する
・他の人の手持ちをタイムライン表示する※機能追加も可能性としてあります。
######この記事で学べること
・Vue.js, Nuxt.jsの基礎的な理解
・VuetifyによるUI設計
・Firebase Hosting によるSPAデプロイ
・Cloud Firestoreを用いたNoSQLデータベース設計
・Firebase Authenticationを用いたユーザー認証
・axi
M5StickCでまたパスワード入力装置を作った
以前にも、M5StickCでパスワード入力装置を作成しました。一方で、以前パスワード管理アプリ・サーバをPWAで作成していました。
今回は、この2つを組み合わせて、より使いやすいパスワード入力装置を作ります。以前の記事は以下にあります。
* [PWAを試してみよう](https://qiita.com/poruruba/items/77cbb6448d804e6e996b)
* [M5Stick-Cでパスワード記憶装置 兼 自動入力装置を作る](https://qiita.com/poruruba/items/6e4e29068a28f5ee1711)ソースコードもろもろは新たに以下のGitHubに上げています。
poruruba/PasswordReminder
※当然ですが、自己責任でお願いします。https://github.com/poruruba/PasswordReminder
でAuth0を使ったOIDCログインを実装するまで
:::note info
完全に初心者の趣味です。勤務先や所属する団体の活動とは関係ありません。
:::## tl;dr
* OpenID Connect(OIDC) でログインする、Single Page App(SPA) もどきをNode.jsで作りました。
* 作ったSPAもどきで、Auth0を利用してみました。サインアップから、Auth0を使ったログイン完了まで、初見で12分で終わりました。
* 一応利用規約も簡単に目を通した。
* 一番迷ったのは無料サインアップまでのルート。
* 作ったSPAもどきの解説は後半です。
* Google IDでログインするための設定も最後に。## まずは実際に動かしてみる
Node.jsがlocalhostで動く環境が前提です。（localhostじゃないときはlocalhostって書いてある部分を適当に変えてください）
### Auth0のサインアップ
Google検索で「Auth0」と入れて、**広告の下のリンク**をクリックします。
## 考察
問題文の通りに条件分岐を実装する。
## 文法等
Progateを使ったのみで把握していないことが多かった。
### 実行方法
AtCoderのJavaScriptの実行環境はNode.jsである。
そのため、用意したJSファイルは`node ファイル名`で実行することができる。### モジュールのインストール
Node.jsにおけるパッケージ管理ツールがnpmである。
また、npmはコマンドによりインストール等を行うことができる。例えば、インストール用のコマンドは`npm install モジュール名`となる（グローバルにインストールしたい場合は`-g`）。
ただし、AtCoderで使う場合は
