- 1. とりあえずMacでVueの環境を整えてみた
- 2. pm2のプロファイリングを試してみる(前準備)
- 3. WordPressテーマのバージョンをpackage.jsonと同期する
- 4. 【冬休みオトナの自由研究】「2700円でスマートハウス化してみた」の巻
- 5. create-react-appで躓いたこと
- 6. Sequelize-cli-esmでSequelize をESモジュールにする
- 7. 【アプリ開発 1】【Node.js express Docker】 Dockerを用いてNode.js Express MongoDB(mongoose)の環境を構築する【2020年12月】
- 8. APIGWとlambdaでGoogleスマートホームアプリを作成してみた[前編]
- 9. Node.js: Redis のデータを削除 (Delete)
- 10. Node.js: Redis のデータを更新 (Update)
- 11. Node.js: Redis のデータを作成 (Create)
- 12. nodejsでtail
- 13. Node.js: bluebird を使って Redis のデータを読む
- 14. JWTを用いた認証方法(JWT発行と検証方法)
- 15. Google Calenadr APIをnode.jsで使ってみる
- 16. LINE公式でオンラインサロン作ってみたい
- 17. プログラミング超初心者がNode.jsについて理解しようとした
- 18. TestCafe入門 覚えておいたほうがよさそうなこと
- 19. Node.js: Async/Await を使って Redis のデータを読む
- 20. WebsocketとRedis Pub/Sub
とりあえずMacでVueの環境を整えてみた
スタンドアロン版のVue.js devtoolsをmacに入れていくメモ。
なおNode.JSのインストールまでは
[MacにNode.jsをインストール](https://qiita.com/kyosuke5_20/items/c5f68fc9d89b84c0df09)
を参考にさせていただいています。#必要なこと
1.Homebrewのインストール(済)
2.nodebrewのインストール
3.Node.jsのインストール
4.Vue.js devtoolsのインストール###Homebrew
HomebrewはMacでのソフトウェアや拡張機能の管理を行うパッケージマネージャです。便利です。Homebrewのインストールについては
[Homebrewのインストール](https://qiita.com/zaburo/items/29fe23c1ceb6056109fd)
を参照してます。#環境
開始段階の環境として
・mac OS Catalina 10.15.7
・Homebrew 2.7.1
はインストール済みです。
#nodebrewのインストール
##
pm2のプロファイリングを試してみる(前準備)
あけましておめでとうございます。
この記事を編集していたら年を越していました。## EC2を作成
| key | value |
|—|—|
|インスタンスタイプ |t2.micro |
|vCPU |1 |## Node.js, pm2をインストール
“`
curl -sL https://rpm.nodesource.com/setup_12.x | bash –
yum install nodejs -y
node -v
> v12.20.0
npm -v
> 6.14.8
npm install pm2 -g
> 4.5.1
“`## pm2の設定
“`
# 再帰的にディレクトリを作成する
mkdir -p /var/www/test
# pm2の設定ファイルを作成
touch pm2.yaml
# pm2の設定ファイルを編集
vi pm2.yaml
“`“` pm2.yaml
apps:
– script : ./app.js
name : ‘tes-app’
instances: -1 # cp
WordPressテーマのバージョンをpackage.jsonと同期する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/856236/345d4fbb-0e6e-8ec3-be51-e2b628a65bff.png)
管理画面に表示されるバージョンを動的に更新したい。
`postcss`使ってるから、`package.json`と同時に更新してみよう!
# postcssとpostcss-replaceの導入
postcssに関しては省略。
## `postcss-replace`
https://github.com/gridonic/postcss-replace
“`bash
npm install –save-dev postcss-replace
“`# meta.cssを作る
このデータはWordPressしか読まないんですから、ファイルは隔離していいでしょう。“`postcss/meta.css
/*
Theme Name: my_theme
Theme URI: https://example.com/
Autho
【冬休みオトナの自由研究】「2700円でスマートハウス化してみた」の巻
# きっかけ
年末年始だ〜。まとまった時間がとれる〜なんて思っていたら、ムクムクと制作意欲が湧いてきました。
そんな折に、家の洗面台の電球が切れ、Amazonで買おうなんて検索していたら見つけたのがこれ!!
【Amazon Alexa認定 LED電球】OHLUXスマート電球え、スマートLED **2個で2700円!?**
アレクサとかにも繋がるし、ちょっと調べてみたらIFTTTとか、Tuya API(?)など利用して自動化もできそう。
**「これは安いぞ」**と思い大人の自由研究ということで、スマートホーム化で遊んでみることにしました。
create-react-appで躓いたこと
`create-react-app` で Reactアプリを作成したときに、うまくアプリの起動ができなかったため、その経緯と対応を記載します。
##1. create-react-app の実行手順
初めに、`npm` と `node` の version確認を行います。“`ruby:cmd
C:\Users\ユーザー名>npm -v
6.12.1
C:\Users\ユーザー名>node -v
v13.1.0
“`
`npm` と `node` がインストールされていることを確認したので、
`create-react-app` を実行します。“`ruby:cmd
C:\Users\ユーザー名>npx create-react-app my-app途中の表示は省略
We suggest that you begin by typing:
cd my-app
npm startHappy hacking!
“`
`create-react-app` にて、Reactアプリが作成できました。##2. エラーの検出と対応
`create-react-
Sequelize-cli-esmでSequelize をESモジュールにする
—
## 目的
* nodeがESモジュールに対応したので、SequelizeをESモジュールで使用したい。
* フロントエンド、バックエンドともにimportで統一した方が理解しやすい。
* 初めて開発する人にfrontendはimport、backendはrequire()を使用する理由を説明しづらい。—-
## 前提
サンプルでは下記を使用。sequelizeについて基礎的な知識があること。* Node.js v14以降 (ESモジュール対応済み)
* sequelize:6.3.5
* sequelize-cli-esm:5.0.6 (ESモジュール版cli)
* sqlite3:5.0.0 (データベース)* package.jsonに「”type”:”module”」を追加しnodeのデフォルトをESモジュールにする。
⇒**migration初回実行時にエラーとなる場合がある。エラーの場合はいったん削除してから実行。後から戻せばよい。理由は不明だが、2回目以降の実行ではtype:moduleの指定があってもなくてもエラーにはならない
【アプリ開発 1】【Node.js express Docker】 Dockerを用いてNode.js Express MongoDB(mongoose)の環境を構築する【2020年12月】
※当方駆け出しエンジニアのため、間違っていることも多々あると思いますので、ご了承ください。また、間違いに気付いた方はご一報いただけると幸いです。
##Node.js Express MongoDBを用いたアプリ開発
受託開発でNode.js Express MongoDBを用いたアプリ開発を行うことになりました。
開発の中で得られた知見を、支障のない範囲で記録していきたいと思います。
アプリの内容はさておき、チームで開発するため、まずはDockerを用いて開発環境を構築を行います。###構築する環境
– docker-composeを用いて、アプリコンテナ、mongodbコンテナを作成する。
– アプリコンテナとmongodbコンテナの接続テスト(mongoose)を用いて、テストモデルにデータ保存。
– mongo compassからデータの挿入を確認
– mongodbに認証を設ける。作成するユーザーの権限は”root”,”read”,”owner”
– データベースのパスワード等は環境変数で管理(gitignoreにてgitの管理から外す。)※注意点
<アプリ名> <
APIGWとlambdaでGoogleスマートホームアプリを作成してみた[前編]
#初めに
業務で初めてスマートホームスピーカーの開発を行うことになった
今回はその中でもGoogleHomeの開発について備忘録的に、実施事項を記載していく##注意事項
本投稿記事は2020年12月時点の仕様に基づいた実装となります##参考記事
[Google Assistant 公式ドキュメント](https://developers.google.com/assistant/smarthome/overview)##この記事で書いていくこと
– cognitoを利用したアカウントリンクの実装 <- ★本記事ではこちらを実施 - APIGateway+lambdaを利用して、Googleスマートホームアプリのコード実装と各種設定 ##この記事で書かないこと - 基本的なGoogleスマートホームアプリの作成手順について ## 事前に用意しておくもの - Googleアカウント - Googleアカウントに紐づく(Cloud IAM)GCPアカウント #1. 事前設定 プロジェクトやアプリの初期セットアップについては、以下の記事を参考に実施しました [Googleス
Node.js: Redis のデータを削除 (Delete)
“`js:redis_delete.js
#! /usr/bin/node
// —————————————————————
// redis_delete.js
//
// Dec/30/2020
//
// —————————————————————
‘use strict’const util = require(‘util’)
const redis = require(‘redis’)process.on(‘unhandledRejection’, console.dir)
// —————————————————————
async function main (options)
{
var argv = options.argv
const key_in=argv[2]
console.log (ke
Node.js: Redis のデータを更新 (Update)
“`js:redis_update.js
#! /usr/bin/node
// —————————————————————
// redis_update.js
//
// Dec/30/2020
//
// —————————————————————
‘use strict’const util = require(‘util’)
const redis = require(‘redis’)process.on(‘unhandledRejection’, console.dir)
// —————————————————————
function get_current_date_proc()
{
const today = new Date ()
var ddx = (1900 + today.getYe
Node.js: Redis のデータを作成 (Create)
“`js:redis_create.js
#! /usr/bin/node
// —————————————————————
// redis_create.js
//
// Dec/30/2020
//
// —————————————————————
‘use strict’const util = require(‘util’)
const redis = require(‘redis’)process.on(‘unhandledRejection’, console.dir)
// —————————————————————
function dict_append_proc(dict_aa,id_in,name_in,population_in,date_mod_in)
{
var unit_aa = {}
nodejsでtail
electron(nodejs)上で特定のファイルをtailする
tailライブラリを使用する。
https://github.com/lucagrulla/node-tail“`
$ yarn add tail
“`“`App.tsx
import React, { useEffect, useState } from ‘react’
import { render } from ‘react-dom’
import { Tail } from ‘tail’const tail = new Tail(‘file-path’)
const App = () => {
let [texts, setTexts] = useState([]) useEffect(() => {
tail.on(‘line’, (data : string) => {
texts = […texts, data]
setTexts(texts)
})return () => {
tai
Node.js: bluebird を使って Redis のデータを読む
次のプログラムを bluebird を使って書き換えました。
[Node.js: Async/Await を使って Redis のデータを読む](https://qiita.com/ekzemplaro/items/277fce6168dab745264f)ライブラリーのインストール
“`bash
sudo npm install -g bluebird
“`“`js:bluebird_read.js
#! /usr/bin/node
// —————————————————————
//
// bluebird_read.js
//
// Dec/30/2020
// —————————————————————
‘use strict’const bluebird = require(“bluebird”)
const redis = require(‘redis’)
bluebird.pr
JWTを用いた認証方法(JWT発行と検証方法)
# 概要
Webアプリにおいて、クライアント側のSPA(=Single Page Application)からのAPIの認証に、JWTを利用する場合を考える。サーバー側でのJWT発行と、APIに含めれて送られてきたJWTを検証する方法を説明する。
言語はNode.jsとする。
クライアント側でJWTの有効性を検証する、つまりクライアント側で復号用の公開鍵を保持することを想定し、JWTはRSAで署名するものとする(クライアント側での検証をしない場合は共通鍵で署名してもよいが、割愛する)。
JWTの発行と検証そのものは、OSSライブラリ「jsonwebtoken」を用いて簡単にできる。
ref. https://github.com/auth0/node-jsonwebtoken#readme
本記事では、JWT発行の際に必要となる秘密鍵の準備方法をメインに、作成した鍵ペアで実際にJWTを生成し、検証する様を説明する。
鍵ペアの生成はWindows10上で実施するものとする。一部WSL(=
Windows Subsystem for Linux)を利用する。※WSLのWind
Google Calenadr APIをnode.jsで使ってみる
#google calendar APIからスケジュール取得
普段からgoogle calendarをよく利用しています。
google calendarにプライベートと仕事のスケジュールを全て管理しておき、お客様はスケジュールの空いている所にピンポイントで予約を入れられるので、スケジュール調整が自動化出来てとても便利です。そこで、node.jsでgoogle calendar情報を取得させるコードを見つけたので実装してみる事にしました。
node.jsでgoogle calendarを扱う前に、Google APIsで認証キーの発行が必要です。#Google APIsでAPIキー発行
公式ドキュメントのEnable the Google Calendar APIボタンをクリックしてキーを発行します。![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/820683/bb0b27ea-e8c5-e928-15d5-7c196b1a511d.png)
#Google API でプロ
LINE公式でオンラインサロン作ってみたい
#LINEでオンラインサロン
先日、LINE Payの決済について学びました。
ネット検索をしていると、LINEpayのサブクス決済をLINE公式アカウントで実装するコードを公開しているサイトを見つけました。最近、wordpressでオンラインサロン、会員サイトを作りたいという要望がとても多いので
LINE公式アカウント上でサブスク管理が出来、限られた会員だけが使えるLINE公式アカウントがあっても面白いのかなと思い実装してみる事にしました。#動作の説明
まず、お友達登録をしてメッセージを送信
(LIFFで会員になるなどボタンを設置して、テキストを送るのも良いですね)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/820683/ab11e853-1ffd-3d83-32f2-fb82919b1bb7.png)YESを選択
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/8206
プログラミング超初心者がNode.jsについて理解しようとした
JavaScript関連の分野について学習をしていると Node.jsというものがどうしても目に入ってくるのですが、プログラミング初学者の私にとっては、わかりやすく解説しようとしてくれている記事を10本調べてみても結局Node.jsがなんなのかわかりませんでした。
もしかして同じような初心者の人いるのでは?と思い、理解が進んだ説明を書き留めておきます。
Node.js ってなんなん?ていつまで経っても解決しない方はぜひご覧ください。### クライアントサイド JavaScript
Webクライアント(Webブラウザ)で動作するJavaScript。
ユーザーの目に見える場所(フロントエンド)の挙動にあれこれ指示を出す言語。
マウスオーバーするとポップアップが出る、webサイト上に画像のスライダーの挙動を実現させる、など。Webサーバーとの情報のやり取りをしてくれる、言語のような使い方ができるというもの。
↓
本来webページには、登録された情報を引っ張ってくる指示が出されてからサーバーに情報を取りに行って表示されるというプロセスがある。### サーバサイド JavaSc
TestCafe入門 覚えておいたほうがよさそうなこと
# TestCafeとは?
end-to-end testをnode.jsで自動化させたフレームワークです。##記事内容
今回、キャプチャ、cvポイントのテストにあたって、
これ多分次も使うかも?というやつを紹介していきます。## case.1 Basic認証のサイトのテスト
テスト対象サイトがBasic認証がかかっているサイトだと、
認証が通らなかった時の画面をスクリーンショットをとった結果が返ってくる。こちらは[ドキュメント](https://devexpress.github.io/testcafe/documentation/guides/advanced-guides/authentication.html)に全てが載っていました。
“`js:screenshotExample.js
fixture(‘スクリーンショット’)
.page(‘https://example.com’)
// 追加
.httpAuth({
username: ‘example’, //ユーザー名を設定
password: ‘password’ //パス
Node.js: Async/Await を使って Redis のデータを読む
“`js:redis_read.js
#! /usr/bin/node
// —————————————————————
//
// redis_read.js
//
// Dec/30/2020
// —————————————————————
‘use strict’const util = require(‘util’)
const redis = require(‘redis’)process.on(‘unhandledRejection’, console.dir)
// —————————————————————
async function main (options)
{
const redisUrl = ‘redis://127.0.0.1:6379’
const client = redis.c
WebsocketとRedis Pub/Sub
Redisの[Pub/Sub機能](https://redis.io/topics/pubsub)を使うとWebsocketの通信情報を複数のサーバー間で同期させることができます。
スケールのためにWebsocketのサーバーを複数立てた場合、サーバー間で通信情報を同期する仕組みがないと、例えばチャットアプリケーションの場合、サーバーAに接続されたクライアントはサーバーBに接続されたクライアントとは正常にメッセージのやりとりができないことになってしまいます。
RedisのPub/Sub機能はそれを解消することができます。![スクリーンショット 2020-12-28 20.44.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/260824/6ae93db6-c8db-40b4-2373-e1682083728b.png)
## Redis Pub/Subとは
Pus/Subにでてくる主な概念です。
| 用語 | 説明 |
| — | —- |
| Publish | 発行すること