- 1. npm installでインストールできるモジュールを作るまでの流れについて
- 2. 【2020年6月版】VSCodeでTypeScript + Nodeプロジェクトをデバッグする
- 3. MEANスタックの一歩前。Angular と Express の連携
- 4. ESLint v7.2.0
- 5. JavaScriptの勉強
- 6. Slack API×AWS Lambda×Node.jsで作るチャットボット開発
- 7. Nodeのバージョンを12に上げたら`Cannot find module ‘@babel/compat-data/corejs3-shipped-proposals’`というエラーが出て困った
- 8. iOSネイティブアプリでalgoliaを使ってみる
- 9. AWS LAMBDAでLINE BEACON動かしたいが、どうするの?
- 10. Node.js の Lambda 関数を ローカルでテストする (その2)
- 11. 新人に負けない本棚管理サイト その5(データベース検索編②+おまけ)【一部工事中】
- 12. FIDO2(WebAuthn)に入門してみた – ユーザ認証編
- 13. Node.js + axios で XMLのレスポンスを扱う
- 14. Lambda 関数から Lambda 関数を呼び出す (Node.js)
- 15. node v12 puppeteer-coreとChromeでWEBページからスクリーンショットを取る
- 16. AWS LightSailにサーバー環境構築してVSCodeで開発①
- 17. 自動売買☓bitflyer.comでHTTP API使ってみたよ?
- 18. [JS1日クッキング]APIサーバーをCircleCIで自動テスト
- 19. 【array-foreach-async】forEach()でasync/awaitを使おうとして失敗した皆へ
- 20. Node.jsをPHPで書き換えてみた
npm installでインストールできるモジュールを作るまでの流れについて
# はじめに
npmでインストール可能なモジュール(パッケージ)のなるべく最小構成の作成方法が中々見つからなかったので、簡単にまとめました。
# 環境
– Node.js 12.16
– npm 6.14# ファイル構成
npmパッケージには、1つのディレクトリ内にモジュールのソースコードセット、`package.json`、エントリーポイントとなるjsファイル(今回は`index.js`とする)の3種類が必要となる。今回の例としては、ディレクトリをmodtest、モジュールのソースコードをサブディレクトリlibの配下に2種類(hello.js, hello2.js)、index.jsとします。
– modtest/
– lib/
– hello.js
– hello2.js
– index.js
– package.json# モジュールの作成
## 1. ディレクトリ作成
空のディレクトリ(今回はmodtest)を作成しておきます。## 2. package.jsonの作成
空のディレクトリへ移動し
【2020年6月版】VSCodeでTypeScript + Nodeプロジェクトをデバッグする
## TL;DR
[devinoue/typescript-node-project](https://github.com/devinoue/typescript-node-project)
こちらからご使用ください。## インストール
### よく使うパッケージのインストール基本的なパッケージを入れます。
“`shell
yarn add -D ts-node ts-node-dev typescript @types/node
“`以下のような内容になっています。
| パッケージ名 | 役目 |
| ———— | ———————————————————— |
| ts-node | tscを使ってプリコンパイルなしにTypeScriptを実行するnpmパッケージ。
typescriptコンパイラはバンドルされていないので、別にインストー
MEANスタックの一歩前。Angular と Express の連携
# 始めに
最近MEANスタックの学習をしており、Angularのチュートリアルにある「Tour of Heroes」を一通りこなしました。
Express サーバも、それ自体は構築できたのですがAngularと連携させようとすると途端に難しかったため、記事にして残しておこうと思います。「Tour of Heroes」をAngularのサイトからダウンロードする所から始めたいと思います。
# 開発環境
開発環境を統一しておくことは重要だと思います。
私はWindows10でVisual Studio Codeを使用しています。
コマンドはWindowsのコマンドプロンプトから行います。## Node.js
Node.js は[こちら](https://nodejs.org/ja/)からダウンロードします。
私は V12.16.3 を使用しました。# Visual Studio Code
エディタは何でも良いのですが、Visual Studio Codeは[こちら](https://azure.microsoft.com/ja-jp/products/visual-stud
ESLint v7.2.0
前 [v7.1.0](https://qiita.com/mysticatea/items/46c93f13776b24b9d1b9) | 次 (2020-06-20 JST)
ESLint v7.2.0 has been released!https://t.co/8dSO0Hc5X7
— ESLint (@geteslint) June 6, 2020
ESLint `7.2.0` がリリースされまし
JavaScriptの勉強
#NODE.JS
これまでPYTHONオンリーでやってきたが、最近はNODE.JSを触り始めている。NODE.JSについては、周辺のライブラリを組み合わせて
簡単に何でも作ってしまうというのが非常に優れている印象。PYTHONはFLASK,DJANGOというフレームワークと
PANDAS,AI関連のライブラリがもてはやされているが
node.jsもPYTHONと同じようなところを
目指しているような気がする。JAVASCRIPTと言えば、これまではWEBのフロント中心であるが、
最近はバックエンドのサーバー側も作れるのであるから、
学習コストは少しは減る
(といっても、PYTHONを新規でやるのと、対して労力は変わらないが)一点だけ、pythonより優れると思うのは、
ELECTRONでアプリケーションが作れることこれはVS-CODEでも、お馴染みで結構さくさく動かせる
(その根底のデザイン技術は、WEBベースでいいらしい)そうなってくると、これは完全にマイクロソフトの.NETと
違った世界感になってくる。もちろんC#や、.NETが使えることは、マイクロソフ
Slack API×AWS Lambda×Node.jsで作るチャットボット開発
# Slack API×AWS Lambda×Node.jsで作るチャットボット開発
Slack APIをLambdaと組み合わせると、様々なことができます。
「スマホからも操作できるSlackで、Lambda関数を実行できる」というだけで、その応用範囲は多岐にわたります。今回、SlackとLambdaを使ってチャットボットのサンプルを作る機会があったため、そこで得た知識をまとめ、手順化してみました。
この内容を理解することで、以下のようなことができます。– Slackのワークスペースにボットを配置する。
– ボットにDMを送ると、AWSのLambda関数を実行するように設定する。
– Lambda関数の処理で、Slackのワークスペースにメッセージを投稿する。細かく手順を作ったので、初心者も手を付けやすいと思います。
ぜひここで基礎部分を学んでから、自分のやりたいことに応じて調べてみてください。第9節までありますが、基礎の部分は4節までですし、アカウント作成などが無ければ1章あたり20分くらいでできると思います。
# 目次
– [概要](#概要)
– [シス
Nodeのバージョンを12に上げたら`Cannot find module ‘@babel/compat-data/corejs3-shipped-proposals’`というエラーが出て困った
Nodeのバージョンを12に上げた際、`Cannot find module ‘@babel/compat-data/corejs3-shipped-proposals’`というエラーが出たので解決法をメモ
結論
@babel/coreと@babel/preset-envのバージョンを以下に指定したら解消された。
“@babel/core”: “^7.9.0”,
“@babel/preset-env”: “^7.9.0”,参考にしたリンク
https://github.com/storybookjs/storybook/issues/10477
iOSネイティブアプリでalgoliaを使ってみる
#なぜalgolia?
アプリなら大体ついてる機能、「キーワード検索」。アプリ側にデータを持たせてfilterやsortを使うのは、めちゃめちゃスペックが落ちるので絶対に避けたいです。
ネイティブアプリのエンジニアであれば、Firebaseを愛用している方も多いかと思いますが、Firebaseでサポートされていないのがクエリの「全文検索」です。指定したキーワード通りの単一・複数ドキュメントをとってきたり、ソートのクエリを追加したり、indexをふるなどはできますが、全文検索はサポートされていません。そこで、公式ドキュメントが推奨する「algolia」を使って、全文検索機能を補填しようと思います。
#作るものイメージ
アプリからFirestore
AWS LAMBDAでLINE BEACON動かしたいが、どうするの?
AWS LAMBDAでLINE BEACON動かしたいが、どうするの?
誰か教えて〜!!!!今BOTまで完成し、次はビーコンをやってみようとしてるのだがうまくいかない。。。
LAMBDAの中身はこんな感じです!
どうやったらビーコンってから返事帰ってくるの〜???
‘use strict’
const line = require(‘@line/bot-sdk’)
var event
var context
var callbackexports.handler = (_event, _context, _callback) => {
event = _event
context = _context
callback = _callback
main();
};var main = function () {
const client = new line.Client({
channelAccessToken: ”
})// define default response wh
Node.js の Lambda 関数を ローカルでテストする (その2)
AWS のコンソールから、ダウンロードして解凍した index.js を実行する方法です。
![download_package.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/179446/76c27478-5268-866a-d4a9-87b25557fa1f.png)
フォルダー構造
“`text
$ tree example01/
example01/
├── index.js
└── test_local.js
“`“`js:index.js
exports.handler = async (event) => {
// TODO implement
console.error(“***** start example01 PM 18:49 ***”)
var rvalue = {}
rvalue[‘key1’] = parseInt(event[‘key1’],10)
rvalue[‘key2’] = parseInt(event[‘k
新人に負けない本棚管理サイト その5(データベース検索編②+おまけ)【一部工事中】
# 目次
[新人に負けない本棚管理サイト その1(プロローグ)](https://qiita.com/moootoko/items/9a2282b018c1e78da04b)
[新人に負けない本棚管理サイト その2(環境構築編)](https://qiita.com/moootoko/items/615b0d135b6914d2c83c)
[新人に負けない本棚管理サイト その3(トップページ作成編)](https://qiita.com/moootoko/items/1aff180e4dd8d3b153d2)
[新人に負けない本棚管理サイト その4(データベース検索編①)](https://qiita.com/moootoko/items/fa04251b9b078c75a4b9)
**新人に負けない本棚管理サイト その5(データベース検索編②)**
新人に負けない本棚管理サイト その6(データの削除・登録・更新)# 目標
– データベースに問い合わせしてデータを取得する
– 取得したデータを画面に表示する
– 検索できるようにする ←今回はココだけ
– おまけ(MVC化
FIDO2(WebAuthn)に入門してみた – ユーザ認証編
# 始めに
この記事は、WebAuthnを使用したユーザ認証フローに関する記事です。
登録処理は、[FIDO2(WebAuthn)に入門してみた – ユーザ登録処理](https://qiita.com/s001_kawamura/items/7fa90958c8a8358f248b)から参照してください。
また、作成したソースコード一式は[こちら](https://gitlab.com/s.kawamura/fido2-man-stuck-sample)に格納しておきます。
# 認証サーバ(Relying Party)を自作してみた
## 実装言語・FW
[FIDO2(WebAuthn)に入門してみた – ユーザ登録処理](https://qiita.com/s001_kawamura/items/7fa90958c8a8358f248b)の続きとなるので、当然MANスタックで実装します。
– 認証サーバ;Nest.js v6.13.3
– JavaScript Application;Angular v9.0.4
– Database;MongoDB##
Node.js + axios で XMLのレスポンスを扱う
## はじめに
最近、Node.js + axios の組み合わせでレスポンスボディがXMLで返ってくるWebAPIを呼び出すことがあったので、その時にやったことを書いておきます。
## axiosでXMLを扱うには
axiosでレスポンスボディがXMLの場合、次のように`config.responseType`に`’document’`を指定すると、Documentオブジェクトとして取得することができます。
“`js
const url = ‘https://status.aws.amazon.com/rss/appsync-ap-northeast-1.rss’;
const config = {
responseType: ‘document’
};
const response = await axios.get(url, config);
const data = response.data; // data は Documentオブジェクト
“`ただし、これは実行環境がブラウザの場合でNode.jsの場合はXMLが文字列をとして返ってきます。
XML文字
Lambda 関数から Lambda 関数を呼び出す (Node.js)
次のページを参考にしました。
[AWS lambdaでハマったこと (lambdaからlambdaを呼び出す)](https://took.jp/post-1037/)メインプログラム
“`js:callSample/index.js
const AWS = require(‘aws-sdk’);
const lambda = new AWS.Lambda();
exports.handler = function(event, context) {
console.error(“*** start callSample PM 18:57 ***”)const event_aa = {
“key1”: 118,
“key2”: 216,
“key3”: 314
}const payload = JSON.stringify(event_aa)
const params = {
FunctionName: ‘example01’,
InvocationType: ‘RequestResponse’,
node v12 puppeteer-coreとChromeでWEBページからスクリーンショットを取る
node.js v12.10で座標での画面キャプチャを取得するサンプルを書きました。
探してもあまりネタが無かったので、お試しです。
[Git hub:node_puppeteersample](https://github.com/ajitama/node_puppeteersample)
puppeteerを使用するに当たり、ブラウザが必要になるようです。
AWSで利用する場合は、puppeteer(chrome付き)ではサイズオーバーみたいなので、
puppeteer-coreと、AWSの提供?するChromeアプリを指定してあげないと駄目みたいですね。ソースはほとんど、他のサイトからのコピペです。
AWS LightSailにサーバー環境構築してVSCodeで開発①
# TL;DR
AWS Lightsailインスタンスの立ち上げ~VSCodeでssh接続してみるだけ。画像多めでお送りします。
環境構築系は沼りやすいので、似たような記事は他にもありますが自分用に記録。
なお、Lightsailに限らずEC2などでも(接続の部分に関しては)同様の手順になります。[こちら](https://qiita.com/dairappa/items/8347fe7faf89b6ba364e)や[こちら](https://qiita.com/hystking/items/c1b23ff0c7cc727e7385)も参照。# 環境
Windows10# ブラウザでの作業
## Lightsailを開く
アカウントは作成してある前提です。まずログインして、赤丸クリック。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/602411/aa93509a-89f4-d432-283e-291919359fbe.png)## ガイドに従ってインスタンスを作成する
自動売買☓bitflyer.comでHTTP API使ってみたよ?
自動売買☓bitflyer.comでHTTP API使ってみたよ。?
使ってみて思ったことはリアルタイム処理とHTTP APIを混合で
使うべしだと・・・。ただ・・ビットコインの価格高いよね。
私には買えない。“`javascript:http_api.js
//板情報
var F = require(‘./api-bitflyer.com.js’);
F.Fapi.init = {
key:”apikey”,
secret:”secretkey”,
method:”GET”,
path:”/v1/getticker”,
data:{product_code:”ETH_JPY”}
};
F.Fapi.run();
““
“`javascript:api-bitflyer.com.js
exports.Fapi = {
init: {
key: “”,
secret: “”,
method: “”,
path: “”,
data: “”
},
run: function () {
var request = require(‘req
[JS1日クッキング]APIサーバーをCircleCIで自動テスト
何かを簡単に作って、ちょっとした勉強になる。そんなシリーズになる予定のものの第3回です。
今回は、シンプルなAPIサーバーをCircleCIで自動テストをします。テストは[前回](https://qiita.com/kei_lb6/items/c0923745dd8ecfaa68f7)にしてあるものを使います。
完成品はこちら -> [sequelize-todo-api-server](https://github.com/kei-lb6/sequelize-todo-api-server/tree/ci-test)
[JS1日クッキング まとめページ – Qiita](https://qiita.com/kei_lb6/items/c0923745dd8ecfaa68f7)
# 材料
– [ユニットテストをした前回のサーバー](https://github.com/kei-lb6/sequelize-todo-api-server/tree/test)
– [CircleCI](https://circleci.com/ja/)
– jest-junit# 作り方
【array-foreach-async】forEach()でasync/awaitを使おうとして失敗した皆へ
AWS Lambda関数でNode.jsを使用し、forEach()でasync/awaitしたい状況に陥ったのですが、コードを書いて実行してもawaitの文が実行されていませんでした。色々調べたところ、Node.jsの**`array-foreach-async`**というライブラリを利用することで簡単に解決することができたので、まとめていきます。
# 環境
– macOS
– AWS Cloud9
– Node.js 12# 修正前の実行コード
今回の説明において不要なコードは省略しています。“`javascript
const env = process.env
const requestPromise = require(‘request-promise’);
const AWS = require(‘aws-sdk’);
const DB = new AWS.DynamoDB.DocumentClient();exports.handler = async(event, context) => {
// (省略)
event
Node.jsをPHPで書き換えてみた
N予備校のプログラミング入門コース3章で作成した「秘密の匿名掲示板」をPHPで書き換えてみたので,その記録です。
#きっかけ
スラスラわかるPHP(志田 仁美 著 翔泳社 刊)をやってみて,
「この間作った匿名掲示板,書き換えられるのでは?」
と思ったので。
スラスラわかるPHPをやってみた所感は[こちら](
https://note.com/ayareily/n/n56391bc9cb41)#早速書き換える
##仕様を変更したところ
– 認証の方式
おそらくN予備校ではBasic認証(alartみたいに上に出てくるやつ)を使っていたと思いますが,
書き換えの際にはスラスラわかるPHPのように,DBを使用する方式としました。
– TrackingID
N予備校で作成した際はCookieを利用してTrackingIDを実装していたと思いますが,セッションを利用する方式としました。その他細かい変更点はあると思うのですが,大きく変更したのはこちら2点です。
##書き換えで苦労したところ
###記事とユーザーの情報をどう関連付けるか
Laravelでは
userテーブル