やってみようプログラミング！つくってみよう知育アプリ！

終了:当日の様子はこちら

 画像
「プログラムの楽しさを知ってもらいたい―」
そんな思いをもってご自宅プログラマーとして活躍されているあらかわかなえさん。
ワークショップでは、かなえさんにプログラムを全くやったことのない初心者でも挑戦できるアプリの作り方を教えてもらいます。
今回、教えてもらえるアプリのタイトルは「ごほうびルーレット」。HTML,CSS,JavaScript使います。
ご自宅でお子さんとのコミュニケーションにご活用されているとか！どんなアプリか楽しみですね。

開催日時

  1. 日　時：2022年10月13日(木) 10：00～12：00
  2. 参加費：無料
  3. 形　式：オンライン配信のみ

協力　佐賀県産業スマート化センター

タイムスケジュール

10:00オープニング - 自己紹介、今日の流れの説明 ＊トーク＆スライド部＊
10:05プログラミングについて - プログラミングには、ルールはあるけど正解はない - 自由に楽しめるもの
10:10Webアプリとは - JavaScriptとHTML＋CSSを使ってアプリを作ることについて - どんな言語で、何がすぐれいてるのか
10:20自家製アプリの作り方 - アプリのアイデアから、具体的に設計するまで - 「ごほうびルーレット」を例に解説 ＊ 製作キットで実践部＊
10:30- HTMLでのブロッキング - CSSでの配置 - JavaScript - CSSアニメーション
11:15応用～さらに改造するなら
11:25クロージング - 今後の学習法についてなど

講師紹介

講師名：あらかわかなえ
講師プロフィール：
子育て中プログラマーのかなさん。
お勤め先でHPの保守などをまかされたことをきっかけに、プログラムの楽しさに目覚め、ほぼ独学でいろいろなプログラミングにトライ！
いまはお子さんと一緒に楽しめるアプリ開発に夢中。
世の中の人にもっとプログラミングで得られる楽しさを知ってもらいたいと活躍中。めっちゃ楽しそうなアプリたくさん制作されています。

用意するもの

パソコン初心者
こちらのワークショップはエディタをつかってプログラムソースを編集します。
参加の皆様には「エディタ」をインストールしていただく必要があります。
エディタはいくつか種類がありますが、今回はVSCodeを推奨します。
※他のエディタをお使いになっている方は使い慣れているもので構いません。
Windows、Mac,Chromebookで使用可能です。こちらのURLからインストールしてください。

Visual Studio Code

https://azure.microsoft.com/ja-jp/products/visual-studio-code/

Visual Studio Codeを日本語化する

単純にインストールすると英語のままなので気になる人はこちらを参考に日本語が使えるようしてみてください。
https://www.javadrive.jp/vscode/install/index4.html
参考サイト：
VSCode インストールと日本語化の手順【初心者向き】
https://miya-system-works.com/blog/detail/vscode-install/

ChromebookにVS Codeをインストールする

Chromebookご利用のかたはLinux版のインストールが必要です。
以下のURL参考にインストールしてみてください。
※ただ、他に使えるエディタがあれば特にVSCodeでなくてもいいですよ。ご相談ください。
https://qiita.com/s1r/items/c0977bd3c5d6244ba829
※Chromebookをお使いの方は、ChromebookでWEB表示などができるか事前確認お願いします。
ChromeBookでWebサイトを作成する方法：
https://gotoblog.org/chromebook-create-web/

その他注意事項　※必ずお読みください

  • インターネットに接続できる環境で、Google Chrome が正常に動作するパソコンをご用意ください。
  • ワークショップで使うソースはChromeブラウザで表示予定です。
  • プログラムには JavaScript を使います。
  • Google Chrome をインストールしていない人は事前インストールお願いします。
  • 知育アプリはブラウザで動くアプリです。
  • 参加終了後、アンケートにご協力ください。

    • 当日の様子

    ごほうびルーレット
    今回は、Webブラウザで動く「ごほうびルーレット」というアプリの作成に取り組みました。
    事前に送っていただいたサンプルのアプリがカラフルで可愛らしく面白かったので、
    「これが自分で作れるの？」
    と、参加者全員、不安と期待でドキドキワクワクしていました。
    かなえ先生は、そのプログラムファイルと一緒に当日の為の説明書もPDFで送ってくださいました。
    当日、参加者全員がスムーズに作業に入れるように、VSCodeの設定やファイルの開き方、ワークショップの進め方等、とても丁寧な説明書を準備してくださったのです。
    とても細やかな気配りにかなえ先生の温かいお人柄を感じました。
    ホビープログラミング
    プログラミングをもっと気軽に身近に――。
    「プログラミングにルールはあるけど正解はない」のだから、もっと多くの人に、やりたいと思ったことを自由に形にできる便利さを知ってもらって、難しく考えずに楽しんで取り組んでみて欲しい、と力説されました。
    企業で「売り物」として作るものと違い、「自分で楽しむため」に作るものは「手芸」と同じようなもの、というご説明はとてもわかりやすかったです。
    縫い目がガタガタでも裁縫テープを使ってもOK、極端な話、表に返して表がキレイに見えればいい、とのことでした(笑)
    まだ簡単…とは言えませんが、プログラムが少し身近に感じられるようになりました。
    ホビープログラミング
    プログラムや言語の基本的なルール等を学んだ後、先生と一緒にアプリの作成をしました。
    参加者全員、真剣に作業に取り組んでいました。
    時間の関係で、サンプルのファイルからコピー＆ペーストする作業が多かったのですが、実際に自分が入れた文言がアプリに表示され、ルーレットが回ると感激しました。
    プログラムのやり方のパターンさえ掴めば、自分の中で次から次へと展開していくような気がします。
    そこから自分が作りたいもの、新しいアイデアに繋がりそうです。
    今日習ったプログラムを基に、違うものを作るチャレンジをしたくなりました。また是非ともワークショップを開いていただきたいです。
    とても楽しくて有意義な時間でした。かなえ先生、本当にありがとうございました。