- 0.0.1. Slackで人狼がしたいねん
- 0.0.2. Amplify+React+Node.jsを使ってWebSocket通信の簡単なチャットアプリを作ってみる
- 0.0.3. Node.js 複数インポート、エクスポートする方法
- 0.0.4. かいはつ小話「モックをくださいな」
- 0.0.5. [npm]npm run prodに失敗する
- 0.0.6. 【OAuth 2.0】PKCE+State対応の認可コードグラントについてまとめてみた
- 0.0.7. ElectronとNode.jsの制約に苦しめられた話
- 0.0.8. 【Nodejs】ストリーム(stream)に念入りに気合を込めて正拳突きを繰り返しながら説明していく
- 0.0.9. WebStorm の設定確認事項
- 0.0.10. anyenv 経由で nodenv を導入した環境で新しい node.js を使う
- 0.0.11. Node.jsをアップデートしてみる(備忘録)
- 1. 問題
- 1.1. Homebrew
- 1.1.1. AWS DevOps – AWS X-Rayによる分散トレーシング その3 (Node.js編)
- 1.1.2. GoogleアナリティクスのAPIをNode.jsから触る
- 1.1.3. Expressでsocket.ioを利用しWebSocket通信を実施する。
- 1.1.4. 【Node.js】Expressとexpress-validatorでサインアップ機能にバリデーションをかける
- 1.1.5. NestJSで入門するnpmライブラリ公開生活
- 1.1.6. yarn start がまたできない件
- 1.1.7. Expressでシンプルな掲示版を作る
- 1.1.8. [Node.js] Nodemailerで２通以上同時にメールを送信する
- 1.1.9. 【Node.js】Line Messaging APIでLine Botを作るまでに躓いた箇所をまとめる
- 1.1. Homebrew
Slackで人狼がしたいねん
こんにちは。
初めてのAdvent Calendarの参加です。:::note warn
記事中のコード内には独自のメソッドやクラスがありますが、いちいち説明してません。
気になる方はコメントください。
:::#はじめに
/* 読み飛ばしてもなんの問題もありません。 */
2020年、リモートワークが始まり、慣れてきた2021年のこと。
ふと思いました。**人狼がやりたい。**
しかし、人狼をやろうと言い出すと、言い出しっぺは大概ゲームマスター（GM）をやらなければいけない。
いやだ。
私が人狼ゲームを楽しみたいのだ。**ならばslackbot（App）にGMをやってもらおう**
人狼ゲームは1ゲームに結構時間がかかる。
人数も揃えなければいけない。
予定の調整は誰がやるのか？
言い出しっぺだ。
いやだ。
私はやりたくない。**ならば、リアルタイムで毎日人狼をやるのだ。**
そうして私はリアルタイムで進む人狼ゲームをSlack上で作ることを決意したのだ。
#Slack人狼のルール
今でこそ役職はそれなりに選択できるように色々バリエーションを作ったが、最
Amplify+React+Node.jsを使ってWebSocket通信の簡単なチャットアプリを作ってみる
こんにちは。 [CYBIRD Advent Calendar 2021](https://qiita.com/advent-calendar/2021/cybird) 15日目担当の @utamakura です。
14日目は @cy-n_ao さんによる「Heroku＆Phaserでかんたん環境構築」でした。
Heroku、お手軽に環境構築できていいですね！
料金について気になったので少し調べてみましたが、無料枠を超えても利用できなくなるだけで追加課金は発生しないとのことで、そこも個人開発に向いていると思いました。
個人でクラウドサービスを使っていると、基本無料だけど実際使ってみたら細かいところで追加課金されて総額でそれなりに請求されてしまった…みたいなことになるのが一番怖いですからね。:cold_sweat:## はじめに
今回、Amplifyの使い方と、Amplify+React+Node.jsを使ったWebSocket通信の実装方法をご紹介します。
これを読めば、Amplify+Reactで簡単にWebアプリを開発する方法を学ぶことができます。ちなみに、Amplifyや
Node.js 複数インポート、エクスポートする方法
Node.jsの学習の備忘録と振り返りの記事です。
何かの参考になれば幸いです。
付け足しや訂正などある場合ご教授いただけると
大変嬉しく思います！！##複数インポート、エクスポートする方法
“`js
const name = “yuka”;
const add = function (a,b){
return a + b
}module.export = {
//定義名:値,
name:name,
add:add, //最後のカンマは無くてもあってもどっちでもいい
}//===別ファイル===
const {name,add} = require(“インポートしたいファイル名”)
“`
かいはつ小話「モックをくださいな」
この記事は [株式会社サイバー・バズ Advent calendar 2021](https://qiita.com/advent-calendar/2021/cyberbuzz) 15日目の記事です。
むかし、むかしあるところに…
フロントエンドおばあさんとバックエンドおじいさんがおりました。
今回の開発は郵便番号でリクエストを投げると、住所が返ってくるというものです。
**おばあさん**「フロントのフォーム部分の実装終わりましたよ…」
**おじいさん**「すまんな、ばあさん。まだAPIの
[npm]npm run prodに失敗する
# はじめに
現在、Web系自社開発企業への転職を目標にポートフォリオを作成中。
Dockerを活用してLEMP環境を構築し、Laravel+VuejsでWebアプリケーションの開発を行っております。今回は、npm run prodでJavaScriptのトランスパイルを実行するまでの流れを記録として残します。
# 目次
1. [やりたいこと](#Chapter1)
1. [トランスパイル実行したときに発生したエラー](#Chapter2)
1. [調査](#Chapter3)
1. [原因](#Chapter4)
1. [解決策](#Chapter5)
1. [参考文献](#reference)
# やりたいこと
npm run prodを実行してJavaScriptのトランスパイルを行いたい“`
npm run prod
“`“`
【OAuth 2.0】PKCE+State対応の認可コードグラントについてまとめてみた
3年目エンジニアが12月の書き入れ時に夜な夜ながんばってOAuth2.0についてまとめてみました。
実装例のところはNode.js想定です。# 目次
[1. 認可コードグラントとは](#認可コードグラントとは)
[2. stateとは](#stateとは)
[3. pkceとは](#pkceとは)
[4. 想定するユースケース](#想定するユースケース)
[5. 全体の認証フロー](#全体の認証フロー)## 認可コードグラントとは
OAuth 2.0の主要な認証フローの一つで、最もよく使われているフローです。
簡単に説明すると、リソースオーナー（ユーザー）によるクライアント認可が完了した際に認可サーバは認可コードをクライアントに対して発行し、クライアントはその認可コードをもとにアクセストークンを取得する、といったフローになります。
に念入りに気合を込めて正拳突きを繰り返しながら説明していく
#ストリームとは
ストリームとは、大きいデータを少量に分けてちょっとずつデータを運ぶ概念のことです。
英語でstreamは「流れや川」を表します。
小さいデータが連続的に流れる様子が川のようなのでstreamというのですね。streamには、大きく分けて2つの役割があります。
– データを読み込む (write)
– データを書き込む (read)具体的な例を見ていく前にストリームが役立つシーンを紹介します。
また、ここでは基本的にファイルモジュールを扱っていきます# ストリームが役立つ例
ファイルをコピーしてフォルダ１からフォルダ２に移す。単純な例を考えます。
“`
.
├── フォルダ１── a.txt
└── フォルダ２
“`ここで２つのコードの書き方が考えられます。
１．ファイルを一度完全にバッファ（一時保存される領域）にコピーしてから、フォルダ２にファイルを書き込む
２．ファイルをバッファに読み込み、読み込めたものから順に書き込みを行う１の場合
“`js
const fs = require(‘fs’)
text = fs.readFi
WebStorm の設定確認事項
## nodenv 利用時の IDE からの npm script の実行
IDE から npm script の実行すると以下の様な package manager が以見つからない旨のエラーがでます。“`
Error running ‘lint’: Specify a valid package manager: cannot find a binary file inside ‘/Users//.anyenv/envs/nodenv’ directory
“`以下の対応を行うと正常に npm script をキックできるようになります。
– `npm -g install @nodenv/jetbrains-npm`
– package manager のパスを `echo $(npm -g prefix)/lib/node_modules/@nodenv/jetbrains-npm` の出力結果に変更する
– また、公式docは[こちら](https://github.com/nodenv/nodenv)
# 前提
– any env 経由で nodenv が入っている
– `nodenv install -l` しても、欲しい最新の node.js のバージョンが出てこない# 手順
– anyenv-update の plugin を入れてアップデート
– `mkdir -p $(anyenv root)/plugins`
– `git clone https://github.com/znz/anyenv-update.git $(anyenv root)/plugins/anyenv-update`
– `anyenv update`
– `nodenv install -l` で新しい node.js のバージョンを確認する
– 対象のバ
Node.jsをアップデートしてみる(備忘録)
問題
UdemyでRubyonRailsの学習を始めようと思ったら、
まずはMacで動いているNode開発環境を最新状態にする必要があるとのこと。Homebrew
Homebrewの最新バージョンはこちらから確認できます↓
https://github.com/Homebrew/brew/releases2021/12/13時点でのHomebrewの最新バージョンは3.3.7
私の環境でのHomebrewのバージョンは2.6.1
“`title:Homebrew
% brew -v Homebrew 2.6.1
Homebrew/homebrew-core (git revision d21e8d; last commit 2020-12-12)
AWS DevOps – AWS X-Rayによる分散トレーシング その3 (Node.js編)
# はじめに
本連載は以下の3部で構成されています。1. [AWS X-Rayによる分散トレーシング その1 (概要編)](https://qiita.com/k-inui/items/18eba083a6fe061e5ea5)
2. [AWS X-Rayによる分散トレーシング その2 (Java編)](https://qiita.com/k-inui/items/33bb5819d0ee24e02e28)
3. **AWS X-Rayによる分散トレーシング その3 (Node.js編) ←今回**X-Rayの基本から学びたいという方はまず[その1](https://qiita.com/k-inui/items/18eba083a6fe061e5ea5), [その2](https://qiita.com/k-inui/items/33bb5819d0ee24e02e28)を参照下さい。
本記事では、LambdaのランタイムにNode.jsを採用した場合にX-Rayに必要な設定やその際に注意すべきことを記載しています。
それでは、早速LambdaでX-Rayを使ってみましょう！
GoogleアナリティクスのAPIをNode.jsから触る
こんにちは、この記事は[岩手県立大学アドベントカレンダー](https://qiita.com/advent-calendar/2021/ipu)12日目の記事です。
先日Node-RED向けにGoogle Analyticsのノードを自作した記事を書きました。
https://qiita.com/n0bisuke/items/f5b3136e74d44ec2e4e1
この中で使ってる元の実装の紹介をしてみます。
## Google Analyticsのバージョン – GA4
[Google Analytics Data API (GA4)](https://developers.google.com/analytics/devguides/reporting/data/v1)のデモを触っていくのですが、Google Analyticsは従来のユニバーサルアナリティクス(UA)とGoogle アナリティクス 4(GA4)があります。
GA4の方が新しいバージョンって認識で問題なさそうな気がします。
## Google Analytics Data APIのサンプルを触る
Expressでsocket.ioを利用しWebSocket通信を実施する。
#アジェンダ
①公式提供のソースコードの解析
②Roomを追加する###①公式提供のソースコードの解析
リンクより、socketioのソースコードを取得し、実行する。“`javascript:サーバ側のコード
const app = require(‘express’)();
const http = require(‘http’).Server(app);
const io = require(‘socket.io’)(http);
const port = process.env.PORT || 3000;app.get(‘/’, (req, res) => {
res.sendFile(__dirname + ‘/index.html’);
});/** コネクション確立 */
io.on(‘connection’, (socket) => {
console.log(‘接続成功！！’)
socket.on(‘chat message’, msg => {
io.emit(‘chat message’, msg);
console.l
【Node.js】Expressとexpress-validatorでサインアップ機能にバリデーションをかける
#はじめに
メインはフロントですが、趣味でExpressを触っているものです。サインアップ機能を実装するにあたってexpress-validatorを採用したので実装に至るまでのコードをメモします。後半にセキュリティ面も考慮したログイン画面も解説しているので最後までご覧いただけますと幸いです。#express-validatorを使ってミドルウェアを作る
validateMiddleware.jsにバリデートをかけているコードをまとめています。単純にemailに対してメールアドレスとしての形式をとっているかのチェックととpasswerdに対して最低６文字以上のバリデートをかけています。たったこれだけの記述でバリデーションを実装できるので便利ですね。“`javascript:validateMiddleware.js
const { check, validationResult } = require(“express-validator”);const validateParam = (req, res, next) => {
return [check(“emai
NestJSで入門するnpmライブラリ公開生活
今回、既存のJSライブラリをNestJS用にラッピングするライブラリを作成することにして、OSS活動アピ（大したことない）をやってみようと思いました。
以下、作ったライブラリとその概要
## 1. [nestjs-ip-middleware](https://www.npmjs.com/package/nestjs-ip-middleware)
– 動機：NestJSをいじってて、なにかライブラリっぽいものを作ってみたいという思いつき。
– 経緯
– 案件でIP取得する機能をやっていて、偶然[nestjs-real-ip](https://www.npmjs.com/package/nestjs-real-ip)というものを見つけた。
– これはただのラッパーライブラリーで、実装を見ると簡単だったから自分でもこういうの作れるのでは？という経緯。
– ちなみに、アクセス元のIPを取得する[request-ip](https://github.com/pbojinov/request-ip)のラッパー
– 実装
– 完全に真似て作りました。こちらのライブラリではデコレータと
yarn start がまたできない件
# 再びyarn startができない
Reactにてアプリケーション作成中に、
「Error: error:0308010C:digital envelope routines::unsupported」
のようなエラーが出たため、googleで検索すると、解決のためには最低でもnodeのバージョンをv14.18.1まで下げる必要があるとのこと。## nodebrewを使う
ターミナル上で、「nodebrew install-binary v14.18.1」を実行するが、「Can not fetch」となりインストールできない…## nvmでバージョン管理
nodebrewでインストールできなかったため、nvmをインストールして、「nvm install v14.18.1」を実行。すると、無事にインストール完了しました。## まとめ
再びyarn start を実行すると、無事にREACTが起動しました！もし、同じようなエラーがある場合には参考にしていただければと思います。ただ、なぜ問題が起きてなぜ解決したのかその裏側は分からずですね。エラーをきっかけに色々
Expressでシンプルな掲示版を作る
# はじめに
Expressを使ってシンプルな掲示板を作る手順を説明します。ソースコード
https://github.com/jeronimo34/SimpleBBS# 初期設定
以下のコマンドを実行しアプリの雛形を作成します。
テンプレートエンジンに `pug` を選択します。“`
npm install express-generator -g
express –view=pug SimpleBBS
cd SimpleBBS
npm install
“`# 投稿一覧表示実装
## 投稿データの保存先
`app.locals.posts`に投稿データを保存します。`app.locals`に設定した値はアプリケーションの存続期間中、持続します。
アプリケーションを再起動すると投稿データが失われてしまうため、本来はDBにデータを保存すべきですが、今回は簡単のため`app.locals`を使用します。“`javascript:app.js
// データベース
app.locals.posts = [
{
name:”test1″, text: “
[Node.js] Nodemailerで２通以上同時にメールを送信する
この記事は、【 [可茂IT塾 Advent Calendar 2021](https://qiita.com/advent-calendar/2021/kamo-it) 】の17日目の記事です。
Webの作成で実装したことを記事にしました。
誰かのお役に立てれば、幸いです。お問い合わせフォームに入力した内容を入力者と企業に２通同時に確認メールを送るAPIを作成しました。
そこで`nodemailer`を使用したので、まとめて記事にしました。## Nodemailerでメールを送信する。
Nodemailerをインストールします。
https://www.npmjs.com/package/nodemailer
“`
npm i nodemailer
“`### フォーム側
“`typescript
const [fieldValues, setFieldValues] = useState({
// 各フォームの初期値
})const onSubmit = async () => {
const ur
【Node.js】Line Messaging APIでLine Botを作るまでに躓いた箇所をまとめる
#はじめに
普段はVue.jsやNuxt.jsを使っている者です。バックエンド側の知見も得ようと言うことでExpressを最近触りはじめたのですが、今回はLINE botを作るにあたって躓いた箇所をまとめていきたいと思います。#LINE Messageing APIの導入①（ngrokでトンネリングさせる）
LINE Messageing APIのwebhookを使用する際はhttps通信でやりとりをしなくてはいけません。しかしhttpsでやりとりをローカルで行うことはできずherokuに一度アップして動作の確認をする記事が散見しました。
毎回デプロイする手間を省くためにngrokを使用することによってローカルでhttps通信でLINE Messageing APIを試すことができるのでこちらを採用した方が良いかと思います。不便な点としては1時間でsessionが切れてしまうので都度URLを登録し直すのがめんどくさいというところでしょうか。
###■ngrokで引っかかったポイント
ngrokを使用する際は、ターミナルを2つ開く必要があり、片方ではlocalhost3000
