今日より場所をカリフォルニアからシアトルに移し、シアトルの Community College 下見の振り返りを行う。

Keep

• 早朝発のサンフランシスコ -> シアトル便に乗るということで綿密に計画を立て、ぴったり計画通りに空港に到着し、Webチェックインで事前にチェックインも済ませていたのでスムーズに移動することができた。ガソリンをあらかじめ買取り、スタンドで給油しなくても良いプランにしていたのも、時間をロスすることなく、大きかった。
• 移動には Delta を使ったのだが、機内では Facebook メッセンジャーなどのテキストメッセージのみは許される WiFi が使えたり、ボーディング中は、アプリ上で今どのクラスの人が呼ばれているのかがわかるなど、ユーザビリティがめちゃめちゃ良かった。
• シアトルでは、Shoreline Community College を見学した。我々が日本人であるということで、キャンパスツアーの案内役の学生さんには日本人の方がアサインされていて、日本語で懇切丁寧に案内していただいた。今までの Community College のキャンパスツアーでは、ネイティブの学生が、容赦ない早口の英語で（アメリカには早口でハキハキ喋ることが賢さを示すという僕が思うに誤った考えがあるようだ）説明していたので、それらに比べて段違いのきめ細やかさを感じた。聞くと、入学希望者が中国人であれば中国人の学生が、香港の人であれば香港の学生がそれぞれ案内役にアサインされるとのことだった。
• シアトルでも滞在先を Airbnb をしたのだが、オーナーの娘さんは日本で働いているという中国人の方で、さらに様々な Community College で中国語を教えていたということで、息子のことを全面的に応援してくれて、ここもここも訪れた方が良いと訪問の計画を一緒に考えてくれたり、行ってはいけない治安の悪い場所なども教えてくれて、とても助かった。Airbnb はカリフォルニアもシアトルも大当たりだ。

Problem

• 今思い出しても腹が立つのだが、シアトルでもカリフォルニアの時同様、Hertz のレンタカーを借りたのだが、入る保険のことでトラブった。あらかじめアメリカでレンタカーを借りるときに入る保険メモなどの記事を読んでいて、強制保険以外のオブションとしては（LDW はすでに Included になっている）LIS（追加自動車損害賠償保険）だけで十分と思ってそれだけを選んでいたはずなのに、外れの窓口を引いてしまって、PAIやロードアシスタントサービスなども付けてくる上に、いやこれらは選んだ覚えがないので外してくれと主張したら、州のLAWで決められているので外せないなどと言ってきた。僕もそこまで自信がなかったので一旦は認めてしまったことにも腹が立つのだが、一旦は引き下がったあと、ググったりして、やはりこれらはオプションであることを確認してもう一度窓口に並んだ。これらはLAWで決められているはずはない、特にロードアシスタントサービスに至っては、JAFでAAAのサービスが受けられるのを知っていると言っている間も、「No（JAFでAAAのサービスを受けられない）」などと言い続けていたが、しぶしぶ外させることに成功した。やり取りを録音でもしておけばもっと良かったのだが、絶対クレームのフォームで報告する。まあ、典型的なアメリカあるあるではある。

カリフォルニアのCommunity College巡り、最終日である4日目の振り返りです。

Keep

• Webなどでインプットしていた事前の情報と、実際に現地の Community College を訪れて得た印象にはかなり違いがあることを実感した。実際に現地を見ることがいかに大事かを痛感。
• 夜には、サンフランシスコで働く、僕が社会人になって最初に入った会社の同期を訪ねる。彼はWeWorkで働いていて、WeWork内を案内してくれて、長男にはシリコンバレースタートアップの雰囲気が伝わったように思う。
• WeWorkのあと、「インポッシブルバーガー食べに行こう！」という流れになりご馳走になった。味はまあ微妙に違うのだが、肉とほぼ変わらない食感に親子でびっくりした。
• 同期の友人は、ベンチャーキャピタルの世界を、懇切丁寧にすごい熱量とともに長男に説明してくれて、シリコンバレーの風を届けてくれた。長男も僕も「やるぞ！」という気になる。
• 午前は特に予定が入っていなかったので、長男が生まれ僕らが2000 - 2004年の間住んでいた近辺の Walnut Creek ダウンタウンを訪れた。ここには今や Apple Store や Amazon Books、おしゃれなお店が並んでいて、古き良きアメリカの田舎町から、近未来のピカピカな田舎町に豹変していた。

