- 1. CloudFunctionsで文字列をハッシュ化したいならcrypto
- 2. node.jsでLINE Notifyを使ってみるよ
- 3. package.jsonのpeerDependenciesMetaってなんだ?
- 4. SIerフロントエンド・ディベロッパーのWindows10セットアップ
- 5. 【NodeJS】メール送信
- 6. Node.jsでport 3000のプロセスを探してkillするDOS バッチファイル(Windows10)
- 7. 新版・中華製スマートプラグを node で制御する
- 8. Cognito+API Gateway+LambdaでログインAPIを作りたいんだー!
- 9. 07.Heroku Demo作成(Node JS)
- 10. LINEBotをみんなで作ろう〜おうむ返しbotを作ろう編〜【GWアドベントカレンダー3日目】
- 11. Node.jsのバージョンアップ for Mac
- 12. webpack超超入門(備忘)
- 13. Let’s Encryptを使用しているウェブページをブロックするプロキシサーバー
- 14. Cognito+API Gateway+Lambdaでユーザ作成APIを作りたいんだー!
- 15. Gulp3 => Gulp4 移行 エラー【 primordials is not defined 】
- 16. @babel/plugin-transform-runtime を理解する(Babel 7)
- 17. React メモ
- 18. WSL+Ubuntuの初期設定(インストールからGit/Node.js設定まで)
- 19. toio準備
- 20. Node.jsでFetch APIで取得したShift_JISのテキストをTextDecoderではなくnpmのパッケージを使ってデコードする
CloudFunctionsで文字列をハッシュ化したいならcrypto
複雑な家庭の事情でどうしてもfirebase上のアプリで任意の値をMD5にしなければならなかったのでメモ。
nuxt上でなんか処理しようかとおもったがいいライブラリがなく、CloudFunctionsならNode.jsなのでcryptoモジュールが使えることに気づいた。
“`/functions/index.js
const crypto = require(‘crypto’);
const hash_ni_shitai_value = “ハッシュ化したい値”;
const hash_ni_natta_value = crypto.createHash(‘md5’).update(hash_ni_shitai_value).digest(‘hex’);
return hash_ni_natta_value;
“`phpの`md5($str)`ほど短くはないけどこれが最短なのでは。
node.jsでLINE Notifyを使ってみるよ
# 概要
webサービスやバッチ処理を作っていると、何かアクションがあった事をすぐに気づきたいと思うことがあるかと思います。
この通知がよく使うアプリに送られて来たら気づきやすいですよね!?よく使うアプリは人それぞれかと思いますが、LINEは多くの人が利用しているかと思います。
そして、LINEでは個人で簡単に通知を投げられる機能 [LINE Notify](https://notify-bot.line.me/ja/) を提供しています。ここでは、LINE Notifyのパーソナルアクセストークンでの通知をnode.jsを用いて行うまでの軌跡をまとめています。
# ざっと全体の流れ
手順はざっと以下な感じ。1. LINE) パーソナルアクセストークンを取得
2. 開発) アクセストークンを使ってrequestを投げる
3. LINE) 通知が届いた事を確認とても簡単!
# 手順
## 1. パーソナルアクセストークンを取得
LINEアカウントを持っていれば簡単に作れます。### 1-1. LINE Notifyページへ遷移
以下URLよりLINE Notify
package.jsonのpeerDependenciesMetaってなんだ?
# TL;TD
– `package.json`に記述するフィールドで、`peerDependencies` で定義したバージョンを満たしてなくても警告を出さなくするためのオプションを設定することができる (2020/05/03時点)
– パッケージを公開する人以外はあんまり気にしなくても大丈夫そう# そもそも`peerDependencies` とは
`peerDependencies` は、ある`モジュールX`に対するインタフェースを持っており、`モジュールX`から参照されることを想定するが、`モジュールX`のどこまでにバージョン互換性を持っているかを表記したものです。
例えば `eslint-plugin-vue` は、 `eslint` でVueファイルを扱うためのプラグインですが、どのバージョンの `eslint` に対して互換性のあるプラグインなのかが`peerDependencies` に記述されています。
“`package.json
“peerDependencies”: {
“eslint”: “^5.0.0 || ^6.0.0”
}
SIerフロントエンド・ディベロッパーのWindows10セットアップ
#はじめに
SIer所属のエンタープライズ系フロントエンド・ディベロッパーがWindows10端末を1からセットアップすることにしたため、SIer仕様の端末を作るために最低限必要なものをメモしておきました。
#ブラウザー
一通り入れましょう– Firefox
– https://www.mozilla.org/ja/firefox/
– Chrome
– https://www.google.com/intl/ja_jp/chrome/
– Edge#便利ツール
– Office 365
– 7-zip
– https://sevenzip.osdn.jp/
– Pleiadesが7-zipでないと解凍できない事に、、、
– Sakura Editor
– https://sakura-editor.github.io/
– docker#ソースコード管理
– git
– https://git-scm.com/
– その後、sshコマンドで公開鍵を作成しましょう#Java開発
– Java
– O
【NodeJS】メール送信
###NodeJSがインストールされていることを確認。
“`
node -v
v12.16.2
“`###nodemailerモジュールをダウンロード
“`
npm install nodemailer
“`※バージョンを指定する場合
“`
npm install nodemailer@6.4.6
“`###ダウンロード済みのモジュールを確認
“`
npm list –depth=0
`– nodemailer@6.4.6
“`###メール送信スクリプトを作成
“`javascript:mail.js
“use strict”;
const nodemailer = require(“nodemailer”);async function main() {
// create reusable transporter object using the default SMTP transport
let transporter = nodemailer.createTransport({
host: “example
Node.jsでport 3000のプロセスを探してkillするDOS バッチファイル(Windows10)
環境: Windows10 (7でもokと思われ)
Node.jsの開発などで時折localhost:3000とタイプすると“`DOS:error
Port 3000 is already in use
“`
と出て進まないとき、手動でプロセス番号を探してkillするのが手間なので、DOSバッチファイルにしました。“`DOS:processkill.bat
FOR /F “delims=” %%i in (‘netstat -aon ^| findstr 0.0:3000’) do set NODEPORT=%%i
echo off
@REM 出力の最後がPORTを表しているので、末尾まで読んでいる
for %%a in (%NODEPORT%) do (
set TEMPB=%%a
)
echo %TEMPB%
taskkill /pid %TEMPB% /F
“`実行法はコマンドプロンプトから
“`DOS:cmd
>processkill.bat
“`
だけです。元は
netstat -aon ^| findstr 0.0:3000
で出てきたプロセス
新版・中華製スマートプラグを node で制御する
[中華製スマートプラグを node で制御する](https://qiita.com/plageoj/items/04c8e5b2de230bf646e3) の記事はそれなりに閲覧があってありがたい限りなのですが、2020年5月に元の Github を見たところ、このセットアップ方法が deprecated になっていました。
そこで、2020年5月時点最新のセットアップ方法を改めて書いておきます。
元のセットアップガイドは [GitHubにあります](https://github.com/codetheweb/tuyapi/blob/master/docs/SETUP.md)。# スマートプラグを API で叩きたい
Amazonで [スマートプラグ](https://www.amazon.co.jp/gp/product/B07QKTNFW9) を見つけたので購入してみました。
公式の言うところによると、こいつは Google Home / Alexa / IFTTT との連携が
可能とのこと(IFTTTのみ動作確認しました)。おうちハックがはかどりそうです。セットア
Cognito+API Gateway+LambdaでログインAPIを作りたいんだー!
[前回](https://qiita.com/seobomi/items/d2ab34bf2d3c4dcc98d5)の続きで、Cognitoを使ったユーザ認証を行う。
#やりたいこと
APIでログイン
– ログイン名 と パスワードをリクエストボディに指定しAPIをコールしアクセストークンを取得する#参考
[LambdaでCognito認証(ユーザー認証)](https://qiita.com/minmax/items/12e65cd51d85f419faa5)#やってみよう
###Lambda用IAMロール
前回同様に、Lambdaの基本的なポリシーに加えて、「AmazonCognitoPowerUser」をアタッチする。###ログイン用のLambda関数を作成
前回と異なっていた点ですが、引数に渡すUSERNAME・PASSWORDは大文字で記載しないとエラーになりました。“`index.js
‘use strict’;const AWS = require(‘aws-sdk’);
const cognito = new AWS.CognitoIdentit
07.Heroku Demo作成(Node JS)
#0.準備条件
1. Salesforce 組織
2. Heroku
– Web Application
– Heroku Connect (取引先のMapping設定)
– Heroku Postgres#1.Node.js 実装 Resource 構成
– routes
– account.js
– views
– account.ejs
– accountList.ejs
– app.js
– package.json
– Procfile![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/332907/6475d397-e73a-ec66-0d80-f0810707b665.png)
#2.account.js
“`javascriptvar express = require(‘express’);
var router = express.Router();
const { Pool } = require(‘p
LINEBotをみんなで作ろう〜おうむ返しbotを作ろう編〜【GWアドベントカレンダー3日目】
この記事は下記の [#GWアドベントカレンダー](https://gw-advent.9wick.com/calendars/2020/72) の 2日目の記事になります。
楽しそうなのでやってみる ( @inoue2002 ) | GWアドベントカレンダー
# はじめに
こちらの内容は超初心者向けです。
[公式ドキュメント](https://developers.line.biz/ja/docs/messaging-api/overview/#messaging-api%E3%81%AE%E4%BB%95%E7%B5%84%E3%81%BF)を読める方はこちらをお読みいただく方が正確です。[昨日の記事](https://qiita.com/drafts/3a5019c07801bcf5ff75)をご覧になってない方はぜひ。
こちらの記事はGWアドベントカレンダーを通してLINEBotをサーバレスで作れるようになろう!ということを目標に書いている記事です。LINEBotはどんなもんか大体知ってるけど、作り方はわからんという方に読んでいただきたいです。
それではおうむ返し
Node.jsのバージョンアップ for Mac
Macで動いているNode開発環境を最新状態にするための方法です。
(いつも忘れちゃうので、書き留めておこうと思います。)手順は以下のとおりです。
1. 各種ツールの最新バージョンを確認する。
2. 各種ツールを最新にする。# 各種ツール最新(安定)バージョンを確認する。
私の環境は、`Homebrew`で作ったので、以下のものを確認します。
(2020/5/1時点の情報です。)– Homebrew
– Nodebrew
– Node.js## Homebrew:
`Homebrew`のバーション情報は、**[こちら](https://github.com/Homebrew/brew/releases)** から確認できます。
webpack超超入門(備忘)# webpackとは
webpackはフロントエンド開発用のモジュールバンドラー、簡潔にはモジュールをまとめてくれるツール## 用語
– モジュール
javascriptやcssなどのファイル。– バンドル/バンドルファイル
モジュールが一つにまとめられたファイル。– ビルド
バンドルを出力するまでの一連の処理## 利点
– 機能ごとにファイルを分割(モジュール化することができる。)
– 可読性の向上
– 開発作業の分担やテストがし易くなる
– モジュールの再利用性を向上できる。
– 転送効率を向上させることができる。
– 最適化されたファイルを出力できる。## install
何はともあれやってみないといまいちよくわからないので、早速nodeからwebpackをインストール。– 適当なディレクトリを切って、package.jsonを初期化
“`shell
yarn init -y
“`– webpackとwebpack-cliをインストール(webpack4からcliが別モジュールとして管理されるようになったため、別途インストールが必要らしい。
Let’s Encryptを使用しているウェブページをブロックするプロキシサーバー
**Let’s Encrypt**はドメイン認証証明書を無料で発行してくれるたいへん素晴らしいサービスです。ウェブサイトをHTTPSで提供するためには証明書が必要ですが、Let’s Encryptの登場以前は認証局から有料で証明書を発行してもらうのが主流でした。それを無料で発行してもらえるのは大変ありがたいことです。また、発行プロセスは自動化されておりとても簡単です。筆者も個人のウェブサイトは全てLet’s Encryptで証明書を取得しています。
ところが、**Let’s Encryptが発行する無料の証明書なんて信頼できない**という教義を信奉するタイプの人々も存在するようです。筆者は最近Twitterで見かけました。ということで、そのような思想を持つ方も安心してインターネットを利用できるように、**Let’s Encryptによって発行された証明書を使用しているウェブサイトのみブロックするプロキシサーバー**を作りました。
完成品はこちらです。→ https://github.com/uhyo/proxy-for-mammonists
ソースコードをクローンし、`npm i
Cognito+API Gateway+Lambdaでユーザ作成APIを作りたいんだー!
AWSの認定は保有していますが
実践できていない主なサービスがサーバレスまわり…ということで勉強を兼ねて、簡単なAPIを作成してみます。
#やりたいこと
APIでユーザ作成
– ログイン名 と パスワードをリクエストボディに指定しAPIをコールするだけでユーザ作成する。
– メールアドレス/電話番号の認証は不要。#参考
[LambdaでCognito認証(ユーザー作成)](https://qiita.com/minmax/items/8c2aa57b76e09b8192ed)#やってみよう!
###ユーザプールの作成
こんな私でもCognitoでユーザ管理をするにはユーザプールを作成しなければならないことは知っている。属性は必要最低限を指定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/613712/1a254b24-c952-5ccf-d650-2f2e400d01f9.png)![image.png](https://qiita-image-store.s3
Gulp3 => Gulp4 移行 エラー【 primordials is not defined 】
# Gulp3からGulp4へ:airplane:
今回Gulp3からGulp4へ(何回書くねん:imp:)移行したのですがその際に出たエラーについて共有
アップデートは[npm-check-updates](https://www.npmjs.com/package/npm-check-updates)というツールを使いnpmライブラリを総括アップデートを行いました。### エラー内容:see_no_evil:
アップデート後gulpコマンドが叩けるかを確認するために“`js:index.js
import gulp from ‘gulp’
import { compileStylus } from ‘./tasks/stylus’exports.default = gulp.series(
compileStylus
)
//↑gulpと叩くとcompileStylusというタスクを実行するよ〜という処理
“`“`js:./tasks/stylus.js
import gulp from ‘gulp’
import plumber from ‘gulp-p
@babel/plugin-transform-runtime を理解する(Babel 7)
# 概要
Babelの主要プラグインの一つである、[@babel/plugin-transform-runtime](https://babeljs.io/docs/en/babel-plugin-transform-runtime) に関して、雰囲気で使わずに理解を深めるためにまとめた内容です。
概ね上記公式ドキュメントに書いてある内容を要約しただけになります。(2020/05/01 閲覧)
# バージョン情報
以下で動作確認済み
– `Node` v12.16.3
– `@babel/core` v7.4.5
– `@babel/plugin-transform-runtime` v7.4.5
– `@babel/runtime@` v7.9.2
– `core-js` v3.x# `@babel/plugin-transform-runtime` is 何
本来はBabelによって注入されるヘルパーコードを、再利用可能なヘルパーをインポートする形に変換するプラグインです。これによってグローバル汚染を避けながら、成果物のコードサイズを小さくすることができます。
>
React メモ
#React.js
Reactの導入とメモ## 環境構築
まずはNode.jsのインストール
次にnpmのインストール(yarnを使いたければインストール)“`
npmの場合
//Reactのプロジェクト作成
$ npx create-react-app 作成したいディレクトリ名
“`“`
yarnの場合
//Reactインストール
$ yarn global add create-react-app
//Reactのプロジェクト作成
$ create-react-app 作成したいディレクトリ名
“`“`
//yarnで起動
$yarn start
//npmで起動
$npm start
“`## 1. React.jsとは
Facebook社が公開したUI構築のためのjsライブラリ
全てのReactコンポーネントは、自己のprops に対して純関数のように振る舞わねばならない## 2.JSXとは
React.createElement関数
javaScriptの機能を全て備えた構文の拡張の為テンプレート言語とは異なる
ReactDOMはH
WSL+Ubuntuの初期設定(インストールからGit/Node.js設定まで)
## やりたいこと
WSLでUbuntuを動かす。
最低限の環境を構築する。
初期設定時に毎回調べるのは面倒なので、手順をまとめてメモしておく。
## 到達目標
* Ubuntuの初期設定ができている
* CUI/GUI環境ができている
* Gitの初期設定ができている
* GitHubにssh接続できる
* Python3が動かせる
* Node.jsが動かせる## 環境
* Microsoft Windows 1909 (OS ビルド 18363.535)
* Ubuntu 20.04 LTS## 手順
### 1. WSLの有効か
1. [Windows + i]で設定メニューを開く
1. [アプリ] → [アプリと機能] → [プログラムと機能] → [Windows の機能の有効化または無効化] の順にクリック
1. 機能の一覧から、[WSL(Windows Subsystem for Linux)]にチェックをいれ、[OK]ボタンをクリック
1. Windowsを再起動する### 2. Ubuntuの入手
[Microsoft Stor
toio準備
機材
TOIOセット
スイッチサイエンス開発者用シート———————————————-
あ)
[Node.js]
nodist 0.9.1 //nodist は Node.js のバージョンを管理するツール。
npm -v 6.9.0[noble] : Node.jsでBluetooth LEを扱うためのモジュールです。
a) Windows10にnobleをインストールする https://qiita.com/s_nkg/items/3f27328e108d7fa8d076
b) [Windowsでnpm installしてnode-gypでつまずいた時対処方法] https://qiita.com/AkihiroTakamura/items/25ba516f8ec624e66ee7VCTargetsPath=C:\Program Files (x86)\MSBuild\Microsoft.Cpp\v4.0\V140
C:\Program Files (x86)\MSBuild\M
Node.jsでFetch APIで取得したShift_JISのテキストをTextDecoderではなくnpmのパッケージを使ってデコードする
#Overview
Node.jsでFetchでHTMLのデータを取得して`response.text()`でテキストを取得したら文字化けが:scream:
どうしてだろうと思ったらHTMLがShift-JIS、かつ`text()`はまさかのUTF-8専用とのこと。
https://developer.mozilla.org/ja/docs/Web/API/Body/text> レスポンスは常に UTF-8 としてデコードします。
さすがモダンなAPIだな、この割り切り嫌いじゃない:wink:
それならばとブラウザ同様TextDecoderを使ってShift-JISに変換しようとしたらエラー[ERR_ENCODING_NOT_SUPPORTED]が:fearful:
Node.jsのドキュメントみてもShift-JISサポートあるやん!
https://nodejs.org/docs/latest/api/util.html#util_class_util_textdecoderググってみたらICUとかいうのが必要なようで…
マイナーなデータは別途提供するから自分で取り