- 1. Cloud Functions for FirebaseとFirebase Hostingを試してみる
- 2. Node.jsでつくるNode.js-WASMコンパイラ – もくじ
- 3. WSL2でElectronを動かすの巻
- 4. Vue Web App Tutorial
- 5. Node.js でつくる WASMコンパイラー – 07：ユーザ定義関数を実装する
- 6. これからチーム開発に参加するUIデザイナーがGitHubでの開発フローをまとめた
- 7. node.jsでHTTPリクエストを受け取るAPIを作る
- 8. npm pack でnpmパッケージを圧縮する
- 9. AWS DynamoDBをjsでいじるときに非同期処理で詰まった話
- 10. API Gateway + Lambda + DynamoDBでサーバーレス環境を構築する
- 11. Nightmare.js でEC-CUBEの注文データを程よく自動生成する
- 12. 非プログラマのWindowsマシンにGit、Node.js、Nuxt.js環境を構築する手順
- 13. 【初心者向け】kubenetesのSpring bootとNodejsのアプリケーションをOpenShiftへデプロイしてみた
- 14. AWS Lambdaで毎日料金を取得する
- 15. Node.jsでFirestoreにDate型を渡すとエラーになる
- 16. Node.js でつくる WASMコンパイラー – 06：文字列出力を実装しFizzBuzzを実現する
- 17. GraphQLについてのハンズオン
- 18. IoTの力を使って、スポーツ後の靴を早く乾かす
- 19. macでPATHを通す方法
- 20. 超初心者が子供の服装について目安を教えてくれるLine Botを作ってみた
Cloud Functions for FirebaseとFirebase Hostingを試してみる
## やること
Cloud Functions for FirebaseとFirebase Hostingを試してみようと思います。
html/cssの静的ファイルのデプロイ、jsファイルの動的ファイルのデプロイ、html/css/jsの動的サイトのデプロイ、の3パターンを試してみようと思います。## Firebaseを使うための準備
Firebase CLIをインストールとログインをします。
“`bash
~$ npm i -g firebase-tools
“`インストールが完了したらプロジェクトディレクトリを作成＆移動してFirebaseにloginします。
“`bash
~$ mkdir firebase-sample
~$ cd firebase-sample
~$ firebase login
“`loginしたらFirebase ConsoleでFirebaseプロジェクトを作成しておきます。今回は「myproj」という名前で作っておきましょう。
Firebaseプロジェクトを作成したらinitしていきます。“`bash
~$ fireb
Node.jsでつくるNode.js-WASMコンパイラ – もくじ
# はじめに
「RubyでつくるRuby ゼロから学びなおすプログラミング言語入門」(ラムダノート, Amazon) という本に感銘を受けて、自分でもNode.jsで小さなプログラミング言語を作ってみるシリーズをやってみました。「[ミニインタープリター](https://qiita.com/massie_g/items/3ee11c105b4458686bc1)」「[ミニコンパイラー](https://qiita.com/massie_g/items/3ba1ba5d55499ee84b0b)」ときて、三部作(?)の最後はミニNode.jsからWASMを生成する小さなコンパイラーに取り組んでいます。
# 前提環境
今回は私の環境である macOS 10.14 Mojave を前提にしています。また Node.js v10.13 で動作を確認しています。
# Node.js-WASM コンパイラー目次
– [WASM コンパイラー – 01：WASMで定数戻り値を返す](https://qiita.com/massie_g/private/3c627db366ed20b8b7
WSL2でElectronを動かすの巻
こんにちは！
お鍋が美味しい季節になってまいりました。おさむです。
WSL2＋Electronな環境を構築する機会がありましたので、やり方をシェアしたいと思います。# この記事のゴール
WSL2環境下にて、Electronで作成した画面が表示出来るところまで# 前提
1. WSL2のセットアップが完了している
2. Ubuntu 18.04 LTSのOSイメージを使用している（たぶん他のディストリでもいける）# やりかた
## ①Node.jsとnpmのインストール
apt-getで入れてしまいましょう。“`bash
# Node.js
$ sudo apt-get install -y nodejs# npm
$ sudo apt-get install -y npm
“`## ②プロジェクトの作成
[Electron Documentation](https://electronjs.org/docs/tutorial/first-app) に従い、npmのプロジェクトを作成します。“`bash
# ディレクトリを作成し、その中に移動
$ mkd
Vue Web App Tutorial
# 11月16日 Web Application 製作入門
[富山IT勉強会#4](https://toyama-it.connpass.com/event/151572/) のハンズオン資料をまとめたものです。
非エンジニア、およびWebアプリ未経験者を対象に簡単なWebアプリ(SPA)を作成するハンズオンを行います。## このハンズオンのゴール(目的)
– **必要最低限の知識で** Webアプリを作れるようになる(概念、環境構築 ～ Local環境での動作確認)
– 今後、更にレベルアップしていく際の切り口を共有する## おことわり
一日(4h ほど)で行う予定であるため、最低限知っていれば取りあえずアプリが作れる程度に厳選しております。
そのため、かなり内容は端折っておりますのでご了承ください。
また、私自身プログラミング経験はWindowsアプリケーションがほとんどで、
Web関係は直近一年弱程度ですので情報にはかなり偏りがあります。
また、誤情報等、お気付きの場合にはご指摘頂けると幸いです。## やること
– JavaScript入門(環境構築〜変数、制御構文
Node.js でつくる WASMコンパイラー – 07：ユーザ定義関数を実装する
# はじめに
Node.jsで小さなプログラミング言語を作ってみるシリーズを、「ミニインタープリター」「ミニコンパイラー」とやってきました。そして三部作(?)の最後として、 ミニNode.jsからWASMを生成する小さなコンパイラーに取り組んでいます。
– [Node.jsでつくるNode.js-WASMコンパイラ – もくじ]( https://qiita.com/massie_g/items/c663095759a80c53c126)
– 前回の記事 … [06：文字列出力を実装しFizzBuzzを実現する](https://qiita.com/massie_g/private/2bbd6a914f1abdac195a)## これまでの取り組み
– [Node.jsでつくるNode.js（ミニインタープリター） – もくじ](https://qiita.com/massie_g/items/3ee11c105b4458686bc1)
– [Node.jsでつくるNode.jsミニコンパイラ – もくじ](https://qiita.com/massie_g/item
これからチーム開発に参加するUIデザイナーがGitHubでの開発フローをまとめた
##これからチーム開発に参加するUIデザイナーがGitHubでの開発フローをまとめた
##注意
– (自分用備忘録です)
– (開発初学者です)###前提
– 環境構築が終わっていてローカルホストが立ち上がっている状態
– リモートリポジトリのcloneがローカルに完了している###いつもはじめにやること
0-1.開発が決まったら、作業リボジトリにXDなどのデザインデータのリンクを貼った開発issue を立てる
– issue番号はメモっておき、あとでbranch名に使う0-2.githubに接続する
`$ ssh github`0-3.ターミナルでcloneした作業レポジトリ(ローカル)まで移動する
ターミナルでの操作
`$ cd git`
`$ cd 作業リポジトリ名`準備完了！
###フロー
1. レビュワーがGitHubのPull requestsにrelease noteを切ってるのを確認する
例) master from release/0.0.1
2. Pull requestsの項目の一番を見る 上のvが最新のrele
node.jsでHTTPリクエストを受け取るAPIを作る
#はじめに
今回はNode.jsのフレームワークであるExpressでHTTPリクエストを受け取るアプリケーション？を作りたいと思います。
利用用途としては* しっかりリクエスト送れてるの？
* Expressとかnode.jsでAPIを作ってみたいといったことが想定されます。私の場合は主に、というか9割前者ですね。JMETERでリクエストが正しく送れているか確認したかっただけです。
#実装
##下準備
まず以下のコマンドを実行します。この時、プロジェクトのディレクトリ内で行いましょう。“`
> npm init
“`
あとはダイアログに従い、入力するだけです。
すると`package.json`が作成されると思います。次にExpressをインストールします。
“`
> npm install express -save
“`
このコマンドをたたけばいろいろダウンロードされ、環境が整います。##実行するファイルを作る
“`index.js
const express = require(‘express’)
const app = expres
npm pack でnpmパッケージを圧縮する
node_module内のファイル(主にandroidのbuild.gradleなど)を編集した際に`npm pack`のコマンドを使用して変更を加えたパッケージを.tgzファイルにして、package.jsonの読み込み先を.tgzファイルに必要がある。
### 手順
例：`react-native-maps`の`build.gradle`を編集した時
– 編集したパッケージのフォルダに移動(`node_modules/react-native-maps/`)し、.tgzファイルを生成
“`
npm pack
“`
– custom_modulesフォルダを作っておき、生成された.tgzファイルをcustom_modulesフォルダに移動する
– 読込先を.tgzファイルに変更する“`
npm i react-native-maps-0.24.2.tgz
“`– package.jsonの読み込み先が変更されているか確認する
“`package.json
“react-native-maps”: “file:custom_modules/react-nat
AWS DynamoDBをjsでいじるときに非同期処理で詰まった話
# AWS DynamoDBをjsでいじるときに非同期処理で詰まった話
## 初めに
このお話は、単に私がJavaScriptの非同期処理を理解していなかっただけなので、プロの皆さんでしたら余裕で回避できる問題だと思います。
私みたいな初学者で、同じようなことに詰まっている方がこの記事を見て解決していただけたら幸いです。
## 私がやりたかったこと
DynamoDBのCRUD操作を関数内で行い、実行結果を戻り値として受け取る といったことをしたかったのですが、戻り値に値が入っていない状態で返されてしまいました。
“`javascript
// 問題のあるコード
function getHoge(){
let hoge;let params = {
TableName: ‘table’,
Key:{
“id”: “01”
}
};documentClient.put(params, function(err, data){
if(e
API Gateway + Lambda + DynamoDBでサーバーレス環境を構築する
# API Gateway + Lambda + DynamoDB = Serverless
AWSでサーバーレスを構築するアーキテクチャを考えた時に、もっとも基本的でわかりやすい構成は、API Gateway + Lambda + DynamoDB(ないしはS3)の組み合わせだと思います。
## このエントリーで触れること
– Lambda関数の作り方
– API Gatewayでのリソースの作り方
– API GatewayとLambda関数の紐づけ方
– Lambda関数でのDynamoDBのいじり方AWS SAMには触れないです。
## Lambdaで関数を作る
Lambdaで関数を作ってデプロイするのは非常に簡単な作業です。
ランタイムはnode.jsを使います。
関数を作成する方法としては、
1. AWSコンソール上で関数を作成する
2. ローカルで関数を作成してzip化し、Lambdaにアップロードする
3. ローカルで関数を作成してzip化し、S3にアップロードした後に、Lambdaからそれを呼ぶ
4. ローカルで関数を作成してzip化し、cliでデプロ
Nightmare.js でEC-CUBEの注文データを程よく自動生成する
## 環境
・EC-CUBE4.0.3
・Node.js## はじめに
自動で注文データを作ろうと思うと、EC-CUBE3系の頃から[nanasess](https://qiita.com/nanasess)さん作成の Fakerを使った`GenerateDummyDataCommand` コマンドに大変お世話になっています。
4系でも、少し仕込みをしてから ` bin/console e:f:g ` (←アルファベット順なので覚えやすいw)で各種データを作ることができます。
また、[slack から EC サイトの自動注文テストを走らせる (puppeteer)](https://qiita.com/sunadorinekop/items/9d78e7e271748cff8add)も良記事です。今回は、古参の[Nightmare.js](http://www.nightmarejs.org/) を使って実現しています。
こんな感じで、自動実行できるわけです。のWindowsPCにNuxt開発環境を構築してもらう必要がありましたので手順書を作りました。
# 目標
非プログラマーが非プログラマ―の操作によって開発環境を構築します。
最終的にWindowsPCでNuxt.jsのプロジェクトを起動することを目標とします。# 導入内容
– Git for Windows
– Tortrise Git
– Node.js
– Yarn
– Nuxt.js# 事前に準備するもの(プログラマーが伝えておくこと)
– Nuxt.jsプロジェクトを管理しているGitリポジトリのURL
– 導入するNode.jsのバージョン(たいていLTSでOKかと思います)
– Nuxt.jsプロジェクトの起動・接続方法(たいてい`yarn dev`、`localhost:3000`でOKかと思います)# 手順
## Gitのインストール
以下の記事が完璧な内容でした。
[TortoiseGitのセットアップ](https://qiita.com/SkyLaptor/items/6347f38c8c010f4d5bd2)
【初心者向け】kubenetesのSpring bootとNodejsのアプリケーションをOpenShiftへデプロイしてみた
#さまり
OpenShiftにSpring-bootとNodejsのアプリケーションのデプロイを試してみましたので、そのメモといくつか気づいたことを残して見ました。結論からいうとOpenShiftの特有の手法は今回特に利用していないため、大きい違いは発見していません。KubernetesよりOpenShiftに移行することによるデプロイ手順の参考になればと思います。#環境
本手順で利用したOpenShiftのバージョンは4.1です（minishiftではありません）。ローカルPCはMacbookを利用していました。
本手順にて利用したコードは以下のGithubから確認してください。
https://github.com/Zhuangbili/openshift_spring_nodejs
#Spring boot アプリケーションのデプロイ####準備
OpenShiftでマイクロサービスの開発を行うためのベースコードを作成することがメインの目的でしたので、まず簡単なコードを書いて見ました。参考：https://github.com/Zhuangbili/openshif
AWS Lambdaで毎日料金を取得する
# AWS Lambdaで毎日料金を取得する
## TL;DR
AWSのダッシュボード見たほうが早い## はじめに
監視しようがしてなかろうが、どのみちAWSのコンソールを常に開いている人にとっては、AWSのダッシュボード見たほうが正確で早いです。しかし、そこまでAWS漬けでもない人にとってはいちいちAWSのコンソールを開き、料金やインスタンスの稼働状況を確認するのは面倒です。そこでSlackに稼働状況を監視して通知するAWS Lambdaの関数を定義して、楽して監視するようにします。
## やりたいLambda関数の疑似コード
* EC2の全インスタンスを取得する
* タグ情報を取得し、稼働状態を列挙する
* CostExplorerから料金情報を取得する
* 現時点の料金を出力
* 現時点の料金を日数で割り、月の日数倍して予想価格を出す料金は直近の1日分料金を取得し、その金額を月の残りの日数分足したほうが正確ですが、これはこれで1日だけ異様に活発だった時等に瞬間風速に引きずられてそこまで正確じゃないので、今回は今までの平均が一番平均に近いという
Node.jsでFirestoreにDate型を渡すとエラーになる
Firebaseのクラウドデータベースである[Cloud Firestore](https://firebase.google.com/docs/firestore?hl=ja)は、Timestamp形式での日付・時刻の保存に対応しており、その日付順にソートすることができます。
“`typescript
const db = firebase.firestore()
const data = await db.collection(‘messages’)
.orderBy(‘date’, ‘asc’)
.limit(limit)
.get()
.then(querySnapshot => {
return querySnapshot.docs.map(doc => doc.data())
})
“`また、`startAt`や`endBefore`といった特定の期間で区切ることもできます。
“`typescript
const db = firebase.firestore(
Node.js でつくる WASMコンパイラー – 06：文字列出力を実装しFizzBuzzを実現する
# はじめに
Node.jsで小さなプログラミング言語を作ってみるシリーズを、「ミニインタープリター」「ミニコンパイラー」とやってきました。そして三部作(?)の最後として、 ミニNode.jsからWASMを生成する小さなコンパイラーに取り組んでいます。
– [Node.jsでつくるNode.js-WASMコンパイラ – もくじ]( https://qiita.com/massie_g/items/c663095759a80c53c126)
– 前回の記事 … [05：条件分岐とループを実装する](https://qiita.com/massie_g/private/efef9e1a909eab8ab8e4)## これまでの取り組み
– [Node.jsでつくるNode.js（ミニインタープリター） – もくじ](https://qiita.com/massie_g/items/3ee11c105b4458686bc1)
– [Node.jsでつくるNode.jsミニコンパイラ – もくじ](https://qiita.com/massie_g/items/3ba1ba5d
GraphQLについてのハンズオン
# 概要
GraphQLについて、NodeJSのウエブフレームワーク[majidai](https://www.npmjs.com/package/majidai)を使ってハンズオンを実施したいと思います。GraphQLとは何かを理解する前に、クライアントとサーバーの間でデータのやり取りするにあたってどの様な方法あるか考えてみましょう。僕が認識している中では、以下の３つの方法が主流ではないかと思います。#### ① 従来のやり方
クライアントからリクエスト受け付けるたびにDBサーバーから情報を取得し、色々と整形しレスポンス
#### ② REST API
用途毎にエンドポイントを用意する
 macでPATHを通す方法
>『ブロックチェーンアプリケーション開発の教科書』
6-1-3
p.138
での躓き。## 超初心者向けに書いています
__1. `~/.bash_profile` (あるいは.zshrc)に任意のPATHを追記__
__2. `source` で反映させる。__上の2点を達成できればいいので無理に `vi` や `vim` を使う必要はありません。
とにかくPATHを追記してsourceしてください。
ref: [vim/vi](#vivim)## 設定ファイルの作成
設定ファイル
bashの場合 `.bash_profile`
zshの場合 `.zshrc`“`
$ cd ~ // ホームディレクトリに移動する
$ ls -la // カレントディレクトリの情報を表示する/* 実行例 */
drwx—— 16 user staff 512 4 12 18:03 .Trash
-rw——- 1 user staff 235 3 29 17:15 .ba超初心者が子供の服装について目安を教えてくれるLine Botを作ってみた
##はじめに
プログラミングを勉強し始めてから2か月経過しました。
休み休みなのでちょっとずつの進歩ですが、
自分の成長のために新たなLINE BOTにトライしてみたくなりました。
季節の変わりめ、いつも困るのが子供の服装です。
子供は大人より体温が高いらしく、同じ感覚で服を用意すると
すぐ「あつ～い」と脱がれてしまいます・・・。
挙句の果てに上着を忘れたり、やたら荷物が増えたり。
ということで気温から服装の目安を教えてくれるLine Botを作ってみました。
##作った目的
前回までのLine Botは基本的にオウム返しのみの設定でした。
今回は少しステップアップするためWEBのAPIにつなげることに
挑戦してみました。
##仕様
1⃣明日の気温を教えてくれる
2⃣気温を入れると、子供の服の目安を教えてくれる。
##環境
基本的には[「LINE BOT作ってNowで動かした時のメモ」](https://qiita.com/tettsu__/items/720ff09020582f235485#bot%E3%82%9211%E3%81%AE%E3%83%88%E3%83%BC%E3%8
