- 1. Node.js+AWS Lambda+DynamoDBで作るLINEBot
- 2. 【Express】環境変数を取得する方法
- 3. expressの開発にTypeScriptを利用する
- 4. nodeをTypeScriptで利用する
- 5. ロボットが毎日自動で情報収集してブログを書いて投稿するBOTをAzure Functionsで動かしてみる
- 6. 【Firebase】サイトを公開する方法
- 7. 配列とオブジェクトの扱いについての考察
- 8. Webstorm + WSLでnode.jsやyarnを使う
- 9. Amplifyをシンプルなライブラリとして使うサンプル
- 10. 【GCP】7 PERMISSION_DENIED: Missing or insufficient permissions
- 11. macOS 11.2 で M1 native な node を動かす
- 12. 【Express】.envファイルとHerokuの環境変数を同期する方法
- 13. npmに公開する前に、パッケージの動作確認をする方法
- 14. 【Mac】node_modulesを全削除するコマンド
- 15. Electron で ES Modules を使う。
- 16. Nodeのバージョン管理ツールVOLTA⚡
- 17. 【Slack/Bolt】Slackアプリで自分のステータスを設定する
- 18. Node.js: JWT のペイロード部をデコード
- 19. JavaScriprt(Node.js)でAzureのVMを起動/停止(割り当て解除)する
- 20. (node.js) esbuildの開発環境を作成してみた
Node.js+AWS Lambda+DynamoDBで作るLINEBot
先日、[X-HACK勉強会](https://x-hack.connpass.com/)でLINEBotの作り方を学びました。
勉強会ではおうむ返しをしてくれるBotを作ったのですが、自分がほしいBotを作ってみよう!と思いアレンジして作ってみました。
# 電車発車時刻を送ったら準備開始時間と家を出る時間を教えてくれるLINEBot
**家から駅が近い・電車が数分おきに来る都会の人には完全不要Botです。**
![IMG_CFDC000E4F39-1.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/311806/0ee8d915-4901-5611-7a5e-970ddf43d39a.jpeg)
## 機能
– 電車発車時刻を送ると準備開始時間・家を出る時間を返信してくれる
– 準備時間を変更する(デフォルトは30分)
– 家から駅までの時間を変更する(デフォルトは15分)
– 現在の設定されている準備時間・家から駅までの時間を確認する## 作ろうと思ったきっかけ
数ヶ月前に引っ越しをして
【Express】環境変数を取得する方法
#プログラミング勉強日記
2021年2月9日
ネットで調べると`process.env`を付けると環境編集を取得できるとあったが、それだけでは取得できなかった。その方法をまとめる。#失敗した環境変数を取得する方法
`process.env`で環境変数を取得できる。“`js
const env = process.env.変数名;
console.log(env);
“`“`:実行結果
$ node app.js
undefind
“`#dotenvで.envを読み込む
dotenvは.envファイルを読み込んで、`process.env`に設定するモジュール。##1. dotenvをインストールする
“`
$ npm install –save dotenv
“`##2. 環境変数を取得する
“`js:app.js
require(‘dotenv’).config();
const env = process.env.変数名;
console.log(env);
“`“`:実行結果
$ node app.js
環境変数の値が表示さ
expressの開発にTypeScriptを利用する
expressをTypescriptで開発する方法のメモ。
nodeをTypeScriptで利用する基本的方法は[こちら](https://qiita.com/zaburo/items/0d47b3c8588bb3f96353)をどうぞ。## 準備
### 場所の準備
“`bash
mkdir ts-express-test
cd ts-express-test
“`### 必要なモジュールのインストール(Typescript使うため)
tsc, ts-nodeをインストールして、tsconfig.jsonも生成しておきます。
“`bash
npm init -ynpm install -D typescript
npm install -D types/node
npm install -D ts-nodenpx tsc –init
“`### expressのインストール
expressとtypesをインストールします。
“`bash
npm install express
npm install -D @types/express
nodeをTypeScriptで利用する
フロントエンドはだいたいTypescriptに書くのが普通になってきたので、次はバックエンドも。
## 準備
まずは準備。
### 作業場の作成
“`bash
mkdir ts-test
cd ts-test
npm init -y
“`### 必要なモジュールインストール
必要なモジュールをインストールします。ポイントはts-nodeのインストールです。
ts-nodeはjsのトランスパイルなしにtsコードを実行してくれます。“`bash
npm install -D typescript
npm install -D @types/node
npx tsc –initnpm install -D ts-node
“`> -Dは–save-devと同義。tsc –initでtsconfig.jsonも生成しておきます。
## 実装
まずファイルを作ります。
“`bash
touch index.ts
“`実装します。簡単なコードです。
“`ts:index.ts
const hello = (message: string
ロボットが毎日自動で情報収集してブログを書いて投稿するBOTをAzure Functionsで動かしてみる
#毎日自動で情報収集して、ブログを書いて投稿するBOTをAzure Functionsで動かしてみる
##はじめに
本記事は以下の続きです
※Node.jsでBOTを作成してワードプレスに記事を投稿する
https://qiita.com/abemaki/items/79e90f56f954e9eafb7d前回、自動で記事を作成して投稿するBOTを書きましたが
このBOT自身を定期的に自動起動する仕組みがないので、今回はAzure Functionを用いてそれを実現しようと思います。※当初はCIを構築して、定期実行しようと思ったんだけどいかんせんコストがかかる・・・。
今回はAzure Functionを活用してサーバレスでBOTを動かして記事をかきまくります。![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/524081/53427bd1-674c-5ab4-5ed6-ea13817371c3.png)
##Azure Functionとは[Azure F
【Firebase】サイトを公開する方法
## 手順
1. [firebase](https://firebase.google.com) ←こちらからfirebaseのサイトに行ってGoogleアカウントでログインする。
2. firebaseのコンソールで、サイトを管理するプロジェクトを作成する。
3. 自身のパソコンのデスクトップなどに先ほど作成したプロジェクト名と同じ名前のフォルダ(管理しやすいため)を作成する。(例:MyPortforioなど)。
4. そのフォルダの中に、公開したいサイトのフォルダを移動、またはコピーする。(※firebaseにアップロードすると全てのファイルが公開されてしまうため、みられたくないファイルは入れないようにする。)
5. [node.js](https://nodejs.org/ja/) をインストール。
6. ターミナルにて`node -v`、`npm -v`を実行し、node.jsとnpmがインストールされているか確認する。
7. firebaseのコマンドラインツールを、npm(Node Package Manager)を使って導入していく。管理者権限で導入したいので、コマ
配列とオブジェクトの扱いについての考察
#配列とオブジェクトの出力についてまとめてみた
題材“`javascript
① data[[“a” , “b”]]
② data[“a” , “b”]
③ data{“a”,”b”}
“`
上記の取り扱いについて###①data[[“a” , “b”]]//配列の中に配列が入っている。
“`javascript
data[[“a” , “b”]]
//呼び出す時は
console.log(data) //[[“a” , “b”]]
console.log(data[0]) // [“a”,”b”]
console.log(data[1]) // undefined
“`
###②data[“a” , “b”] //基本の配列“`javascript
data[“a” , “b”]
//呼び出す時は
console.log(data) //[“a” , “b”]
console.log(data[0]) //a
console.log(data[1]) //b
“`
上記①、②は変数名(data)か変数名にインデックスを使用して呼び出す(data[n]
Webstorm + WSLでnode.jsやyarnを使う
# まえがき
普段 **React** や **Vue** を触るなら、Windows上にnode.jsを入れて動かせば十分ですが、
実環境で動作テストしたいとか、Linux上にある何かしらのライブラリを叩きたいときには不便です。Ubuntu内にIDEをインストールしてXServとかで飛ばすのもナシではないですが、
WSL上でGUIを動かすと重かったりなんとなくイマイチな感じです。ということで、Windows上でのWebstormにWSLを繋いで環境構築を行ってみました。
基本的にはかなり簡単ですが、yarnだけコケがちなので注意です。# 前提
以下の環境があることが前提です。
* WebStorm (Windows上)
* WSL2が動作する環境 (今回はUbuntu 20.04を使用)# WSL環境へのnode.jsのインストール
とりあえずWSL上にnode.jsが入っていないことには始まりません。
[パッケージマネージャを利用した Node.js のインストール | Node.js](https://nodejs.org/ja/download/pac
Amplifyをシンプルなライブラリとして使うサンプル
# 対象
Amplifyを使ってAWSのサービスを簡単に叩きたい人# 準備
任意のディレクトリで“`
npm init
“`
からの“`
npm i aws-amplify
“`
としておきます。# Amplifyライブラリの仕組み
amplify addやらでサービスを構築していくと、amplifyのconfigが自動的に構成されて、気が付かないうちに便利なツールになっているのが特徴です。
逆に言えばこれらを自分で書いてちょっとした便利ツールとして使うことも可能です。
Cogmnitoの認証やAPIの呼び出しなど、Amplifyライブラリを使用したほうが断然楽です。例えばサインインでは
“`javascript
const Amplify = require(‘aws-amplify’)
const config {
“aws_project_region”:”ap-northeast-1″,
“aws_cognito_identity_pool_id”:”ap-northeast-1:0000000….”,
“aws_cogn
【GCP】7 PERMISSION_DENIED: Missing or insufficient permissions
CloudFunctions for Firebaseでローカルエミュレーターではfires-tore へデータの登録ができるが、deployしてクラウドから実行すると下記のエラーが出ていた。
>7 PERMISSION_DENIED: Missing or insufficient permissions
ここを参考にFirebase Admin SDKのserviceAccountKeyを設定する
https://firebase.google.com/docs/admin/setup?hl=jaFirebaseコンソール → (左上の)設定 → サービスアカウント
から、新しい秘密鍵の生成
xxx.json
を任意の場所へ配置する。“`
var admin = require
macOS 11.2 で M1 native な node を動かす
M1 Mac で macOS Big Sur 11.2 に更新したら M1 native な node が壊れたので、ソースを変更して動くようにしたメモです。
## 現象
homebrew で最新版の node v15.8.0 を入れて React での開発に使ってましたが、macOS を更新したら create-react-app で作ったプロジェクトで `yarn start` がクラッシュするようになりました。(create-react-app を使わずに `webpack serve` してれば大丈夫なようですが…。)
エラーを見る
“`
Starting the development server…#
# Fatal error in , line 0
# Check failed: allocator->SetPermissions(reinterpret_cast(region.begin()), region.size(), PageAllocator::kNoAc 【Express】.envファイルとHerokuの環境変数を同期する方法
#プログラミング勉強日記
2021年2月8日#前提条件
– すでにHerokuに環境変数が設定されている
まだ環境変数を設定していない場合は、[【Heroku】Herokuで環境変数を設定する方法](https://qiita.com/mzmz__02/items/64db94b8fc67ee0a9068) から環境変数を設定してみてください。
#Herokuの環境変数と.envファイルを同期する方法
##1. heroku-configをインストールする
“`
$ heroku plugins:install heroku-config
“`##2. Herokuの環境変数を.envに同期する
“`
$ heroku config:pull
“`“`:値を上書きしたい場合
$ heroku config:pull –overwrite
“`“`:.envを編集して環境変数を上書きしたい場合
$ heroku config:push
“`npmに公開する前に、パッケージの動作確認をする方法
## はじめに
`npm publish` で公開する前にパッケージを確認する方法として、以下の 2 つがありそうです。
– `npm link` で、開発中にパッケージの動作確認を行う
– `npm pack` で、`npm publish`で公開される内容を事前に確認するそれぞれ見ていきます。
## 環境
npm: 6.14.10
## 開発中にパッケージの動作確認を行う
npm-link を使うと、ローカルの別のパッケージから、確認したいパッケージを呼び出すことができます。
> npm link (in package dir)
> npm link [<@scope>/][@ ]
>
> alias: npm ln引用: [npm-link](https://docs.npmjs.com/cli/v6/commands/npm-link)
npm-link は次の 2 ステップで行います。
### 1. 参照したいパッケージで、`npm link`を実行する
参照したいパッケージで`npm link`を実行すると、グローバル
【Mac】node_modulesを全削除するコマンド
自分はこれで30GBの容量確保に成功しました。
## コマンド
* カレントディレクトリ配下のnode_modulesが全て削除されます。適切なディレクトリで実行してください。
* コマンドを改変する際は自己責任でお願いします。“`sh
find ./ -name “node_modules” | xargs rm -rf
“`管理者権限はつけない方がいいですが、`permission denied` が出る場合は自己責任でお願いします。
Electron で ES Modules を使う。
# 概要
`Node.js`が`ES Modules`(以下`ESM`)をサポートするようになったので、`Electron`のメインプロセスでも`ESM`を使いたいというニーズが[当然のように出てきました。](https://github.com/electron/electron/issues/21457)
そこで[`Electron`のクイックスタートガイド](https://github.com/electron/electron-quick-start)を改変して、メインプロセス(`main.js`) で`ESM`をインポートできるようにやってみましたのでその方法を紹介します。ただし今のところ少し問題があるので、補足2を読んだ上で実際に使うかどうかは判定してください。# 準備
[Electron Quick Start](https://github.com/electron/electron-quick-start)をクローンしてそのフォルダに入ります。
“`
$ git clonen https://github.com/electron/electron-quNodeのバージョン管理ツールVOLTA⚡
## WindowsのNodeバージョン管理を探して三千里
みなさんWindowsのNodeのバージョン管理ってどうしてますか?
私はNodistを使っていたのですが、WSL環境と相性が悪い(npmのコンフィグが一部Windowsのパスと混在して壊れた)ので、ひとまずWinもLinuxも同じ管理ツールがないものか、と探していたところ、VOLTA⚡がRustで書かれていて早いしマルチプラットフォームだぞ、ということで使用してみました。
## VOLTA Install
新進気鋭なためか、MS開発の新進気鋭のパッケージ管理ツールWingetや毎度おなじみChocolateyには残念ながら対応していません。
そういうわけで[GitHubからインストールしよう](https://github.com/volta-cli/volta/releases)。.msiファイルで良いでしょう。
今回入れたバージョンは1.0.1。メジャー昇格おめでとう。みたいなタイミング。
## Node Install
他のNodeバージョン管理ツールに付いているような現在のNodeのリストをババーンと
【Slack/Bolt】Slackアプリで自分のステータスを設定する
#1 作ったもの
![operation.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/74780/e02c5238-29da-8117-1f56-baf69bbcf13c.gif)ソースコードは[こちら](https://github.com/syoppylife/slack-set-status-app)
#2 この記事で書くこと
**書くこと**
* Slackアプリのコンソール上の設定箇所と関連しているソースコードの説明
* ハマったところ①(Slash ‘/’ コマンドによるアプリの実行)
* ハマったところ②(アイコンを選択した人が自分のステータスを変更できる条件/方法)
* このアプリの問題点
* 作成に至った背景**書かないこと**
* slackアプリの作り方
* Block Kit Builderの使い方
* Boltについてや使い方
* Herokuの使い方書かないことばっかですが、それぞれ以下をみていただければ問題ないと思います。
[Slackアプリの作成]Node.js: JWT のペイロード部をデコード
次の記事を参考にしました。
[JWTクレーム・セット部分のデコード方法](https://qiita.com/hoshimado/items/615173e1cdb37a597aa0)“`js:decode_jwt.js
#! /usr/bin/node
// —————————————————————
// decode_jwt.js
//
// Feb/07/2021
//
// —————————————————————
‘use strict’const fs = require(“fs”)
// —————————————————————
var atob = (base64) => {
const buffer = Buffer.from( base64, ‘base64’ )
const utf8 =JavaScriprt(Node.js)でAzureのVMを起動/停止(割り当て解除)する
# はじめに
JavaScriptのAzureSDKを使用してAzureにアクセスを行う手順です。
Microsoftのドキュメントを参照すれば分かることですが、「ちょっと動かしてみる」ができる記事があればと思い投稿しました。既にAzureを使用してVMを使ったりしている方を対象としています。
# 本記事の動作確認環境
本記事は以下の環境で動作確認を行っています。* Windows10 Professional 20H2
* WSL2.0
* Node.js v14.15.4
* azure-cli 2.0.81
* Python (Linux) 3.8.2 (default, Jul 16 2020, 14:00:26)# 必要なもの
* Azureアカウント
* 持っていなければ作りましょう。
* https://azure.microsoft.com/ja-jp/free/
* 本記事ではVMの起動を例にしているので、VMが作られていると良いかもしれません。
* Azure CLI 2.0(node.js) esbuildの開発環境を作成してみた
## やったこと
1. esbuildを試すべく、開発用の環境を用意
2. esbuild watchモードが使い辛かったので改善## ちゃんと使えたか?
個人開発でクオリティはさておき、ちゃんと動いてくれました。(React×esbuild)
[補助金検索してみようWeb](https://subsidy-support-site.web.app/#/search_page)## esbuildで困った点
普段webpackでバンドルしていますが、webpackと比較してこんな点、困りました。### esbuildのwatchモードのログ出力が見辛い
完全に個人の好みかもしれませんが、esbuildのwatchモードのログはJSONな形式で渡されるので、そのままログに出力すると見辛かったです。見易く修正しました。### 型チェックがない
普段webpackでは型チェックもやってくれていたので、esbuildで使えなくて初めて恩恵を実感しました。いざ開発してデプロイすると案外凡ミスが隠れているものです。これも対処しました。## 環境
以下の構成で作成しました。関連する記事
OTHERカテゴリの最新記事
-
- 2024.09.19
JavaScript関連のことを調べてみた
-
- 2024.09.19
JAVA関連のことを調べてみた
-
- 2024.09.19
iOS関連のことを調べてみた
-
- 2024.09.19
Rails関連のことを調べてみた
-
- 2024.09.19
Lambda関連のことを調べてみた
-
- 2024.09.19
Python関連のことを調べてみた