2022-09-27
何かを受け取って(入力)、処理して、返す(出力)、コンピューター処理の基本です。

サーバーづくりができると、Webアプリづくりの幅が一気に広がって楽しいです。最新のJavaScript/Denoをウェブサーバーを使って、簡単にサーバーで動くAPIをつくれるツールを作りました。


「wsutil - utility library for webserver」

Webサーバーのためのちょっとしたライブラリ、名付けて「wsutil」を使うと、JSONでやりとりするIPv6対応のAPIサーバーが気軽に書けます。 import { serveAPI } from "https://js.sabae.cc/wsutil.js"; serveAPI("/api", async (param) => { return { response: "OK", param }; }); 例えば、server.js で保存したら、DenoをインストールしたPCで、次のように実行!

deno run -A server.js

ブラウザで http://[::]:8000/api を開いてみると動作確認完了!あとはいろいろいじるだけ。

deno run -A --watch server.js

としておくと、プログラムを編集して保存するたびにサーバーが自動再起動してくれて便利です。 待ち受けるポート番号は、パラメータとして加えることで設定できます。

フロントから呼び出すコードはこんな感じ。 console.log(await (await fetch("/api?test"))).json(); WebSocketやストリーミングなどの機能も加えていきたいと思います。

2022-09-26
恐竜のまち、勝山でプログラミングの楽しさ伝えたプログラミングフェス、今週末は鯖江で開催、めがねフェス

ブラウザ、Chromeでネットにつながらないときに登場するゲームは、Google社によるオープンソース。切り出して、ESモジュール化して動かし、せっかくなのでforkして鯖江のトレードマーク、赤いメガネをかけてもらいました。


「Dino Game」
src on GitHub
シンプルなゲームですが、意外と長いプログラム。ただ、画像や音を変えるだけなら簡単です!壊しても元に戻せるのでじゃんじゃん改造してみましょう!


「offline.js - Chromium Code Search」

ソースコードで気になった altGameMode。何やらアイテムを拾うタイプのゲームになるようなので、チャレンジしてみましたが、画像などがいろいろ足りない様子。自分で改造するしかないようです。


めがねフェス
めがねフェス、Code for FUKUI ブースで展示します!プログラミングや、オープンソースに興味がある方、ぜひどうぞ!

めがねフェスについて詳しく知りたい方は、こちら!
【プレゼントあり】10月1日・2日は3年ぶり開催の「めがねフェス」! 鯖江市めがねミュージアム周辺がめがねづくしになる2日間を徹底解説。|福井の旬な街ネタ&情報ポータル 読みもの ふーぽ

2022-09-25
小中学生プログラミングフェス in 勝山、計4時間、Day1で楽しく学んだプログラミング。Day2も始まる前からやる気十分!

福井高専の元教授、現PCN京都の蘆田さんが執筆してくれた教科書を食い入るように見て、自分で試すこども達!


始まる15分前でこの様子!昨日と違って、何か打ち込んでもシールの報酬はもうないので、完全に自主的。


長いプログラムも果敢に打ち込む!(LOCATE → LC、PRINT → ? と省略できるよ)

楽しいきっかけ

ちょっと続く軽い報酬

自分自身で楽しむことを学ぶことを覚える

この二日間、短時間での成長ぶりがスゴイ!


自動運転の要はセンサー、今回使用するロボットとRadishに付いている距離センサーの解説 by まったさん


距離センサーが返す値を観測してみましょう。(IchigoDyhook + IchigoDake に加えて、DVDがあると観測できます)

距離センサーを使って、遠い時はLEDを光らせる、近づいたらLEDを消すプログラム

10 A=ANA(2) 20 IF A<500 LED 1 30 IF A>500 LED 0 40 GOTO 10


制御する対象をLEDから、OUT命令を通じてモーターを動かすように変えるだけ

10 A=ANA(2) 20 IF A<500 OUT 33 30 IF A>500 OUT 0 40 GOTO 10

自動運転プログラムの基本、できあがり!

自分のプログラムで動く自動車「Radish」のデモ&乗車案内 with さくらいと

ちゃんと止まるかな?


みんなでわしゃわしゃプログラミングしている様子がステキ!

困ったら、大人と一緒に考えよう!





ロボットで試して、いざRadishに乗車!さくらいと、勝山高校生がサポート!


楽しかったプログラミング、チャレンジの場、福井県で開催する「越前がにロボコン」や、「PCNこどもプロコン」をチェックしよう


やればやるほど上達するプログラミング!おうちのパソコン + Switchのコントローラー「Joy-Con」でもスティックやリングコンを使ってセンサーと制御の実験ができるようにしましたよ!

10 ?ANA(0),ANA(2):CONT RUN

