はじめまして、ITエンジニアのカワノです。
JavaScriptというプログラミング言語についてご存知ですか？よくインターネットをされる方や、プログラミングに興味のある方ならば聞いたことがあるのではないでしょうか。この記事では現役エンジニアである筆者が JavaScript というプログラミング言語の概要を解説していきます。
目次
JavaScriptとは、どんな言語？
JavaScriptとはブラウザで動作することから、Web業界を中心に非常に需要の高いプログラミング言語です。数あるプログラミング言語の中でも、高い専門性と汎用性を兼ね備える珍しい特徴を持ちます。まずは、そんな一風変わった JavaScript の特徴や魅力についてお伝えします。
JavaScriptを学ぶと何ができるようになる？
実際に JavaScript を学習すると何ができるようになるのでしょうか。JavaScript でできることは「フロントエンド開発」と「サーバーサイド開発」の二つに分けられます。それぞれについて詳しく解説していきます。
フロントエンド開発
Wikipedia や個人ブログを思い浮かべてみてください。ページを開いた瞬間にアニメーションが始まったり、どこかのボタンを押すとウィンドウが出てきたりすることはありません。これが「動き」のない状態です。このようなWebページを「静的」なページと呼びます。
反対に、ゲームや映画のプロモーションページ、Amazon や Facebook などのWebサービス、ブラウザゲームなどは、アニメーションがあったりボタンを押すとウィンドウが出てきたりと「動き」があります。このようなWebページを「動的」なページと呼びます。
フロントエンド開発とは簡単に言うとWebページの作成のことで、特に「動的」なWebページの作成を指します。
HTML5 を使ったゲームの開発
JavaScriptを使うと HTML5 を使った、ブラウザゲームと呼ばれるゲームを作ることができます。RPG、 シューティングゲーム、テーブルゲーム、シミュレーションゲームなど、ブラウザで動かせるのならばジャンルを問わず、好きなゲームを作ることができます。
ブラウザで動かすので、PlayStation4 などの据え置き機でプレイするような高グラフィックなゲームを開発することはできないことに注意してください。
Webアプリケーションの画面開発
Webアプリケーションの画面開発では、ユーザーがボタンを押した時のアクション、ユーザーが入力した値のチェック、その他アニメーションなど JavaScript が欠かせません。JavaScript をうまく使うことで UI ( ユーザーインターフェース ) や UX ( ユーザー体験 ) を向上させることができます。
UI/UX に関しては多くのWebサービスが注力しているため、優れた JavaScript エンジニアは多くの企業で重宝されます。
サーバーサイド開発
次に、サーバーサイド開発です。ユーザーがネットワーク越しにサーバーにアクセスした時に、そのリクエストに対して適切なレスポンスを返す処理や、サーバーがデータベースの参照や更新を行う処理の開発などを指します。バックエンド開発とも呼ばれます。
Webアプリケーションなどのサーバーサイド開発
Webアプリケーションは画面だけでは動作しません。ユーザーが画面に入力した値をサーバーで受信してデータベースに保存したり、データベースから必要な値を参照して画面に表示したりするサーバーサイドの開発が必要です。
例えば、会員登録ページで ID とパスワードを設定するとします。サーバーサイドでは、ユーザーが入力した ID がすでに使われていないかをチェックし、問題なければ暗号化を施してデータベースに保存します。
また、ログインページに ID とパスワードが入力されたら、サーバーサイドではその ID がきちんと存在しているか、パスワードは正しいかをデータベースを参照してチェックし、ログインの可否を判断します。
このようなサーバーサイド開発ができるプログラミング言語はたくさんあります。JavaScript はそのうちの一つにすぎません。しかし、Webアプリケーションを作る際には画面の開発も同時に行う必要があります。JavaScript には、フロントエンド開発とサーバーサイド開発を同じプログラミング言語で行えるという他の言語にはないメリットがあります。
なお、サーバーサイド開発であればWebアプリケーションに限らず、チャットボットの開発や IoT の開発も可能です。
ブラウザで動く唯一の言語
JavaScriptはブラウザで動作する唯一の言語です。ブラウザというのは、Google Chrome や Safari などのWebページを閲覧するためのアプリケーションの総称です。そのブラウザで動作するということは、Webページに「動き」を与えられるということです。
Webページを「動的」なページにできるのは JavaScript というプログラミング言語だけなので、「動的」なWebページはすべて JavaScript を利用して作られていることがわかります。
他にも様々な場で活躍
JavaScriptにできるのはWeb ページを動的にすることだけではありません。Node.js という JavaScript実行環境を使うことで、サーバーサイド開発、チャットボット開発、IoT 開発などが可能で、それぞれの分野で活躍しています。
サーバーサイド開発、チャットボット開発、IoT 開発などに関しては、すでに述べたように他のプログラミング言語でも行うことができます。しかし Node.js を使用すると難しい仕組みを使わずにたくさんの接続を同時に処理できる、複雑に設計を行わなくても効率的に処理ができる、というメリットがあるため広く採用されています。
JavaScriptを使用している例を紹介
ブラウザやサーバーで使われているという説明から察しがついている方も多いかもしれませんが、JavaScript はいたるところで使われています。
例えば、 すでに少し触れたように世界的に有名なWebサービスである Amazon や Facebook も動的なので、JavaScript が使われていることがわかります。日本でもヤフオク！などのように動的なページを使ったWebサービスはたくさんあります。
「艦隊これくしょん -艦これ-」や「ビビッドアーミー」などの HTML5 で作られているゲームも JavaScript を駆使して作られたものです。
サーバーサイドで JavaScript を使用している例としては Linked in のモバイル版が挙げられます。Linked in はもともと Ruby on Rails という技術でサーバーサイド開発を行っていたそうですが、パフォーマンスを改善するために Node.js に切り替えたそうです ( 参考: Clearing up some things about LinkedIn mobile’s move from Rails to node.js )。
ここで紹介したものはほんの一部で、Web サービスやブラウザゲームのほとんどは JavaScript を使用しています。JavaScript は私たちの身近なところに寄り添っているプログラミング言語なのです。
初心者でも簡単に書ける、動かせる！
ここまで紹介してきたように JavaScript は世界的なWebサービスの開発にも使われているので、難しそうだという印象があるかもしれません。しかし、実は初心者にもおすすめのプログラミング言語です。
プログラミング言語は大きく二種類に分けられます。「動的型付言語」と「静的型付言語」です。JavaScript は「動的型付言語」にあたります。
「静的型付言語」は「コンパイル」という手順を踏まないとプログラムを実行することができません。「コンパイル」とは、書いたブログラムを機械にも理解できるように翻訳して実行ファイルを作ることです。この「コンパイル」にはかなり時間がかかることがあります。
しかし JavaScript は「動的型付言語」なのでコンパイルをせず、すぐに実行することができます。プログラムを書くたびにコンパイルが終わるのを待つ必要がないので、手軽に書きなおすことができ、初心者にも優しい仕組みになっています。
また、JavaScript は特別な実行環境を用意しなくてもブラウザさえあれば動かすことができます。なので、他の多くのプログラミング言語のように環境構築で躓く恐れがありません。プログラミング初心者は環境構築で躓く人が多いのですが、JavaScript ならばその心配がないのです。
JavaScriptと一緒に学習するべきものは？
それでは JavaScript を学習する時に一緒に学習するべき技術について紹介していきます。フロントエンド開発とサーバーサイド開発で必要になる技術は異なってきますので、分けて説明を行います。
フロントエンド開発に必須なのは HTML, CSS
フロントエンド開発を行うには、JavaScript の他に HTML, CSS を習得する必要があります。HTML はマークアップ言語と呼ばれる技術で、静的なWebページの作成に使われます。CSS は、そうして作られたWebページに装飾を行う技術です。
フロントエンド開発は、まず HTML と CSS を使って静的なWebページを作成し、そのあと JavaScript を使ってWebページを動的にするという流れで行われます。
また、フロントエンド開発をより極めていく際には jQuery, Vue.js, React などの JavaScript ライブラリやフレームワークについてや、Bootstrap や UIkit などの CSS フレームワークについても学習すると良いでしょう。
サーバーサイド開発には RDBMS, SQL, Web フレームワーク Express
JavaScriptを使ってサーバーサイド開発を行う際には、 RDBMS, SQL いずれかを習得する必要があります。また、Webアプリケーションを作る際にはWebフレームワーク Express を使用すると良いでしょう。
RDBMS とは 関係データベース ( RDB ) 管理システムの事です。現在よく使われているデータベースは関係データベースと言って、エクセルの表のようにテーブル形式で表現できるようにデータを格納しています。RDBMS は関係データベースのデータの更新や参照を行ったり整合性を保ったりするための専用のソフトウェアです。
RDBMS には様々な種類がありますが、学習する際には無料で利用でき、かつ多くの企業で採用されている MySQL や PostgreSQL がおすすめです。また、この二つを含む RDBMS のほとんどでデータベースとのやりとりに SQL という言語を使うので、合わせて学習する必要があります。
Express は JavaScript 実行環境である Node.js のためのWebフレームワークです。WebフレームワークとはWebアプリケーションを作るための枠組みのようなものです。あらかじめ用意された枠組みにオリジナル部分を追記したり上書きしたりすることで、0から作るよりもずっと楽にWebアプリケーションを作ることができます。
WebフレームワークはWebアプリケーション作りには必須と言っても過言ではありません。積極的に学習しましょう。
JavaScript は仕事につながる？転職できる？
JavaScriptを学習して得られる知識が仕事や転職に役立つかが気になる方も多いと思います。結論から言うと、10代から20代前半などの若い方であれば就職・転職ともに有利に行うことができます。20代後半から30代であっても、プログラミング未経験から転職に成功する例はあります。
すでに少し触れたように、JavaScript を使うとWebサービスの UI や UX を向上させることができるため、優れたフロントエンドエンジニアは多くの企業で重宝されます。プログラミング経験が浅かったとしても、将来性や潜在能力から企業に採用されることも少なくありません。
また、あまり多くはないものの、サーバーサイドに Node.js を採用している企業もあるのでサーバーサイドエンジニアとして就職することも可能です。また、チャットボット開発や IoT 開発では Node.js はそこそこ人気なので、それらの開発をしている企業に対しては有利に就職活動ができるでしょう。
なお、フロントエンド開発の経験があると、Web系企業のデザイナーとしても活躍できる可能性があります。JavaScript が書けるデザイナーは多くの IT 企業が求めている人材にあたるので、Webデザイナーを目指している方も JavaScript を学んでおくと、より有利に就職・転職活動ができるでしょう。
