- 1. gulp を使用したSCSS(SASS)環境の構築
- 2. Nuxt.jsの動的ルーティングでQiitaっぽい構成を作ってみるメモ
- 3. Nuxt on Dockerでpuppeteer使ってスクレイピングする。
- 4. LINE Blockchain を Node.js からたたきはじめてみた
- 5. ECS(Node.js + TypeScript)からAWS DynamoDBから最新のデータを1件のみ取得するまで
- 6. Lambda(node.js)におけるaws.docClient.get(…).promise() のsinon.stubのつくりかた
- 7. eject後のwebpack.config.jsを1から読み解いてみる②
- 8. Nuxt.jsのサーバフレームワークをKoa.jsに変更する
- 9. anyenv+nodenvでnode.jsの複数バージョンを管理する(MacOS用)
- 10. httpとwebsocketの兼用(統合)サーバーを作る
- 11. IMI住所変換コンポーネントを改造してリバースジオコーディングに対応してみた
- 12. 80mm フィルム (58mm フィルム) を発明してみた
- 13. LambdaでRDS Proxy経由でAurora(MySQL)に接続する(IAM認証)
- 14. Node.jsでモジュールが認識されなかった話
- 15. Node.js環境構築1
- 16. 【Node.js】LINE BOT グループにプッシュ通知を送る
- 17. Nodeのバージョン管理をnodebrewからnに切り替える
- 18. V8 の Inline Caches と Hidden Class について
- 19. OpenCC で中国語変換だけしたい!
- 20. Node.jsをバックエンドに使うべきユースケース
gulp を使用したSCSS(SASS)環境の構築
普段はvsvcodeの拡張機能「Live Sass Compiler」を使用しているが、gulpを使用する機会があったので覚え書き
**事前準備**
Node.js [https://nodejs.org/ja/](https://nodejs.org/ja/)
※インストール方法は@sefoo0104さんが紹介してくれているのでそちらを参照
・[Node.jsをインストールする](https://qiita.com/sefoo0104/items/0653c935ea4a4db9dc2b)gulp(ガルプ)について詳しく知りたい方は公式サイトもしくはCodeGridを参照
・gulp [公式サイト](https://gulpjs.com/)
・CodeGrid [現場で使えるgulp入門](https://app.codegrid.net/entry/gulp-1)**モジュール**
Node.jsの設定が終わったら以下のモジュールをインストール
※今回はカレントディレクトリにインストール一人で開発する場合(“devDependencies“)
“`ruby:
Nuxt.jsの動的ルーティングでQiitaっぽい構成を作ってみるメモ
Qiitaと同様の構成を作ってみたメモです。
## 通常のNuxt.jsの動的ルーティング
こんな構成にすると
“`
pages/
–| users/
—–| _id.vue
–| index.vue
“``https://ドメイン/users/<ユーザー名>` みたいな構成を作ることが出来ます。
> https://ja.nuxtjs.org/guide/routing#%E5%8B%95%E7%9A%84%E3%81%AA%E3%83%AB%E3%83%BC%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0
このユーザー名の部分がURLにアクセスした際の値で動的に変わります。
## Qiitaっぽい構成って?
(2020年9月時点)Qiitaの記事は以下のような構成です。
“`
https://ドメイン/<ユーザー名>/items/<記事ID>
“`例: `https://qiita.com/n0bisuke/items/ceaa09ef8898bee8369d`
先ほどの`ユーザー名`だけが動的な場合と違って、
Nuxt on Dockerでpuppeteer使ってスクレイピングする。
# はじめに
あーあ、スクレイピングしたいな。ということで Nuxt on Docker でスクレイピングします。
node系だと[puppeteer](https://github.com/puppeteer/puppeteer)というライブラリがスクレイピングするのにおすすめっぽかったので、NuxtのserverMiddlewareからサクッとスクレイピングします。あまり人に迷惑をかけてはいけないと言われて育ったので、スクレイピングは自分のサイトにします。(ログイン不要だよ。ぜひ使ってみてね♪)
[toribure | ひとりでもチームでも使えるシンプルイズベストなブレストツール](https://toribure.herokuapp.com/)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254216/f72c8d79-2328-92bf-08cf-5e71695f1363.png)やや宣伝ですね。トップページにかわいい鳥(いらすとや)の画像があります。今回はこれをス
LINE Blockchain を Node.js からたたきはじめてみた
### どこかに nodejs SDK があるかもしれませんが、たぶん api exprorer のサンプルが python だけっぽいけどすぐに node.js も追加されそうな気がしますが、ちょっと生でたたきはじめてみました。
#### [Tutorial Step 1. Create your service / 4b. Check the result with API](https://docs-blockchain.line.biz/service-tutorial/Step1?id=step1-4)
“`bash
$ npm install axios
“`“`node.js
const crypto = require(‘crypto’);
const axios = require(‘axios’).default;const endpoint = ‘https://test-api.blockchain.line.me’;
const apikey = ‘apikey’
const secret = ‘secret’;const method
ECS(Node.js + TypeScript)からAWS DynamoDBから最新のデータを1件のみ取得するまで
バッチ処理をNode.js + TypeScriptで作成しており、そのバッチをECS on Fargateで起動しAWS DynamoDBから最新のデータを1件のみ取得する方法を紹介します。
その中でハマったポイントがいくつもあったため、同じ轍を踏むことがないようポイントをまとめておきます。
## TL;DR
“`typescript
import * as AWS from ‘aws-sdk’;
import { DocumentClient } from ‘aws-sdk/clients/dynamodb’;AWS.config.credentials = new AWS.ECSCredentials({
httpOptions: { timeout: 5000 }, // 5 second timeout
maxRetries: 10, // retry 10 times
});const dynamodb = new AWS.DynamoDB();
(async () => {
const params: DocumentClient.Query
Lambda(node.js)におけるaws.docClient.get(…).promise() のsinon.stubのつくりかた
#やりたいこと
以下のlambdaのテスト対象コード(main.js)をMochaでtestするときに
docClient.get(…).promise() 部分のsinon.stubをつくりたい“`javascript:main.js
const aws = require(“aws-sdk”);
const docClient = new aws.DynamoDB.DocumentClient(…);async function main(event) {
await docClient.get(…).primise();
}
“`結論のテストコード
(***で囲まれているところがスタブのつくり方、それ意外はモジュールの設定)“`javascript:main_test.js
const assert = require(‘assert’);
const sinon = require(“sinon”);
const aws = require(“aws-sdk”);
const docClient = new aws.Dyna
eject後のwebpack.config.jsを1から読み解いてみる②
## はじめに
この記事は[前回の記事](https://qiita.com/daiki-murakami/items/52fd80521d51ecaa5653)の続きです。前回の記事を見ていない方はこちらからご覧ください。## Ln274-Ln320
“`javascript
resolve: {
// This allows you to set a fallback for where webpack should look for modules.
// We placed these paths second because we want `node_modules` to “win”
// if there are any conflicts. This matches Node resolution mechanism.
// https://github.com/facebook/create-react-app/issues/253
modules: [‘node_modules’, paths.appNodeModules].conca
Nuxt.jsのサーバフレームワークをKoa.jsに変更する
## 選択できなくなっていたサーバフレームワーク
Nuxt.jsインストール時にはExpressやKoa.jsなどのサーバサイドフレームワークを選択できていたと思うんだけど、最近のバージョンだとそれができなくなっていたので、フレームワークをKoa.jsに変更する方法を記載する。Expressでも同じかと。## デフォルトでは “connect”
https://ja.nuxtjs.org/api/configuration-servermiddleware
で次のように記載されているように、デフォルトではconnectが適用されるらしい。“`
Nuxt は内部で connect のインスタンスを作ります。
それはミドルウェアをスタックに登録したり、 外部サーバーを
必要とせず に API などのルートを増やす事を可能にしてくれます。
connect 自体はミドルウェアで、登録されたミドルウェアは
nuxt start と express-template のようなプログラム的な
使用法を持つミドルウェアとして使用されます。
“`
connectのままでもいいんだろうけども、
anyenv+nodenvでnode.jsの複数バージョンを管理する(MacOS用)
# anyenv+nodenvでnode.jsの複数バージョンを管理する(MacOS用)
## 概略
MacOS用のバージョン管理方法です。
node.jsのバージョン管理マネージャー「nodenv」を通して、.node-versionでnode.jsのバージョン情報を共有しつつ、自動で切り替わるように設定します。
xcode→Homebrew→anyenv→nodenvの順番でインストールの手順で実施します。
自動切り替え最高の体験。
#### リリース情報確認URL
– [Homebrewのリリースノート](https://github.com/Homebrew/brew/releases)
– [anyenvのリリースノート](https://github.com/anyenv/anyenv/releases)
– [nodenvのリリースノート](https://github.com/nodenv/nodenv/releases)
– [Node.jsのリリースノート](https://nodejs.org/ja/download/releases/)###
httpとwebsocketの兼用(統合)サーバーを作る
一例です。
# 前準備
## 前提・環境
– node.js: v10.16.0(async/awaitをサポートしている程度のバージョン)
– npm: v6.14.2(上のnode.jsとマッチするバージョンであればOK)
– windows 10 64bit※ async/awaitは簡易化のために使用してるだけなので、必須ではないです。
## ディレクトリ構造
“`
[ルートフォルダ]
|- public
|- index.html
|- utils
|- getLocalIp.js
|- server.js
|- …その他package.json等
“`## 依存モジュールのインストール
`npm i node-static ws`# サーバー側
“`./server.js
const { createServer } = require(“http”);
const { Server: FileServer } = require(“node-static”);
const { Server: WebSocketServer } = req
IMI住所変換コンポーネントを改造してリバースジオコーディングに対応してみた
先日、経産省が公開する「住所変換コンポーネント」についての性能を調べた記事を投稿しました。
IMI住所変換コンポーネントでいろんな住所を正規化してみた
https://qiita.com/uedayou/items/4c9d30fc031a9bf6762e「IMI住所変換コンポーネント」は、表記にゆれがある住所表記を正規化してくれるとても便利なツールです。
たとえば
“`
霞が関2 -> 東京都千代田区霞が関二丁目
“`
のようになります。このツールのもう一つの大きな特徴として、その住所に対する位置情報(緯度経度)も取得することができる点があります。
“`
霞が関2 -> 東京都千代田区霞が関二丁目 -> {“緯度”: “35.675551”, “経度”: “139.750413”}
“`所謂「**ジオコーディング機能**」があります。
これは、ツール内にあらかじめ住所に対する位置情報データが含まれることを意味し、作り方によってはこの逆、位置情報(緯度経度)から住所にも変換することができるのではないか?と思いました。“`
{“緯度”: “35.6755
80mm フィルム (58mm フィルム) を発明してみた
レシート用のサーマルロール紙 (幅 80 mm or 58 mm) を映画のフィルムにしちゃいます!
![01.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/669512/ce499c70-f581-a645-5313-0314b1c2df80.jpeg)
[receiptline シリーズ最終回](https://qiita.com/dopperi46/items/1d2b92ba6a4cb6f79c19)では、インスタントカメラを作って、最後にレシートプリンターを自撮り連写しました。
この写真を眺めていたら、動画もできるんじゃないか?と思ったのです。![02.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/669512/77c608be-91f6-7fc4-cfd9-2d8e1d38588e.jpeg)
# 自動用紙カットを解除
[receiptline](https://github.com/receip
LambdaでRDS Proxy経由でAurora(MySQL)に接続する(IAM認証)
待ち望んでいた`RDS Proxy`が東京リージョンでGAされました。
https://aws.amazon.com/jp/blogs/aws/amazon-rds-proxy-now-generally-available/早速、`Lambda`から利用する機会があったのでメモしておきます。
今回は、セキュアに接続するため、`TLS`+`IAM`認証で接続します。
上記で接続すると、`Lambda`に認証情報(具体的にはDBのパスワード)の取得コードを記載しなくて良いのがかなり良い感じです。# 前提
`Aurora(MySQL)`は存在していること
# 手順
1. `Secrets Manager`設定
2. `RDS Proxy`作成
3. `Lambda`から接続## `Secrets Manager`設定
マネジメントコンソールから`Secrets Manager`に移動して、認証情報を入力し、シークレットを作成します。
![スクリーンショット 2020-08-29 10.39.57.png](https://qiita-image-store.s3.ap
Node.jsでモジュールが認識されなかった話
Windows環境でNode.jsとwsを用いたシグナリングサーバを運用したくて使い始めてみたのですが、wsが見つからないという旨のメッセージが出る。
node.jsを入れなおそうが、wsをグローバルインストールしようが改善しなかったのでいろいろ調べてみると、どうにもパスのせいらしい。
どこかで自動的にパスを通してくれると見ましたが、それはnodeそのもののパスだけでモジュールまでのパスは自分で通さないといけないようで……結果としてはシステムの詳細設定からプロパティに飛び、環境変数のユーザー環境変数にNODE_PATHという名前で、**C:\Users\ユーザー名\AppData\Roaming\npm\node_modules**を追加するだけで動作した。
node上で見れるモジュールの参照先には既に指定されていたのでパスの問題ではないだろうと思い、package.jsonとかいろいろ見ていたのですがもっと基本的な部分でハマっていましたとさ。
Node.js環境構築1
* Node.js npmインストール
* アプリフォルダ作成
“`ターミナル.
任意の場所で
mikdir list-app
“`
* フォルダへ移動* パッケージのインストール
“`ターミナル.
npm init –yes
“`>package.jsonを生成するコマンド
package.json
=> npmパッケージ設定情報などが記載されている。
>* mpmパッケージのインストール(express ejs)
“`ターミナル.
npm install express ejs
“`* 必要なファイルの作成
“`ターミナル.
(list.appのフォルダで)
mkdir views
touch app.js
cd views
touch hello.ejs
“`* コードの記載
“`ターミナル.
vi app.js//以下をコピー
const express = require(‘express’);
const app = express();
app.get(‘/’, (req, res) => {
【Node.js】LINE BOT グループにプッシュ通知を送る
# はじめに
LINE APIを使ってグループにpush通知を送る個人的メモ# モジュールインストール
axiosを使うと非常にシンプルにPOSTリクエストが送れるので採用“`bash
$ npm i axios
“`# コード
“`js:index.js
const axios = require(‘axios’)const linePost = async (msg) => {
console.log(‘linePost…’)
const token = ‘API TOKENを入力してください’const req_url = ‘https://api.line.me/v2/bot/message/push’
try {
const res = await axios.post(req_url, {
//グループID
“to”: “グループのIDを設定してください”,
“messages”: [
{
“type”: “text”,
“text”: msg
}
]
Nodeのバージョン管理をnodebrewからnに切り替える
Nodeのバージョン管理には「nodebrew」を使用していたのですが、なぜか調子がよくないのでこの際に気になっていた「n」に切り替えてみます。
私自身の備忘録になりますので、
作業手順や状況などは細かいのですがご了承ください。# 環境
・OS: Mac OS X
・Version: 10.14.6
・bash# まずは既存のnodebrewを削除
私の場合、「homebrew」でインストールした記憶があったので `brew` コマンドで削除します。“`
brew uninstall nodebrew
“`その後、しっかり消えているか確認します。
“`
nodebrew -v
“`あれ?なぜかたくさん表示されました。。。
その中には `nodebrew バージョン番号` の文字がありました。これは削除されていないということで探します。
“`
which nodebrew
“``which` で検索しました。
そうすると“`
/Users/admin/.nodebrew/current/bin/nodebrew
“`しっかりそれっぽ
V8 の Inline Caches と Hidden Class について
## 動的型付けの仕組み
JavaScript のコンパイラーである V8 は C++ で書かれていますが、[JSIL](https://github.com/sq/JSIL)というOSSの Inline Caches の説明を参照したため仕組みの部分については、C# での説明になってしまいました。仕組みとしては同じはずですのでご容赦ください。
JavaScript は動的型付けの言語であるため、動的に型を決めることができるように内部的に Variant Generic Interface を実装しています。これは共変性という性質を持つもので、戻り値が同じ型であれば再代入可能である性質です。[C#のドキュメント](https://docs.microsoft.com/ja-jp/dotnet/csharp/programming-guide/concepts/covariance-contravariance/variance-in-generic-interfaces)または[こちらのサイト](https://ufcpp.net/study/csharp/sp4_variance
OpenCC で中国語変換だけしたい!
# OpenCC とは?
npm の漢字変換もづーる。
https://github.com/BYVoid/OpenCC
# インストール
パッケージに入れたいわけじゃない、そもそもパッケージがない、リソースに追加したいだけなので、グローバルインストール。
`npm i opencc -g`そして、 node.js でさっさとオブジェクトをいい具合にしたいだけなので、 require に必要なフルパスを探す。
`find $HOME/.nvm/ -name opencc`
以下、
`$userdir` は `$HOME`
`$version` は `node -v` の結果
で読み替えてください。“`OpenCC-sample.js
const OpenCC = require( ‘/home/$userdir/.nvm/versions/node/$version/lib/node_modules/opencc’ );
const t2s = new OpenCC( ‘t2s.json’ );/*
* 英語,日本語,繁体字中国語 でリソース組んだけど O
Node.jsをバックエンドに使うべきユースケース
> こちらの記事は、Max Savonin 氏により2020年6月に公開された『 When To Use Node.js as a Back-End 』の和訳です。
> 本記事は原著者から許可を得た上で記事を公開しています。# Node.jsをバックエンドに使うべきユースケース
![node.jsバックエンド ](https://spzone-simpleprogrammer.netdna-ssl.com/wp-content/uploads/2020/06/When-To-Use-Node.js-as-a-Back-End-square.png)
JavaScriptは、世界で最も人気のあるプログラミング言語の1つだ。 現在の状況ではライバルになれるのはPythonとJavaだけであり、コンピューティング市場で約8%のシェアを保持している。
Webに関しては、JavaScriptの地位はさらに一つ突き抜けている。 JavaScriptは、事実上、Chrome(またはその派生物)またはFirefoxブラウザーで使用可能な大部分のWebアプリケーションを強化している。 結局の