obniz×VUI でメリークリスマス (obniz編)

この記事は [Obniz Advent Calendar 2018](https://qiita.com/advent-calendar/2018/obniz) の24日目の記事になります。
以前は埋まってた気がしましたが、ふと見たときに空いてたので投稿させていただきました！

24日ということで、クリスマスに関連する記事を書きます。

また、実は [スマートスピーカー Advent Calendar 2018](https://qiita.com/advent-calendar/2018/smart-speaker) の24日目も担当しておりますため、
「[VUI×obniz でメリークリスマス (VUI編)](https://qiita.com/chibi929/items/02eb694540ec68b13f42)」にて VUI 側を書いています。

## はじめに

### 筆者について

私はハードウェアに疎く、IoT が全然ピンと来ません。
ラズパイや Arduino も触ったことが無い人です。

筆者のスキルはだいたいこんな感じです。

- スマホアプリを作ったことがある (Android/iOS)
- Web フロントエンドを作ったことがある (Angular)
- Web バックエンドを触ったことがある (Node.js: Express で API を作れる程度)
- スマートスピーカースキルを作ったことがある (Google Assistant/Amazon Alexa/LINE Clova)
- Cloud サービスはスマートスピーカースキル開発用にほんの少し触れる程度

このように、ハードウェアからは程遠いです。

そんな人が obniz を買おうと思った決め手は、以下の記事です。
[スマホを最高級電子部品として電子工作に組み込む(加速度編)](https://qiita.com/wicket/items/3c121e45f1d432c368a8)

- 簡単にラジコン作れそう！！
- IoT やってる感ありそう！！

という気持ちだけです。

※ちなみに加速度センサーの部分は触ったことがあるのでなんとなく仕組みはわかってました。
※わからないのはハードウェア絡み！

### obniz について

[obniz](https://obniz.io/) の公式ページを見てみると

> 30秒でブラウザからプログラム
> あなたも今日からIoTエンジニア

なるほど。簡単そう。

> obnizを始めるにはたった3ステップ。
> スマホやPCでプログラムページを開けば、インターネットを経由していとも簡単に
> モーターを動かしたり、UARTで通信したりできます。

なるほど。UART ってなんだ。
未だにわからん。(調べてもない)

> この小さなobniz１台あれば、インターネット（API）経由で
> あらゆる言語・環境から簡単に、ハードウェアプログラムや高度なIoT製品の製作ができます。
> スマートフォンでQRコードをスキャンしたらすぐにプログラムページへ。
> HTMLの中のjavascriptだけですべてプログラムできます。

お。API, HTML, Javascript これならわかるぞ！

そして、何より凄いのは、
公式に色々なサンプルを用意して下さっていること、
どういうパーツを買えば良いかリンクを貼ってくださっていることです。

これなら、よくわからないけど **ポチ** って繋いで **ポチ** れば動く！

## やったこと

- **obniz** をポチる
- **LED** をポチる(抵抗入り、抵抗無し)
- よくわからないけど **抵抗(150Ωくらい)** をポチる
    - [こちら](http://eucalyn.hatenadiary.jp/entry/led_current_limiting_resistor)で事前に勉強
- 名前は知らないけど良く見る穴がいっぱい空いてる奴 **(ブレッドボード)** をポチる
    - みんな持ってるしね！そのうち使うでしょ！なノリで
- **モーター＆タイヤ** をポチる
- こちらも名前も知らなかった導線 **(ジャンパワイヤー)** をポチる
- 使うかわからないけど **はんだごて** もポチっておく
    - はんだごては、学生時代に理科の授業で触ったくらい
- 百均で **LEDイルミネーション** を ~~ポチる~~ 購入
- [Lチカ(抵抗入り)](https://obniz.io/doc/lessons_turning_on_led)
- [Lチカ(抵抗無し)](http://www.kotaden.com/stage1_3_index.html)
    - まさかこんなところでも yanzm さんの記事に助けられるとは。。。
- [モーターを動かす](https://obniz.io/sdk/parts/DCMotor/README.md?iframe=false)

## メリークリスマス

そんなこんなでメリークリスマス :christmas_tree: 

[30秒でIoTを始めよう（obnizハンズオン#2）](https://obniz.connpass.com/event/104519/)
上記のイベントに参加して、百均の電飾を光らせるためにはどうすれば良いかを聞いてみました。
何もわからず聞いたので、質問の仕方もわからなくてごめんなさい。。。

電池2本(=3V)で動くから、obniz を60%の力(5V * 0.6 = 3V)で動かせばよい。
一番簡単なのは [DCMotor](https://obniz.io/sdk/parts/DCMotor/README.md) を代用して [power](https://obniz.io/sdk/parts/DCMotor/README.md#power-float-) を使って `60` くらいを設定すること。
というアドバイスをいただきました。ありがとうございます！

### アドバイスの通りにやってみた

<blockquote class="twitter-tweet" data-lang="ja"><p lang="en" dir="ltr">Advent Calendar 用 <a href="https://t.co/CUm6YQ7BPZ">pic.twitter.com/CUm6YQ7BPZ</a></p>&mdash; ちび (@ibihc929) <a href="https://twitter.com/ibihc929/status/1076891831856640000?ref_src=twsrc%5Etfw">2018年12月23日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


### 出来たもの

<blockquote class="twitter-tweet" data-lang="ja"><p lang="en" dir="ltr">Advent Calendar 用 <a href="https://t.co/SOXMlGZBCU">pic.twitter.com/SOXMlGZBCU</a></p>&mdash; ちび (@ibihc929) <a href="https://twitter.com/ibihc929/status/1076892322900529152?ref_src=twsrc%5Etfw">2018年12月23日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

あとは、obniz と 百均イルミネーションをクリスマスツリーに巻き付けるだけです。
※クリスマスツリーを使った動画もあるのですが、人が映っているのでデモ動画で。。。

### システム構成

<img src="https://qiita-image-store.s3.amazonaws.com/0/53393/97b996f3-4eaf-da93-6053-001ef0f51467.png" width="768" alt="システム構成図"/ width>

### ソースコード

```ts
import * as Obniz from 'obniz';
import * as express from 'express';
const app = express();

app.get('/on', (req, res) => {
  const obniz = new Obniz(process.env.OBNIZ_ID);
  obniz.onconnect = async () => {
    const led = obniz.wired('DCMotor', { forward: 0, back: 1 });

    // LED が爆発しても怖いのですごく弱めに設定
    // ちなみに 9 だと光らなかった
    led.power(10);

    // PIKA PIKA インターバル
    let on = true;
    setInterval(() => {
      on = !on;
      on ? led.move(true) : led.stop();
    }, 100);
    led.move(true)
  };
  res.send('ON!');
});

app.listen(process.env.PORT || 3000, () => {
  console.log('Example app listening on port 3000!');
});
```

※エラー処理は一切しておりません。
※本サンプルコードには「ストップ」の処理は入っていません。

## おまけ

<img src="https://qiita-image-store.s3.amazonaws.com/0/53393/624089d0-8512-b902-e169-6fad7736864b.jpeg" width="320" alt="" />
↓

百均で買ったこの子をとりあえず引っこ抜いて、
ジャンパワイヤーとくっ付けてみた。

↓
<img src="https://qiita-image-store.s3.amazonaws.com/0/53393/74042f29-dc36-7d41-8e5e-30b6f4a53e7b.jpeg" width="320" alt="" />
↓

ダサイ！ダサすぎる！

あまりにダサいので、
ジャンパワイヤーの先っちょだけ引っこ抜いて、
先っちょだけくっ付けてみた。

↓
<img src="https://qiita-image-store.s3.amazonaws.com/0/53393/92808518-32a4-5fc5-8038-5e07152da04e.jpeg" width="320" alt="" />
↓

カッコよくなった！！

##　最後に

**ポチ** って繋いで **ポチ** れば、簡単に動かすことができた！