Problem

• WeWork で待ち合わせということで、Embarcadero Center の駐車場に車を停めて Google Maps が指し示す WeWork があるらしきビルを訪れたところセキュリティに止められる。WeWork にいるはずの友人の許可がないと入ることが許されないということで、電話して取り次いでもらったのだが、なんとビル違いであることがわかる。調べてみたら WeWork ってサンフランシスコ 市内に10ヶ所近く、Embarcadero Center の周りだけでも2ヶ所もあって、違う方の WeWork を訪れていた。完全に Google Maps に頼らずちゃんと住所まで確認しないとダメだ。
• airbnb のステイ先に帰ってきたら、パスポートなど大事なものを入れていたリュックが手元にないことに気づき、今回の滞在中一番に焦る。翌日早朝にはシアトルに移動する必要があって、ちょうど落合陽一のブログ、「サンフランシスコでUberの中に携帯忘れて，ただっぴろい公園の真ん中で一人きり，携帯もクレカもホテルの鍵もない．さぁどうする． / #日々短文雑記」を読んだばかりで同じようなことが自分に起こったらどうしようなんて思っていたものだから、変な汗が出た。結局オチとしては、駐車した車に単に置き忘れただけだったのだが、昔の同期と異国の地で会い、楽しくて浮かれてリュックを持って帰って来たはっきりとした記憶があいまいだったから、インポッシブルバーガーのお店に置き忘れたのではないかと思ってしまっていたのだった。

カリフォルニア滞在3日目の振り返り。今日はシリコンバレー近くの Foothill College、De Anza College を見学したあと、Apple の円盤型新社屋を見て、Intel Museum 訪問。

Keep（良かったこと）

• いつもサンフランシスコに来たときに会っている元同僚のロシア人と晩飯を食べに行く。まだまだ英語が拙い長男に一生懸命に話しかけてくれ、ここでは誰も間違いなんか気にしないからどんどん話したほうがいいなどのアドバイスで勇気づけてくれる。一緒に働いていたときに、Open Source の素晴らしさ、面白さを僕に教えてくれて人生を変えてくれた恩人の彼に、またまた借りができた。

• Apple 新社屋はまさに円盤だった。AR の展示が秀逸。

• 各 College でのガイドがとても親切。そして De Anza ではスクールカウンセラーの方につないでくれて、入学の手続きを丁寧に教えてくれる。わからないことがあればいつでもメールしてくれていいよと言ってくれて、当たり前だが、やはりオンラインでやり取りするよりも直接出向いて会ったほうが話が早い。

Problem（反省点）

• 謙遜はこちらでは自信のなさと見られるという指摘を子にしたのだけれど、子は親の鏡と言う通り、これは僕の言動が大きな影響を与えているのだろうなと思いハッとする。礼儀としての謙遜は良いが、知らず知らずのうちに保険をかけるための逃げの謙遜が多くなっているんではと思い反省する。

昨日の続き。長男がアメリカ留学を考えているということで下見に来ている。2年制のコミュニティカレッジから4年制の大学へのTransferを考えている。

今日は、午前Berkley City Collegeを学生さんがガイドしてくれたあと、午後はアメリカで働いていたときの韓国人の元同僚の娘さん（UC Berkeley で Computer Science を専攻している才女）にキャンパスを案内してもらった。

Keep

