注目キーワード
  1. Photoshop
  2. Python
  3. Raspberry Pi
  4. Arduino

[Graspy:JavaScript]無料学習した体験談まとめ

ここではGraspyが運営している無料Javascript学習講座を受講した感想や体験談を紹介していきたいと思います。

taku
Javascriptを学びたいけど、スクールとか参考書を使いたくない!

といった悩みも解決できるため、興味のある方は是非ご覧ください。

GraspyのJavascript学習講座

ひらめき

著者自ら「Graspy」の「Javascript講座」のプログラミング講座を受講してみました。

「Graspy」については下記記事でもまとめています。

無料でプログラミング・AI・UI/UX学習できるGraspyまとめ

 

では、実際にGraspyのプログラミング講座がどのような内容か

Graspyのプログラミング講座の難易度はどれくらいか

を紹介していきたいと思います。

 

 

Graspyプログラミング学習項目

思考

GraspyのJavascript学習講座には大きく分けて10つに分かれており

 

0. オリエンテーション

1. Javascriptとは

2. 変数

3. イベントドリブン

4. DOM

5. 条件分岐

6. 繰り返し構文

7. オブジェクト指向

8. JSON

9. JQuery

 

となっていました。

項目別に細かく分かれているため、1つ1つの章のボリュームは多すぎず少なすぎずと言った量で

Javascriptの基礎を学ぶ上で必要な知識は十分に詰め込まれていました。

 

このプログラミング講座において必要なツールは下記二つになります。

 

Google Chrome

AWS Cloud9アカウント

 

Google Chromeは簡単にショートカットなど作成できるので問題はなしですが

AWS Cloud9のアカウント作成には「クレジットカード情報の登録」が必須となっています。

まあ、無料利用期間が「1年」となっており

1年経過後に使い続けていると「使用料金」が発生するとのこと!

 

僕は、忘れていて追加料金を取られるのが嫌だったので、AWS Cloud9を使わずに学習することに決めました。

「Graspy」の講座資料にはAWS Cloud9での学習を想定した内容になっていますが

「Windows10」と「TeraPad」があれば余裕に再現可能です。

「TeraPad」についてはもちろん無料ですし、下記記事でも紹介しています。

メモ帳でプログラミング:オススメ[TeraPad最強です]

 

また、ここだけの話

Graspyには受講期間が1ヶ月と制限がありますが

受講テキストを「Word」などでまとめてしまえば

テキストも開発環境も「期限なし」かつ「無料」Javascriptを学習ですることができるわけです。

 

実行例の少ないプログラミング教材を買って、一人で悩みこむより

プログラミングの実行動作例や、プログラミングに関する語句の説明までしっかりと記載されているテキストとプログラミング開発開発環境だけ準備できてしまえば

「オフライン」で場所を選ばずプログラミング学習できる点も考えると

「Graspy」のJavascript学習講座はかなりオススメできます。

 



 

 

GraspyのJavascript基礎

GraspyのJavascript講座ではまず1章と2章でJavascriptとは何か?というプログラミングの基礎知識を学習しました。

 

Js学習内容オブジェクトとメソッド

プロパティ

デバック作業

変数の使い方

四則演算

になります。

 

HTMLとJavascriptとの兼ね合いや

Javascriptのソースコードの書き方、警告文の仕組みなど様々なパターンごとに学習しました。

 

var num = prompt();

alert(num);

 

といった基本的なプログラムの書き方と意味について学ぶことができました。

Graspyのプログラミング講座は、本当にJavascriptを触ったことがないという人でもわかりやすい説明で

「1時間」もかからずに2章まで進むことができます。

 

Graspyのイベントドリブン、DOC

GraspyのJavascript講座、続いて3章ではイベントドリブンを行いました。

 

内容としては

イベントドリブンの意味、定義方法、イベントキャンセル

です。

 

イベントドリブンはイベント(ボタンがクリックされたときなど)が発生した時にプログラムを実行させることができます。

 

一例として「解答を表示する」というボタンをクリックすると

「警告」ウィンドウで解答を表示するプログラムを作成しました。

 

イベントドリブン

実際にGraspyの教材に従って、プログラムするとこんな感じになります。

 

またGraspyのJavascript講座、4章ではDOM(Document Object Model)という要素を操作できる仕組みを学びました。

DOM要素のプロパティとメソッド、その他のDOM操作、appendChildメソッドがメインになります。

 

実際に

 

.addEventListener(‘click’,function(){

});

 

を使って、ボタンなどがクリックされたときにリストの番号をカウントアップするプログラムを作成。

実際にプログラムを組んでみましたが、簡単にできましたね。

DOC

ちなみに各章に「GraspyのJavascript講座」には章末問題があり、4章の章末問題は上図でも示しているカウントアップでした。

プログラムの難易度的には「易しい」と思うので気軽に学習を始めれますね。

 

GraspyのJSON、jQuery

GraspyのJavascript講座、8章ではJSON、9章ではjQueryを学びます。

jQueryのショートカッ記述「$」の説明やメソッドとメソッドチェーンや

jQueryの醍醐味であるアニメーションも学ぶことができます。

 

jQuery(‘img’).fadeOut();

jQuery(‘img’).hide().slideDown();

jQuery(‘img’).slideUp();

jQuery(‘img’).slideToggle();

 

といったメソッドを利用することでアニメーションを付けることも行いました。

 

jQueryはWebページでも使われるので、しっかりと復習したいと思いました。

 

 

 

以上「[Graspy:JavaScript]無料学習した体験談まとめ」でした。

初めてJavascriptを学びたいという方にはオススメですね。

自分で「.html」ファイルと「.js」ファイルを作れる環境を用意すればいつでも学習できます。

皆さんも是非挑戦してみてください!

 

お疲れ様でした。

アイデア
学びに関する情報をチェック!