Joy-ConをBluetoothでパソコンに接続して、IchigoJam web 画面の下、JoyCon「接続」ボタンを押して、やってみよう!
(参考、WebHID APIを使ってJoy-ConとChromeを簡単コネクト - Qiita

プログラミング体験後は、恐竜博物館の探検。

恐竜博物館による衝撃の恐竜の定義。恐竜は現代にもいるんですね!


恐竜の全身骨格、44体!(ほんとに全部恐竜だったかな?)


こどもプログラミングを研究している福井大学の小林さんと!


いただいたIchigoJamのキャラクターが刺繍された缶バッジ、めがねフェスCode for FUKUIブースでの特典にします!


プログラミングフェス2022 in 勝山


おつかれさまでした!

links
- 2016年 100人のこどもプログラマー誕生!福井県小中学生プログラミングフェス2016
- 2017年 怠け者のお坊さんに代わってプログラミングで鐘をつこう動画 - 福井県小中学生プログラミング・フェス2017
- 2018年 in 鯖江 急がば回れ、キーボードの基本をしっかり押さえて自動運転プログラミングへ! 小中学生プログラミングフェスDay1 / 子供100人ロボプログラミング、カムロボでテストし、自動運転車モッティ改に自ら搭乗! 小中学生プログラミングフェスDay2
- 2019年 in 永平寺町 夏、プログラミングフェスDay1! VRで実寸で思い出せる360度写真&アプリ
- 2022年mini ロボットプログラミングを追体験するVRアプリ、福井新聞小中学生プログラミングフェス2022mini
- 2022年 in 勝山 こども100人プログラミングフェス in 勝山、リングコン操作かわくだりゲームを作ろう!
- 福井県小中学生 プログラミング・フェス 2022

2022-09-24
2016年から福井県で開催されている「小中学生プログラミングフェス」、mini開催も含めて6回目。今回は勝山市にて2日連続開催、100人に楽しいプログラミング体験!


Day1にプログラミングの基本を押さえて、Day2でプログラマブルなこども自動車Radishに乗る企画!


第一部は、エルチカとかわくだりゲームまで、基本を押さえる1時間ちょっと。 プログラミングやったことある率は100%!IchigoJam触ったことあるコも半分ほど!分かっているコはお隣のコをサポートをお願いしつつ、みんなで楽しむプログラミング!


第二部は、Tシャツ、缶バッジづくりとプログラミング自習の時間。


IchigoJamの絵文字がかわいい布製缶バッジに!


繊維のまち、勝山。その場で体験するTシャツへのシルクスクリーン印刷!


お持ち帰りしてもらうIchigoDakeは、石川県の会社、IO-DATA製のIchigoDyhook(いちごだいふく)に差し込むタイプのIchigoJam。IchigoJamミニゲームズを立て掛けて使ってくれてた!(続編、IchigoJamミニゲームズ2もあるよ!)


ミニゲームを打ち込んだらシール、全部揃ったらIchigoJamシールをプレゼント!


IchigoJamを祝う会さんからのいただいた、200コ限定、メガネジャムも載ってる、歴代IchigoJamのマスキングテープ!こちら「こうそくタイピングゲーム」で記録5秒(後にサービスで10秒)を出した人にプレゼント企画、盛り上がりました!なんと、15名ほどのこどもが達成!


休憩時間、みんなで作ったかわくだりゲーム、操作するコード、1行変えて、Switchのリングコンをつなぐだけで全く違う楽しさになりますね!

36 X=X-BTN(LEFT)+BTN(RIGHT)

LEFT(=28)でXを1引く、RIGHT(=29)でXを1足すのプログラムを

36 X=ANA()/32

0から1023で返ってくるアナログ入力(ANA)の値の1/32に変えるだけ!


Switchのコントローラーは、なんとパソコンでも使えるんです!

JoyConをBluetoothで接続、IchigoJam web をChromeで開いて、JoyCon接続、リングコンにつないで、RingCon接続、これで準備完了! ANA() で、押し込み&引っ張り具合が取得できます。(Google社のエンジニア @tomayac さんと一緒に作っている joy-con-webhid を使ってバージョンアップ!)


リングフィットアドベンチャー、リングコンを持っている人、ぜひ遊んでみてね!


第三部はロボットプログラミング!タミヤ製カムロボのIchigoJam用改造版を使って、Day2に乗る自動車Radishの練習!


IchigoDyhookでプログラミングして、カムラボに接続!


描いてもらった、Radishに乗った勝山市のキャラクター、TSUKURYU(つくりゅう)くんTシャツで行きますよ!

Day2へつづく

links
- 2016年 100人のこどもプログラマー誕生!福井県小中学生プログラミングフェス2016
- 2017年 怠け者のお坊さんに代わってプログラミングで鐘をつこう動画 - 福井県小中学生プログラミング・フェス2017
- 2018年 in 鯖江 急がば回れ、キーボードの基本をしっかり押さえて自動運転プログラミングへ! 小中学生プログラミングフェスDay1 / 子供100人ロボプログラミング、カムロボでテストし、自動運転車モッティ改に自ら搭乗! 小中学生プログラミングフェスDay2
- 2019年 in 永平寺町 夏、プログラミングフェスDay1! VRで実寸で思い出せる360度写真&アプリ
- 2022年mini ロボットプログラミングを追体験するVRアプリ、福井新聞小中学生プログラミングフェス2022mini
- 福井県小中学生 プログラミング・フェス 2022

Tweet
クリエイティブ・コモンズ・ライセンス
本ブログの記事や写真は「Creative Commons — CC BY 4.0」の下に提供します。記事内で紹介するプログラムや作品は、それぞれに記載されたライセンスを参照ください。
CC BY / @taisukef / アイコン画像 / プロフィール画像 / 「一日一創」画像 / RSS