• 昨年夏から、Reading、Writing 主体の日本型英語教育からTOEFL準備のためにDMM英会話などでSpeaking、Listeningを少しずつ強化している最中の息子に、容赦のないネイティブEnglishのシャワー。たぶん相当応えたんじゃなかろうか。一発目ではほとんど聞き取れないので何度も聞き直し、言いたいことを半分も伝えられなくて、自分が幼稚園児になってしまったような辛い感覚良くわかるぞ！でも大丈夫、おまえの父は大学四年でカナダに卒業旅行に行ったときにろくにステーキさえちゃんと頼めなかったくらいだったから、それよりだいぶましだ。それでも今はそこそこ聞き取れ話せるようになったのだから、これからたくさん恥をかいて俺の英語の間違いを指摘するくらいになってくれという気持ちになった。
• アメリカで働いていたときに使っていた銀行のオンラインバンキングのアカウントが日本にいた時に久々アクセスしたらサスペンドされていたので、こちらの支店でアカウントマネージャーに何とかしてって頼んだら凄いスムーズに復活してくれた。これ、電話ごしにやるとだいたいたらい回しの連続に合って凄いストレス溜まるやつだったので、めちゃめちゃホッとした。銀行口座の問題は支店に直接出向いて解決するに限る。幌馬車がロゴの歴史ある銀行で、西部劇に出てくるような趣きある建物で、アカウントマネージャーと対面、「Sir」とか呼ばれちゃうから気分も良いしね。
• レンタカーのスピーカーにBluetooth接続でスマホを接続できることを発見。ハイウェイ飛ばしながら（といってもだいたいいつも5車線くらいある中で一番右をキープの安全運転）、長男が好きな King Gnu の最新アルバムをストリーミングでかけちゃって、いやあ便利な時代になったもんだ。20年前君がこの地で産まれた頃にはNapsterってのがあってだなあ、日本で流行っている楽曲のmp3ファイルを長いことかけてダウンロードしてきてせっせとDVDに焼いていたんだよ、と昔話を聞かせてあげた。

Problem

• 運転のカンも戻ってきたよ。でもたまにウィンカーの代わりにワイパー動いちゃったり、駐車場のチケットを取るときに誰も座っていない後部座席の窓が開いちゃったりする。あと、しばらく無灯火て走っていて、横断歩道渡っている歩行者に指摘されたのはナイショだ。
• 銀行の建物が荘厳で、かっこいいなと思って支店内でスマホで写真をパシャリと撮ったら、ガードマンが駆け寄ってきて「何やってんだ！すぐ消せ！Sir！」と怒られてしまった。

実は長男がアメリカの大学で学びたいと言うので、その下見の付き添いで昨日からカリフォルニアに来ています。第1日目の振り返り。

Problem

• PC を忘れてしまった。直前まで充電していてかばんに入れ忘れたの致命的。
• 久々左ハンドルの車の運転で余裕がなく最初苛ついてしまった。

Keep

• PCを忘れたにも関わらず、全ての情報がクラウドにあるためスマホだけで何とかなる。また長男が持ってきたお下がりのPCでPRのマージまでできたので、ちょっとした仕事も何とかなる。
• ランチのメキシカンも晩ごはんのフォーも選択が良くまあまあのおいしさ。
• airbnb で借りた宿が完全に自宅の一室という感じでまるでホームステイ。長男がもしホームステイとなるときの良い予行演習となりそう。飼い犬に不審者ではないよと教えるために匂いを覚えてもらう儀式がいるのだけど、その後は僕らにはフレンドリーになるのが賢い。
• レンタカーを事前にウェブで予約していたら、手続きがスムーズだった。
• サンフランシスコ市内散策で、だいぶ疲れたけど、歩きまくったので時差ボケ防止になった。

福井工業大学で開催されましたロボ・キャンプ 2019でML2ScratchとEV3を使った

» 機械学習×ScratchでAI(人工知能)アプリケーションを作ってみよう！

というワークショップを開催してきたので振り返ってみます。

Keep (今後も続けていきたいこと)

• ワークショップ後の振り返りというのを初めてやってみたのですが、 言葉わからない外国人とも気持ちで通じるけど、ロボットにはナカナカ伝わらなくて難しかった など、ユニークな意見が多く、とても良かった。これは次回からも続けていこうと思う。

• 参加者が保護者の方含め40人規模になると聞いて、最初は1人で行こうとしていたのを、CoderDojo調布のEV3エキスパート北原さんにお願いして一緒に企画、運営することにしました。東京にいる間に事前に打ち合わせを行い計画を練ることができましたし（1人ならやらない）、ワークショップ自体かなりスムーズに進めることができたのは、本当に北原さんのおかげでした。トラブル対処のときも心強かったですし、最初1人で行こうとしていたのは無謀でした。次回こういう企画のときは、2人以上体制にする。

• PCの問題や、ML2Scratch自体の問題でトラブルことがほぼなかった。用意していただいたPCの性能が良かったのと、いろんな場面でML2Scratchを使ってきた上での今までの改善のたまもの。

• 保護者の方々と一緒になって楽しそうに作品創りに取り組んでいたのが印象的でした。干渉し過ぎないようにということで、こどもと保護者をあえて離すという場合もあるのですが、保護者と一緒に参加という今回のケースも、これはこれでありだなと感じました。

