chirimen-hands-on/README.md
2022-10-09 09:20:29 +09:00

278 lines
6.4 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

---
title: CHIRIMEN ハンズオン
marp: true
paginate: true
style: |
section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
---
# 1 日目
---
![bg](https://webiotmakers.github.io/static/images/2022/template/ogp.jpg)
---
# CHIRIMEN ハンズオン
2022-10-08/2022-10-09 in 岡山
WebDINO Japan シニアエンジニア
[渡邉浩平](https://github.com/kou029w)
![w:200](https://github.com/kou029w.png)
---
## CHIRIMEN とは
![h:480](https://res.cloudinary.com/chirimen/image/fetch/c_limit,f_auto,q_auto,w_1200/https://tutorial.chirimen.org/raspi/imgs/section0/CHIRIMENforRaspberryPi3.png)
Web ブラウザーからハードウェアを制御するプロトタイピング環境
センサーやモーターなど組み合わせたさまざまなものをつくることができます
---
## 作品例
![h:550](./assets/webiotmakers-gallery.dio.png)
<!-- _footer: 画像の引用元: Web×IoT メイカーズチャレンジ 作品ギャラリー https://webiotmakers.github.io/gallery/ -->
---
## 本日の流れ
準備編 (11:20-12:00)
- セットアップ
基礎編 (13:00-17:00)
- L チカしてみよう
- GitHub アカウントの登録
- GPIO に関する基礎知識
- I2C に関する基礎知識
---
## 本日のゴール
基礎編
- センサーやモーターの基本的な使い方を理解する
---
## Slack にアクセス (まだの方)
[webiotmakerschallenge.slack.com](https://webiotmakerschallenge.slack.com)
---
## ハンズオン資料
[tutorial.chirimen.org/raspi](https://tutorial.chirimen.org/raspi/)
または
「chirimen チュートリアル」で検索
---
## 困ったとき・分からないとき・気になることがあるとき
会場のスタッフにお気軽にお声がけください 🖐
(Slack でも OK 👌)
---
## 機材の確認
必要なもの
- クリアボックス
- ディスプレイ/HDMI ケーブル/変換アダプター/AC アダプター (Type-C)
- AC アダプター付き電源タップ/Type-C ケーブル
- Raspberry Pi 本体/ヒートシンク
- 有線マウス
- キーボード
- CHIRIMEN スターターキット
- microSD カード
(必要なもの以外はクリアボックスに片付けておきましょう)
<!-- _footer: https://tutorial.chirimen.org/raspi/section0#section-1 -->
---
## ヒートシンクの取り付け
> ![](https://www.okdo.com/wp-content/uploads/2019/10/1-mount-heatsinks.jpg)
<!-- _footer: 画像の引用元: Get started with your OKdo Pi Kit in a flash - OKdo https://www.okdo.com/getstarted/ -->
---
## Raspberry Pi の起動
![h:600](./assets/setup-raspi.jpg)
<!-- _footer: https://tutorial.chirimen.org/raspi/section0#chirimen-for-raspberry-pi--1 -->
---
## Wi-Fi の設定
Raspberry Pi の起動後、画面右上のパネルをクリックして設定を行います
![](./assets/setup-wifi.png)
(接続情報は会場で確認しましょう)
<!-- _footer: https://tutorial.chirimen.org/raspi/section0#wifi- -->
---
## ブレッドボードでの配線
![h:600](./assets/led-blink.dio.png)
<!-- _footer: https://tutorial.chirimen.org/raspi/section0#section-7 -->
---
## サンプルコードの実行
ブラウザー > Examples > GPIO Examples > GPIO-Blink > CSB (CodeSandbox)
![h:480](./assets/link-to-led-blink-csb.jpg)
<!-- _footer: CHIRIMEN Examples https://chirimen.org/chirimen/gc/top/examples/ -->
---
## ここまでのまとめ
- CHIRIMEN for Raspberry Pi の起動
- LED を制御するサンプルコード (通称 LED チカチカ、L チカ) の実行
---
## GitHub アカウントの登録
---
## GitHub アカウントの登録
[GitHub > Sign up](https://github.com/signup) からアカウントを作成します
アカウントに必要な項目を入力します
![h:480](./assets/signup-github.png)
---
## GitHub アカウントの登録
![h:480](./assets/signup-github-verify.png)
<!-- _footer: Join GitHub https://github.com/signup -->
---
## GitHub アカウントの登録
入力したメールアドレスに登録用のメールが届くので確認します
![h:480](./assets/signup-github-verify-code.png)
<!-- _footer: Join GitHub https://github.com/signup -->
---
## GitHub アカウントの登録
次のような画面になれば OK
![h:480](./assets/github.png)
<!-- _footer: GitHub https://github.com/ -->
---
## CodeSandbox の使い方
- [CodeSandbox の基本的な使い方](https://csb-jp.github.io/docs/usage)
---
## 後付
---
## その他
- [デバッグ・トラブルシューティング](https://tutorial.chirimen.org/raspi/debug)
- [Tips・テクニック](https://tutorial.chirimen.org/raspi/tips)
- [良くある質問と回答](https://tutorial.chirimen.org/raspi/faq)
---
# 2 日目
---
## いろいろなデバイスを触ってみよう
自分の席に着き次第、自由に進めてもらって OK 👌
---
## 本日の流れ
ハンズオン講習会
- 10:00-10:10 はじめに
- 11:30-12:00 片付け
アイディアワークショップ
- 13:00-13:30 インプットトーク
- 13:30-16:00 各チームの作戦会議
- 16:00-16:20 各チームの進捗共有
- 16:30-17:00 ハッカソンの説明など
---
## ハッカソンのポイント
- ときめくような素敵なアイディア
- 審査本番に作品が機能すること
<!-- NOTE: 昨日・今日と技術的な話を中心にやってきましたが、極端な話ハッカソンの本番は、技術的に優れているかどうかは一旦忘れてもらってOK、コピペでOK、人の真似でOK
ですが限られた時間しかないので、これからの時間で、やりたいことを周りのスタッフに相談したり、Slackで相談してみてください
-->
![bg w:800 right:48%](./assets/webiotmakers-gallery.dio.png)
<!-- _footer: 画像の引用元: Web×IoT メイカーズチャレンジ 作品ギャラリー https://webiotmakers.github.io/gallery/ -->
---
## ⚠ 片付け注意事項
1. 借りたセンサーをすべて返却します
1. Raspberry Pi の電源を切ります
1. microSD カードは必ず抜き取り、CHIRIMEN スターターキットを片付けます
1. クリアボックスを片付けます
- できるだけ元の状態に戻してください
(詳しくは会場のスタッフが案内します)
---
## ハッカソンに向けて
リードタイムに注意 特に海外からの発送は時間がかかるので余裕を持って
品薄なものもあるので早めに調達を
https://gist.github.com/elie-j/8a27e7a65a40371e0cda5754ce0a063d