これからはじめる人の JavaScript/Vue.js の教科書(コレカラハジメルヒトノジャバスクリプトビュージェイエスノキョウカショ)

「 JavaScript を学ぼう」
そんなふうに思っても、「 JavaScript 」は現在では、非常に関連技術の多い言語になっています。 JavaScript 関連のキーワードを上げてみると、「 ECMAScript / TypeScript / Vue.js / Nuxt.js / React / Angular / jQuery 」など、上げていったらキリがありません。
これらは「 JS ライブラリー」とか「 JS フレームワーク」などと呼ばれている JS の周辺技術で、現在のウェブサイト制作や、ウェブアプリ開発では、これらの周辺技術の理解が必須になっています。

本書は、こういった事情に合わせて、今 JavaScript を学ぶなら、この周辺技術は必須だと筆者が考える以下の内容について解説しています。

JavaScript ／ ECMAScript ／ Vue.js ／ TypeScript

ぜひ本書を通じて、 JavaScript の魅力と現在の JavaScript 開発のトレンドを抑えて頂けると幸いです。これからのウェブ開発にお役に立つことを願っています。

(「はじめに」より一部修正)

「 Chapter1 JavaScript を学ぶための準備をしよう」では、 JavaScript を学ぶための環境構築を行います。といっても、 Google Chrome (ウェブブラウザー) と、 Visual Studio Code (エディター) をインストールするだけの簡単な準備です。

「 Chapter2 JavaScript の基本を学ぼう」では、 JavaScript を基本からみっちり学びます。四則演算、制御構造、変数、配列、関数といった基本的なところから、イベントリスナーの使い方、クラスの定義、モジュール、非同期通信、 Cookie の使い方など、 JavaScript を実務で使う際には必須となるような実践的な内容まで学びます。 EcmaScript2015 の文法で学びますが、必要に応じて古い文法についても説明しています。

「 Chapter3 TypeScript の基本を学ぼう」では、 TypeScript について知っておきたいことを一通り学びます。 TypeScript の基本的な使い方から、関数、さまざまな型、クラス宣言、インターフェイスの使い方などまで解説します。

「 Chapter4 Vue.js の基本を学ぼう」では、現在制作の現場でよく使われているライブラリである Vue.js について学びます。基本的なディレクティブの使い方を学んだあと、メソッドやコンポーネント、ミックスインの定義方法を学び、実用的なプログラムを作ります。

「 Chapter5 Vue CLI でアプリを作ろう」では、 Vue CLI を使って、簡単なメモ管理のアプリケーションを作成します。プロジェクトの作成から始まり、ルーティングを設定し、新規追加・一覧・編集・削除の機能を作っていきます。 Vuex を使って、データの保存も行い、コンポーネントを作って共通のパーツを追加するところまで行います。

Web 制作の現場に立つと、 HTML と CSS だけでは越えられない壁に出会います。フォームのバリデーション、画面の動的な書き換え、 API との通信。そうした「動き」の部分を担う JavaScript に初めて触れる人が、つまずかずに基本文法からフレームワークまで一冊で到達するための教科書です。著者のたにぐちまこと氏は初学者向けの技術解説に定評があり、本書でも変数やループといった基礎から丁寧に積み上げ、後半で Vue.js を使ったコンポーネント指向の開発に入ります。

JavaScript の入門書は数多く出版されていますが、本書の特徴はフレームワーク体験までを射程に含めている点です。素の JavaScript を理解したうえで Vue.js のリアクティブな仕組みに触れることで、「なぜフレームワークを使うのか」という動機が実感を伴って腑に落ちます。逆に言えば、 Vue.js を業務レベルで使いこなすには本書だけでは足りず、公式ドキュメントや実践書への橋渡しとして位置づけるのが適切です。

プログラミング経験がまったくない状態から始められる難易度で書かれているため、デザイナーやマークアップエンジニアが JavaScript 領域へ踏み出す最初の一歩として噛み合います。