• 組み立て済みのEV3を使うため、作品の幅がせまくなってしまうかなあ、と心配していたのだが、杞憂でした。距離センサーを使わず、機械学習で障害物を認識して止まるロボットカーや、ジャスチャーと物体認識を組み合わせてコントロールする例など、作品の幅は広かった。

• スペースが十分に広いというのと、明かりが一定で白基調の部屋というのもあったと思うのですが、カメラを上向きにして天井が背景になるようにするなどの工夫もそれぞれおこなっていて、認識の精度がこれまでよりも高いなと感じました。6つ7つのラベルの判別もうまく動いているケースもあって驚きました。

Problem(反省点)

• 会場の無線LANが帯域的に十分でなく、ScratchもML2Scratchを利用できるようにした改造版Scratchもロードするのに時間がかかっていました。ワークショップ中には、これが問題になることはなかったのですが、バックアップとして、自前のWiFiルーターを持ち込んでおけば良かった。

• ワークショップ前に準備しておくこととして、EV3を指定の形に組んでおくこと、Scratch Link をインストールしておくことなどをお願いしていたのですが、Chromeをインストールしておくことなどの僕が見逃していたところがいくつかあり、ワークショップ直前に慌ただしく準備することになってしまった。ML2Scratch + EV3 は初めての挑戦だったため、事前準備でやっておくこともなかなか定まらず、1回のお願いで済まず、追加のお願いのやり取りが発生してしまったのもまずかった。次にEV3を使ったワークショップをおこなうときには同じ失敗をしないように修正版の事前準備リストを残しておきます。

