見出し画像

福井県でエンジニアを目指そう!ゲームアプリ開発体験会レポート【ふくいITエンジニア養成スクール】

ふくいITエンジニア養成スクール(運営:コードキャンプ株式会社)では、受講に先立ち「プログラミングを体験してみたい!」という方へ向けて、ゲームアプリの開発を行う体験会を開催しました!

【開催日】
第1回 令和4年8月27日(土)13時〜15時
第2回 令和4年8月28日(日)13時〜15時

【場所】
Fスクエア・キャリアナビセンター
福井市手寄1-4-1 AOSSA7階(JR福井駅東口を出てすぐ)

【概要】
HTML・CSS・JavaScriptというプログラミング言語を使って、ブラウザ上で動くゲームアプリケーション(ビンゴゲーム)の開発をします。
プログラミングの考え方や面白さを知り、2時間の体験で「プログラミングって意外と簡単!楽しい!」を実感してください。

土曜日14名、日曜日13名、計27名の方にご参加いただきました。
実はHTMLとCSSを途中で挫折してしまった経験のある事務局の川井が、開催レポートをお届けします!

「福井県でエンジニアを目指したい!」という方は、
記事の末尾にあるふくいITエンジニア養成スクールのリンクからお問い合わせ・お申し込みください!

今回プログラミングを教えてくれるのは、「世界一わかりやすいプログラミングのレッスン」と評判高い志賀先生です!
スライドには3000名と書いてあるのですが、それ以降は数えておらず、おそらく5000名以上は指導してきたとのこと(すごい・・・)、
ふくいITエンジニア養成スクールのカリキュラムも監修しています!

学生・新入社員・主婦・定年後のシニアの方など、様々な方の指導経験あり!

まずはプログラミングでコードを書くための準備!

CodeCampでプログラミングを学ぶには、Google Chromeがあれば大丈夫です!今回の場合だと、
・Google Chromeをパソコンにダウンロード
・CodeCampのシステムへログインして、エディタ(プログラミングのコードを書く場所)のAWS Cloud9を起動
・体験会の教科書を開く
と3ステップで完了しました。
自分で1からプログラミングのコードを書くための準備をするとかなり時間がかかりますが、前日に事務局から届いたメールを確認しながら、スムーズに作業ができました。

ビンゴゲームを作る準備を通じて、プログラミング言語について学びます

次は志賀先生と一緒にビンゴゲームを作る準備を進めながら、まずはプログラミング言語について教えてもらいました!

HTML

HTMLは、ページの枠組みを作る言語です。例えば、「ビンゴ」という文字を、ページ上のどこに表示させるかを指示します。
家で言うと基礎工事・土台の部分にあたるのかな?とイメージしました。
シンプルなページを表示させることができました。

HTMLのコードを入力するとこんな表示になりました!

CSS

CSSは、ページの見た目を変える言語です。先ほどHTMLで作ったページの「ビンゴ」という文字は黒色だったのですが、赤色になっています!また、線が入ったり、位置が整うようになりました。他にも文字のサイズも変えることができます。
家で言うと、壁や屋根の色や模様になるのかな?とイメージしました。

先ほどのHTMLのコードにCSSを反映させると・・・?

JavaScript

JavaScriptは、ページに動きをつける言語です。通販サイトで申し込みをしようとすると「本当によろしいですか?」「本人情報にお間違いはないですか?」と表示が出てきて、クリックしないと先に進めないアレです。
他にも、画像がスライドショーのように自動で変わるホームページもJavaScriptが使われています。
今回は「JavaScriptの準備ができました」という表示を出しました。
家で言うと・・・電気などの設備でしょうか?家があっても、実際に暮らすには電気等がないと前が見えなくて転んでしまうので!

Webページあるある:クリックしないと先に進めないアレ

プログラミング言語の役割について教えてもらうのはもちろん、コードを入力するCloud9の使い方についても教えてもらいました。
「コードを入力したら、必ず内容を保存しましょうね!」と教えてもらったのに、私はついつい保存を忘れたままプレビューで見ようとするので、「あれ、せっかく書いたのに反映されていない・・・!?」となってしまうことがしばしば。
ゲームと同じで、こまめなセーブが大切ですね(汗)

