フロントエンド

『JavaScript入門講座』の構成を検討中〜重視したい4つのテーマ〜

『PHP/Laravel入門講座』向けの追加動画も撮影が落ち着き、

おかげさまで1か月たたずに100名以上の方にお手に取っていただいたことで、

次は何を作ろうかと思っていたころに、

こんな感想をいただきました。

10コース以上、Udemyを利用してきましたが1番分かりやすくて聞き取りやすいです!

是非ともJavaScript・フレームワークのコースを作って欲しい!

いやぁ、嬉しい。

アオキ
朝4時起きで頑張って講座つくってよかったよ。。

というわけで、次は『JavaScript入門講座』を作ろうかと検討しております。

Sponsored link

JavaScript入門講座を作るにあたり考える事

『JavaScript』といえば、

『Web業界』では知らない人はいないと思われる超有名言語で。

その歴史も古く、

暗黒時代から大航海時代まで、
それはそれはいろんな歴史がある言語だと思います。

関連記事

『JavaScript』を筆頭とするフロントエンドは、本当に変化が激しく、

毎年毎年新しい書き方が生まれている状況なので、

できるだけ新しめの書き方を軸にしつつ、

プログラミング初心者にとってもわかりやすい内容にまとめていきたいと思っています。

JavaScript入門講座で重視したい内容その1 イベントドリブン

他言語と比べて、
『JavaScript』独特だよなぁと思うのはこんな箇所。

  • イベントドリブン
  • DOM操作
  • Ajax(Promise, async/await, fetch)
  • ES6〜
  • ツール群(npm, bable, webpack)

パソコンにしろスマホにしろ、

クリックしたり、タップしたり、

スクロールしたり、といった操作があるわけで、

それらを検知したタイミングで何らかのアクションを起こすことができるのが、

『JavaScript』の強みだよなぁということで、

『イベントリスナー』周りは厚めに構成しないとなと思っています。

Sponsored link

JavaScript入門講座で重視したい内容その2 Ajax

『JavaScript』が復権した一番の要因が『Ajax』

グーグルマップでおなじみの、

ユーザーが触っても再読み込みなしで地図が動くという、

『非同期通信』という技術なのですが、

これまたいろんな歴史があって。

  • XMLHttpRequest(XHR) ・・非同期通信
  • Promise ・・非同期処理
  • async/await (Promiseの簡易版) ・・非同期処理(Promiseを簡単にかける)
  • fetch (Promiseベース) ・・非同期通信

XMLHttpRequestに関しては、
古い技術ということで簡単な紹介に抑えて、

Promise/async/await/fetch をメインに、

『CORS(クロスオリジン)』などもたっぷり扱って、

この講座一つでしっかり『Ajax』がものにできるような内容にしないとなと思っています。

JavaScript入門講座で重視したい内容その3 jQueryじゃないよ

『JavaScript入門講座』をつくるにあたり、

『Udemy』で『JavaScript』と調べて、

目につく講座の中身とコメントを片っ端から読んでいたのですが、

いくつか気になるコメントが。

学習者
JavaScriptと思って参加したらjQueryだった。

という内容で。

アオキ
いや、確かにjQueryはJavaScriptだけどさ、そこはちゃんと書いておこうよ。。

と思わずツッコミを入れたくなる講座内容がちらほら。

『jQuery』は確かに超有名な『JavaScript』ライブラリで、

『jQuery』のおかげで『Ajax』が広まったのは間違いないんだけれど、

いろいろと問題もあり、
現在は生の『JavaScript』でPromise/fetchがある以上、

その役割はだいぶ落ち着いたと思われる状態で。

もちろん数ページのホームページなどを作る場合には、
今でも大活躍できるとっても便利なライブラリではあるんだけれど。

今回の『JavaScript入門講座』では、
より発展的に、大規模開発でも使えるような知識にしていくために、

『jQuery』は簡単な紹介くらいにして、
『Promise/fecth』などの新しめの『Ajax』技術にフォーカスをあてていきたいと思います。

Sponsored link

JavaScript入門講座で重視したい内容その4 環境構築

2015年頃に『JavaScript』は大幅にアップデートして、

普通のサイヤ人がいきなりスーパーサイヤ人3になったくらいに進化して。

アオキ
うん、例えが古い。年だわ。←鬼滅の刃読まなきゃ=3

アップデートしすぎたために周りのブラウザがついていけなくて、

新しい書き方を古い書き方にコンパイルするという技術が生まれました。

関連技術として、

  • Node.js(npm)
  • babel
  • loader
  • polyfill
  • webpack

などなど。

『JavaScript入門』の本だとこれらの知識がすっぽりと抜け落ちていたりするので、

できるだけ新しめの情報をうまいこと盛り込んで、
講座一つで最新の書き方までキャッチアップできるような内容にできればと思っています。

JavaScript入門講座の構想をまとめてみて

講座の構成をざーっとリストアップして、

動画60本分くらいの内容は整理できたのですが、

きっとまだまだ抜け漏れあり、
僕自身の情報が古かったり、イマイチな箇所があったりするため、

都度ググり、情報アップデートしながらの動画撮影になります。

また、
家庭の都合で朝4時から約2時間しか収録できないという理由もあり、

動画リリースまでどうしても時間がかかってしまうのですが、

その分わかりやすくて内容たっぷりな中身にしたいと誠意検討中です。

もし、こういった内容も盛り込んでほしいとご要望あれば、

できるだけ追加したいと思いますので、

ご遠慮なくご連絡いただければと思います。

アオキ
『PHP/Laravel入門講座』を超えられるような講座をつくるどー
created by Rinker
¥3,278 (2020/04/08 21:20:04時点 Amazon調べ-詳細)

関連記事一覧 (一部広告あり)

コメント

    • bucchou
    • 2020年 3月 03日

    ご無沙汰してます。
    自分もPHP/Laravel講座購入させていただきました!
    終わったらレビューしておきますね♪
    評価もすごい良いですね。さすがです。
    自分もSPAとか実装したいんでJSからは逃げられないんで楽しみにしてます。
    頑張ってください!

      • aoki_monpro
      • 2020年 3月 03日

      bucchouさん、
      コメントありがとうございます。

      ぜひぜひいい感じのレビューよろしくお願いします^^

      SPAまで含め、できる限りわかりやすくつくりますので、もう少しお待ちいただければと思います。

      淡々と頑張っていきます^^!

  1. この記事へのトラックバックはありません。

CAPTCHA


最近の記事

  1. CG関連

    【WebGL】入門 わかりやすく【図解】してみた
  2. CG関連

    【P5.js】遊ぶようにプログラムできるクリエイティブコーディング〜はじめのいっ…
  3. CG関連

    【3Dプログラム】初心者にオススメな方法はこれ(9)【P5.js】
  4. 学び・教育

    『ニュータイプの時代』〜リベラルアーツとテクノロジーの融合〜
  5. オンライン教材

    【PHP/Laravel】初心者向けの動画をリリースしました【Udemy】
PAGE TOP