- Chrome をインストールしておき、デフォルトのブラウザとして設定しておく。
- Scratch Link をインストールしておく。
- EV3組み立てマニュアルの40まで組み立てておく。
- EV3 のファームウェアを V1.10Eにあげる(Scratch EV3エクステンションがV1.10E以上しかサポートしていないため)
- 各EV3の区別がつくようにBRICK NAMEを変更しておく。(ファームウェアをアップデートするとBRICK NAMEが元に戻ってしまうので、順番が前後しないようにする)
- BRICK NAMEをテプラで貼っておく。
- [ML2Scratchを利用できるScratch](https://champierre.github.io/scratch3/)を開き、ショートカットをデスクトップに作成しておく。

• PCを操作しながらマイクでしゃべるのが大変。Afrel のスタッフの方が気をきかせてくれてマイクを持ってくれましたが、これって皆さんはどうやって対処しているのだろう？ワイヤレスマイクといった機器で解決しているのだろうか？

Try (今後ためしてみたいこと)

• そういえば、参加者の振り返りはおこないましたが、運営側の振り返りはおこないませんでした。ワークショップ中「『学習データをリセットする』ブロックを誤って『ずっと』ブロックの中に入れて実行してしまったら、ブラウザがスタックしてしまった」というフィードバックをいただいて、さっそく修正したのだけれど、他のフィードバックもAfrelのスタッフ、福井工業大学の学生の皆さんからも拾うべきでした。次回からは運営側の振り返りを行いたい。

主催のAfrelのスタッフの皆様にはとても良くしていただきましたし、会場の準備、PCのセットアップ、EV3の事前の組み立てなど環境作りが完璧で、おかげさまでワークショップが滞りなく行えたと思います。福井工業大学の学生の皆さんにも、困っている参加者がいたら積極的に助けてくださり、とても助かりました。ありがとうございました。

前日の懇親会での越前蟹おいしかった〜↓

今回、名古屋で開催された DojoCon と日にちがバッティングしてしまって、弾丸出張となってしまい、福井の観光地など満喫できず心残りでしたが、また次の機会の楽しみに残しておくこととします。

昨年から香港、シンガポール、台湾とアジア各国の Maker イベントにいくつか参加しているのですが、今回は上海。

» Maker Carnival Shanghai 2019

に出展してきました。

メインスポンサーで STEM 関連ハードウェアなどを作っている DFRobot の Rachel さんが Maker Faire Tokyo を訪れた際に誘われて出展することにしました。

ML2Scratch を出展しました

機械学習と Scratch とをつなげる ML2Scratch をデモするのですが、今回はこの ML2Scratch を使ってゴミを自動で認識して分別するAIゴミ箱を作ってくれた小川さんの娘さん、桃佳さんの作品と一緒に出展することにしました。

まちクエストも一緒にやっている小川さんのレポートはこちら↓

» Maker Carnival Shanghai 2019 で出展してきたよ（娘が）

小川さん親娘は残念ながら途中で帰国することになったのですが、帰国の理由が、このAIゴミ箱が351作品中最終10作品に残り、JJPC全国小中学生プログラミング大会の最終審査会に出なくてはいけなくなったから。残念ながら、グランプリは取れなかったようですが、アイデア、実装力ともに素晴らしくこちらの記事でも取り上げられています。

» 小学生が作った「未来のゴミ箱」は自律走行＆機械学習でゴミ分別　IoTセンサーで外の環境を検知！JJPC 全国小中学生プログラミング大会レポート

さて Maker Carnival ですが、会場はこんなところ。三国志なんかに出てきそうなお城っぽい門をくぐると、スタジアムになっており、ここにテントを張って出展するのです。なんともスケールがでかい、テンションが上がります。

ML2Scratch と Microbit 拡張をさらに拡張した @yokobond さんが開発された Microbit More を使った作例のコイン選別AIロボットを、制作されたネコリンピックのネコマ製作所さんから許可をいただき、再現して展示しました。

作りかたはこちら↓

» Scratchとmicro:bitでコイン選別AIロボットを作る

香港、シンガポール、台湾では英語での説明でほとんど通じていたのですが、今回上海では英語でOKの場合とそうでない場合とで半々くらいでした。「英語は話せますか？」と聞くと、自分の子どもを指して「この子はわかるので、この子に話しかけてくれ」と言われることが何度かありました。お店などでは中国語しか通じないことが多く、録りためているNHKテレビ中国語を使って中国語勉強しないと、と思いました。

Maqueen を Scratch からプログラミングできる Scratch2Maqueen

上海滞在中、ホテルのアレンジや会場でのお世話などなど、DFRobot のスタッフの方々にはとても良くしてもらいました。何か DFRobot のために貢献したいなと思って、深夜までかかってホテルで作ったのがこちら。DFRobot 製の Maqueen を Scratch から動かせるようにした拡張機能、Scratch2Maqueen です。

» Control DFRobot from Scratch - Scratch2Maqueen

Maqueen のようなプログラミングして前後左右に動かせる車両型のロボットはいろいろなものがありますが、ライントレースもでき、超音波センサまでついて高機能、安定性もあって、ここまで安価なものは他にはあまりないと思うのですが、残念ながら Scratch から動かすことができません。そこで、 Microbit More を使いながらうまく改造して、拡張機能として Scratch からコントロールできるようにしてみました。ML2Scratch と組み合わせて機械学習を使ってジェスチャーで操作するなんてことができますし、本来の Scratch でできることとうまく組み合わせて、できることの幅が広がるかと思います。

日本からの Maker の方々

お隣は AI Trash(AI ゴミ箱)。乾電池か缶、あるいは果物のどれかを Web カメラに見せると、それに応じたミニゴミ箱の蓋が LEGO EV3 で作った機構によって自動的に開きます。

今回、日本の Maker の方々もたくさん参加していて、ステージで楽しい寸劇を披露したり、Overseas（海外勢）の枠で自慢の作品の数々を披露していました。ロボットや盆栽といった日本的な要素をうまく取り入れていて、保安と書かれた腕章をしたちょっとものものしい格好のセキュリティの人たちも観に来ていたりして微笑ましかったです。

反対側のお隣では、わくわくプログラミングの中国語版を並べて、著者の阿部先生自らが売り子になって売っていると、ひっきりなしにサインや写真を求められていました。その阿部先生の日本のプログラミング教育事情を紹介する講演も聞きに行きました。

これからは、勉強が良くできてルールに良く従うA型学生でなく、革新的なアイデアを創造できるX型学生が必要というお話。僕もA型おじさんでなくX型おじさんになれるように精進します。

中国にはX学生が必要だと言っているのが、元清華大学学長で、北京市長の陳吉寧先生。日本だと東工大と東京都知事が旗を振っているようなもの。中国のScratch登録ユーザー数はこの1年で80万人から300万人に増えました(日本は47万人、世界は4700万人)。私の本も中国語版の方が売れているかも。 https://t.co/zMRbUdGkjz

— アベ先生 (CV: 阿部和広) (@abee2) October 27, 2019

滞在中、ずっと行動を共にしていた日本の Maker の方々とも仲良くなれて良かった。休憩中、VRチームのブースにお邪魔して現地のクラフトビールを呑んだり、

夜は、みんなで火鍋を食べにいったり。。QR をスキャンするとスマホでオーダーでき、決済もスマホ決済と現金やクレジットカードはほとんど使いませんでした。

展示の最終日は関係者の方々含めた盛大な懇親会。上海蟹おいしかったです。

上海の印象

2年前に北京トランジットのときに、空気が汚く黄色くかすむ風景の中、空港のセキュリティで息子のモバイルバッテリーが問答無用で没収になったというネガティブな経験があったので、正直上海を訪れるまでは若干の不安がありました。しかし、約一週間滞在してみて、印象はガラッと変わりました。

滞在中、嫌だなあと思ったことは一度もなく、街は清潔ですし、人々のマナー、サービスも良かったです。横入りする人などはいなくて、みんな列に並んでいたと思いますが、こうしたスローガンのおかげなのでしょうか。。「智者は順序を守る」ということなんでしょうか、なかなかにダイレクトです。

クラフトビールのお店に飲みに行った時、おしゃれな感じの屋上でみんなで飲んでいたら、寒いだろうからということでブランケットをお店の方が持ってきてくれていたのが印象的でした。

日本からの Maker グループ内の、Maker Carnival に以前参加したという方に聞くと、2年前とは随分違うとのことだったので、そのあたりは急速に変わっているのかもしれません。

到着した当日、日本からの Maker の方々何人かと観に行った上海中心地の夜景。LED の圧倒的な数、そして各ビルの LED の点滅パターンが同期しており圧巻でした。

帰国前日には、上海の大学や会社、メーカースペースを訪れるツアーをアレンジしていただいたのですが、オフィスの雰囲気、景色はほぼほぼシリコンバレーです。

ツアー中見せてもらった顔認証の自動販売機。現在はまだ、顔の情報を登録している中国人の方に利用は限られているとのことでした。

そして帰国当日、市街地から空港を結ぶリニアモーターカーに乗りました。僕が乗ったのはハズレらしく、時速300kmが上限でしたが、時間帯によっては500km近くまで出るそうです。

街行く自動車やバイクはほぼほぼ電動で、電気自動車ばかりだと、空気がきれいになるのに加え、交差点とが静かになるんだなあ、ということが実感できました。DiDiタクシーで乗った車もフル電気自動車で、信号で止まったときには無音でとても快適でした。

未来都市感があり、今後もさらに発展するのかもと思うと、また来るのが楽しみになりました。ぜひぜひまた訪れてみたいと思いました。

Webシステムを開発していると、ローカルで開発中のサイトに外部からアクセスして確認したいという必要が良くでてきます。スマホ向けのレイアウトを確認したいとき、位置情報を使ったサービスなどの場合は、スマホからhttpsでアクセスして確認する必要があります。（iPhoneのSafariからだとhttpsでないと位置情報へのアクセスが許されないので）

このような場合、今まではngrokという便利ツールを使っていたのだが、無料プランの場合、生成される外部からアクセス可能なアドレスが毎回違ったり、一秒間に許されるアクセスに制限がかかっていたりしてちょっと不便でした。

ngrokに代わってServeroというツールがこれらの欠点がなくて便利だ、という記事をQiitaなどで見かけたのだが、数日前からアクセスできなくなっていました。

そこで、これらに代わるサービスや方法がないかと探していたら、

» Ngrok? You Might Not Need It

などの記事で、何のことはないsshのポートフォワーディングの機能を使えば同等のことが、追加で何かをインストールする必要なくできることを知りました。

ただ、sshのポートフォワーディングだけでは、httpの通信はできるが、httpsの通信を転送できなくて困っていました。いろいろ試行錯誤してみた結果、golang製のCaddyというWebサーバーを使えば簡単にできることがわかったので、その方法を紹介します。

前提

自由にアクセスできるサーバーと独自ドメインを持っていることが前提です。開発者であれば、VPSサーバーの1台や2台、独自ドメインもいくつか持っているんじゃないでしょうか。

もし持っていなければ、Digital Oceanあたりで月額5ドルから借りられます。

ドメインももし持っていなければ、Google Domainsで.devドメインでも取っておきましょう。

sshポートフォワーディング

借りているサーバーにはssh接続できるものとします。

ローカルの3000番ポートで動かしているサービス(http://localhost:3000)に接続したいとして、

ssh -R 3001:localhost:3000 yourdomain.com

をターミナルから実行するだけで、iPhoneなどから

http://yourdomain.com:3001

でアクセスできるようになります。

sshのコマンドの意味は、-Rがリバースプロキシを意味し、次の

3001:localhost:3000

は、続くドメインの3001番ポートに来たアクセスをlocalhost:3000に転送するという意味です。

3000:localhost:3000

とすれば、ポートを合わせることもできるのですが、わかりやすく番号を変えておきました。

これだけでいままでngrokでおこなっていたことができ、しかもアクセス数に制限がなく、またドメインも変わらなくて便利なのですが、https通信をフォワードできないのがいまいちです。

次にcaddyを使ってhttpsを転送する方法を紹介します。

caddyとあわせて使ってhttpsをフォワーディング

借りているサーバーにcaddyをインストールします。

DownloadかLatest releaseのページよりOSにあったビルドをダウンロードしてください。

筆者の場合はUbuntu 64bitなので、caddy_v1.0.3_linux_amd64.tar.gzをダウンロードし、

% mkdir caddy
% cd caddy
% wget https://github.com/caddyserver/caddy/releases/download/v1.0.3/caddy_v1.0.3_linux_amd64.tar.gz
% tar xvf caddy_v1.0.3_linux_amd64.tar.gz

で解凍します。 同じフォルダに以下の内容でCaddyfileを作成します。yourdomain.comには借りているサーバーに向いている自分のドメインに替えてください。

yourdomain.com

proxy / 127.0.0.1:8080 {
  transparent
}

proxy /tunnel 127.0.0.1:8080 {
  transparent
  websocket
}

同じフォルダで、

./caddy

を実行すると、caddyが起動します。caddyは動的に証明書を取得する仕組みがあるため、これだけの設定でhttps接続が可能です。

ブラウザで

https://yourdomain.com

にアクセスしてみましょう。

Caddyfileの設定によると、httpsへのアクセスは8080にプロキシされるのですが、8080には何もサービスがないため、

502 Bad Gateway

と表示されるはずです。

ここで、ローカルマシン上で、

ssh -R 8080:localhost:3000 yourdomain.com

を実行すると、yourdomain.comの8080ポートへのアクセスがlocalhostの3000番にフォワードされるので、

https://yourdomain.com

でlocalhost:3000にアクセスできるようになります。

まとめ

sshポートフォワーディングとcaddyを使い、ngrokやserveoなしでローカルで開発しているサイトに外部からhttpsでアクセスできるようになりました。

途中までは、これどうなんだろう？と思ってたしなかなか読み進めなかったのですが、途中からは展開が加速、一気に読み終わりました。噂に違わず、とても面白かった。いやあ、基礎研究って大事だなあ、と思いました :) （薄い感想ですみません）

読み終わって、何かまた新しいWebサービスとか作りたくなった。Twitterとかマストドン、iPhone の初期の頃に興奮したエンジニアの人にはおすすめ。それ以外の人には、うーむ、この面白さはわかるのだろうか。。

六本木ヒルズでこの夏休み開催されているMIRAI SUMMER CAMPのプログラムのひとつ、「機械学習×スクラッチで、どこにもないアプリを作ろう （ダイジェストプログラム）」を見学してきた。

» 【追加開催！】機械学習×スクラッチで、どこにもないアプリを作ろう （ダイジェストプログラム）

青山学院大学 阿部和広先生によっておこなわれたこのワークショップの第一弾は、実は7月末におこなわれ、好評につき再度開かれるようになったとのことだ。開発したML2Scratchが使用されるということで、そのときに様子を見に行ったのだが、使い勝手がいまいちかつ自分がいつも使っているマシンよりスペックが劣るPCではかなり動作が不安定であることがわかったので、大幅に改良してリベンジで臨むことになった。

結論だけ最初に書くと、ワークショップのタイトル通り、どこにもないアプリをたくさん見ることができたし、機械学習を使ったアプリケーションをこどもたちが（アイデアを出し合うアイデアソンという形ではなく）実際に「手を動かして作る」というワークショップ自体、これまでほとんどおこなわれていない、どこにもないものだったと思う。

アイスブレイクはじゃんけんゲームを作るという内容。グーチョキパーの写真を撮り、それらを高速に切り替え、キーを離した時に表示された手で勝負する。表示する写真に自分の手を使ってはいけないというルールなので、グループ内の他の子にお願いする必要があり、またカメラに慣れるという意味もある。

続いてグーチョキパーを人はどうやって見分けているかという問いかけから、画像を認識するプログラムをScratchでどうやって組むかを考える。Scratchには色を見分けるブロックがあるので、ネコが触れている背景が茶色か白かによって、ステージが野球場なのかバスケのコートなのかを識別することができる。

しかしこの方法だと、別のバスケットボールのコートの背景が追加されると、if文を都度追加しないといけない。いろんな見た目の野球場あるいはコートの画像に対応するには、if文がものすごーく長いプログラムになってしまう。あらゆる画像に対応するにはこの方法だとちょっと無理そうだな、と薄々気づくようになる。

次に「学習ってどういうこと？」についてグループ内で考え、意見をpost itに書き出したあと、発表する。「新しいことを見つける」「情報を覚える」「楽しかったりいやだったりする」など様々な意見が出ていた。

このあと休憩。休憩中は、会場で展示されていたScratchの拡張機能からもプログラミングできるロボットtoioや、 USB接続なしでもScratch3.0からスイッチ制御ができるTFabWorksのカシワニキットをこどもたちは体験していた。

休憩後は、いよいよ機械学習をScratchから利用できるようにしたML2Scratchを使ってオリジナルの機械学習アプリを作る自由制作タイム。

ML2Scratchはウェブカメラで撮った写真数枚をラベル付けすることで、機械がそれを学習および認識するようになり、認識結果を簡単にScratchで利用できるようにしたもの。たとえば、ジャンケンのグーの写真を数枚撮り1とラベル付けし、パーを2、チョキを3とラベル付けすれば、その後に改めてチョキをカメラに見せると3と判定してくれる。

参考にするための機械学習を使ったアプリケーションの実例として、パンの種類を判別して瞬時に会計をおこなえるレジと、キュウリの形や色から等級を自動判別するアプリケーションが紹介された。

紙コップや毛糸、紙皿など様々な素材を利用して、各グループ思い思いの機械学習アプリを作っていく。

右や左という文字、あるいは矢印が描かれた札をカメラに見せることによってキャラクターを操作するゲームや、

お弁当箱に盛られたお米の量を判定するアプリや、お皿に乗せられた素材からおすすめのメニューを表示してくれるもの、

症状に関する質問票をみせることで、風邪かどうかなど診断結果を表示する自動診断アプリ、キャラクターが描かれた紙コップで操作するゲームなどなど、オリジナリティあふれる作品の数々が、最後の発表の時間で披露された。

背景など含めカメラに映ったすべてから機械は学習するので、十数枚の写真をラベル付けするだけで学習ができるとはいっても、一筋縄ではいかないということを実際に手を動かすことで実感できる。

しかし、中には、背景など余計な情報が映り込まないように画用紙で小さなスタジオを用意したり、実際の顔の表情を判別することは少ない学習データでは難しいので、代わりに顔の表情のイラストを使うことで、判別の精度を挙げている例もあった。

最初からついたてなどを用意し、背景を消せばもっと認識率が高くなるよとあらかじめ大人の知恵をさずけることもできるのだろうが、そうしたことに自分たちで気づくということも含め機械学習を理解するということなのであろう。とはいえ、認識率がままならなければ、せっかく作った作品がまともに動かず達成感が薄くなるので、そのあたりの「教えすぎない」さじ加減は難しい。

大げさでなくワークショップのタイトル通り、今までにないユニークな作品ばかりだった。Scratchをある程度触ったことがあるという参加者も何人かいたが、機械学習と組み合わせることでScratchあるいはコンピューターでできることの幅が大きく拡がることを少しでも実感できたのではないだろうか。

というよりかは、こんなアプリケーションがあったら便利だろうなというアイデアを、いままではプログラムできる範囲に一部削ぎ落としていたのが、機械学習を使うことでそれがある程度実装可能になったという言い方の方が正しいかもしれない。

機械学習 x Scratch の可能性を感じたとても楽しいワークショップでした。