苦手を克服するためのJavaScript初学者講座始めます

WEB制作の初学者たちがHTMLやCSSはだいぶ理解してきたけれども、JavaScriptにつまづいてしまうという声を多く耳にしています。

そんな人たちになんとか「JavaScriptって面白い！」「JavaScript書けます！」と自信を持って言えるようになって欲しいと願い、今日からブログでJavaScriptのことを書いていくことにしました。

私がコーダーを始めた当初（2009年頃）は今ほどJavaScriptの重要性は高くなかったので、初学者の段階ではあまり学んでいませんでした。時間が経つにつれ業務の中でだんたんとJavaScriptを求められることが多くなり、仕事の中で勉強をしながら身につけていきました。

場当たり的にプログラムをしていたこともあり、体系的に学んだ経験がないその場しのぎな技術になっているのも事実なので、自分も学んでいることを残すような形で記事を書いていきたいと思います。

勉強の流れ

これからの勉強の流れを大まかにまとめます。

まずは３に挙げている「簡単なWEBサイト、アプリケーションを作る」をゴールにしたいと思います。１～３の流れは何度か繰り返すかもしれませんが、いくつか作成することでその時に出てくることを勉強していきます。
その次のステップとしては下記を想定しています。

このフェーズでは作るものに対して必要な技術を調べていくというやり方を採用し、WEBアプリケーションを考えるトレーニングも兼ねていきたいと思っています。

学んで作ったWEBアプリケーションは、GitHubに公開リポジトリしてアップするつもりです。
初学者の方がポートフォリオに載せる作品に困っているという話も耳に入ってきているので、そのリポジトリを自分なりに改良したものやリデザインしたものを作ってもらいたいです。

先ほどの流れでは作るものの具体的なことに触れていませんので、ここにまとめていきます。

WEBでJavaScriptに求められることに大きく分けて２つの役割があると考えています。

インタラクションは英語の「inter」と「action」を合わせた言葉で、何らかのユーザーからの入力に対してシステムが応答を返すことを指します。
WEBサイトではフォームの入力、送信から得られる返信が例に挙げられます。

JavaScriptはWEBサイトの要素にさまざまな動き、アニメーションを付与することに長けています。
最近はライブラリも増えてきたことやWeb Animations API、CSSによる実装も可能になり、以前よりもアニメーションに対してのハードルは下がっています。

この２点、両方の制作を目指して学習していきます。

本件はGitHubを利用してコードの管理を行います。
いずれはそこのコードを使って様々な人が勉強やカスタマイズをしていき、ご自身のポートフォリオなどの制作活動に活用してもらいたいと考えています。

私のPC環境がMacのなのでWindowsユーザーの方とは少し違う部分があるかもしれませんが、JavaScriptはブラウザで動くプログラムなのでさほど大きな問題はないと考えています。

OS	macOS Monterey 12.0.1（本記事執筆時）
コードエディタ	visual studio code
ブラウザ	Chrome, Safari（最新バージョンを基本とする、主にChromeを使用し、Safariでも動作を確認する）

次回の記事からはJavaScriptのプログラムについて基礎から勉強していきます。一緒に読んでくださる方々の有益な情報になるよう頑張っていきます。

ここまで読んでくださり、ありがとうございました。

制作協力
サムネイル制作：うみ Twitter