ついにプログラミングのコードを書いていきます!

プログラミング言語の役割が理解できたので、ついにプログラミングのコードを書いていきます!

まずは先ほどのJavaScriptの「クリックしないと先に進めないアレ」(以下:アラート)が何度も出てきて大変なので、アラートを止める方法を教えてもらいました。
書いているコードの先頭に「// 」(スラッシュ2本)を入れると、コードの文字がグレーに。これで無効にできるようです!
コードを書きながら、今は必要ないけどもしかしたら後で使うかも・・・というものは、消さなくても先頭に「// 」(スラッシュ2本)を入れて無効にしておくと便利ですね。

コードの中身を少し変えるだけでも、動作が変わるのが面白いです

その後、ビンゴマシーン・ビンゴシートを用意し、少しそれっぽくなってきました!

ビンゴマシーンの数字をビンゴシートに転記させるWebアプリケーションです

最初は、ビンゴマシーンを回すプログラミングのコードを書きます。
先生が作ったプログラミングのコードに、3つの命令を付け加えるのですが、この3つの命令をどう並び替えて、どうコンピューターに指示するのかが難しいです。。。
コンピューターは上から順に命令を実施していくとのことで、コードを書く順番で結果も変わると学びました✍️

その後、同様に
・ビンゴマシーンを止めて、色をつけた数字がビンゴシートにもあったときに、ビンゴシートにも色を付ける命令
・リセットボタンを押したら、ビンゴマシーンやビンゴシートについている色がリセットされる命令
を追加した結果・・・!

すごい!動いてる!リセットもできる!遊べる!
これが1時間半で完成したのでびっくりしました。
コードを入力するだけで、コンピューターが思ったように動いた時は達成感がありました!!!
今度から余興でビンゴゲームを実施するときはこのプログラムを使って開催しようと思います。

卒業生からのメッセージ

無事にゲームアプリの開発が完了したところで、昨年度のふくいITエンジニア養成スクールの卒業生の方からのビデオレターを拝聴しました。
飲食店のアルバイトとして働いていた藤川さんは、受講を経て、ホームページの更新・制作のお仕事をされているそうです!

また、他県で実施したCodeCampのカリキュラムを受講し、データアナリストとして転職した武田さんのお話を聞くことができました。
武田さんはゲームアプリ開発体験会ではサポーターとして参加しており、困った時に質問しましたが、
講座受講中も学習サポーターとして学習をサポートしてくれるとのこと!実際にキャリアチェンジ転職に成功した先輩に相談できるのは心強いです。

福井県内で活躍するITエンジニアを目指しませんか?

ふくいITエンジニア養成スクールでは、受講生を募集しています!

「フロントエンドかバックエンドか、コースに悩んでいます」
コースが決まっていなくても申し込みできます!開講までに一緒に相談しながら決めていきましょう。どちらも非常に需要が高いため、”自分自身にとって”どちらの学習に興味があるかを基準に検討してみてください。
 
「大学や専門学校等で情報学を専攻していない・文系なので不安です」
挑戦したいという気持ちがあれば、これまでのバックグラウンドは関係ありません!理系・情報学専攻でなくても、就職・転職ができるレベルまで到達することができます。

「プログラミングが初めてで、やり切れるか不安です」
学習サポーターと一緒に学習の計画を立てたり、学習の進め方に関して随時相談できます。共に学ぶ仲間や事務局もいるので、困ったときに相談できる人がたくさんいます!
「挑戦したい」「継続するぞ」という気持ちが大事です!


志賀先生も
「サッカーが1日で出来るようにならないように、プログラミングも練習は必要ですが、練習を続けることで必ず出来るようになります。そして、4ヶ月の練習で、お金をもらってプロとして出来る可能性があるのはプログラミングくらいです。サッカーや野球ではこうは行きません。」
とアドバイスをしてくれました。

一緒にプログラミングを継続練習してエンジニアになりたい人は、ぜひお申し込みください!(締切:令和4年9月12日まで)

講座申し込みフォーム

ホームページ