2017年4月17日シェアツイートシェアブックマークHTMLやCSSのような言語を学んでいくと、どこかのタイミングで「JavaScript」というワードを目にすることになるでしょう。今回は、そんなJavaScriptについて、基本的な概要から具体的な活用例までを解説していきます。Webについて、HTMLやCSSを通して学んだら、次はJavaScriptに手を出してみるのもよいでしょう。それでは、はじめていきますね。No.1のCodeCampが運営するプログラミング未経験の方のための学習メディアですCodeCampとは?(受講生体験記)「エンジニアは女性のキャリアとして魅力的」未経験からの転職体験記リモートワーク×多拠点居住の新しい生き方を実現する。目次そもそもJavaScriptとは?JavaScriptとJavaは別の言語!JavaScriptの特徴とは?様々なものをつくることができる初心者でも学びやすいオブジェクト指向が身につくJavaScriptの使い道とは?Webサイト開発Webアプリ開発ゲーム開発スマホアプリ開発JavaScriptのフレームワークとは?AngularJSReact.jsBackbone.jsまとめそもそもJavaScriptとは?実は、全ての人間がJavaScriptのヘビーユーザーであり、知らぬ間に日々JavaScriptに触れていることを知っていましたか?スマートフォンやパソコン、最新の車、スマートテレビなど、ほぼ全てのデバイスを通して、私たちはJavaScriptを利用しています。生活に欠かせないものと言っても過言ではないでしょう。いえ、これだけでは結局「JavaScriptは何なのか」がわからずじまいですよね。簡単に説明すると、JavaScriptとはWebブラウザとWebサイト、Webサービスとのやりとりをスムーズにするためのプログラミング言語です。HTMLとCSSだけでは動きのない、静的なものしか作ることができませんが、そこにJavaScriptを加えることで、動きのある、動的なものを作ることが可能です。具体的には、クリックするとポップアップ(最前面に飛び出てくるウィンドウ)が出るようにできたり、リアルタイムで動くグラフを作ることができたりします。サイトだけでなくアプリ開発にも利用されており、FacebookやAirbnbなどが使用している言語でもあります。JavaScriptとJavaは別の言語!注意しておきたいのが、JavaScriptとJavaは似ている言葉ですが全くの別物だということです。親戚のようなものですらありません。Javaについて簡単に説明しておくと、オラクルという会社が提供している言語で、PCアプリやAndroidの開発などに用いられています。確かによく見れば構文が似ている点もありますが、JavaScriptとJavaは全くの別物です。Javaと混同しないように、JavaScriptはJSと略されることが多いですね。JavaScriptの特徴とは?ここからは、JavaScriptにはどんな特徴があるのかを説明していきます。様々なものをつくることができるWebサイト上で動く機能を作ることができるのはもちろんですが、その他にもゲームやツール、さらにはChromeやFirefoxの拡張機能、スマホアプリなんかも作れてしまいます。その理由はJavaScriptに「クロスプラットフォーム」という考え方をもったツールがたくさんあることです。プラットフォームがなんであれ、そこに最適化して、どこでも同じ動きをさせることができるのがJavaScriptの特徴です。初心者でも学びやすいJavaScriptは「ブラウザ(GoogleChromeやInternetExplorerなど)」と「テキストエディタ(メモ帳など)」の2つを用意するだけで動かすことが可能な言語です。世界中で沢山の人が使っている言語ですから、それだけ参照できる資料が大量にありますよね。これらの理由から、JavaScriptは初心者でも比較的学びやすい言語となっています。効率的に学ぶのであれば、最初にHTMLとCSSを習得しておくことがおすすめです。オブジェクト指向が身につく簡単に言ってしまえば、オブジェクト指向とはわかりやすいプログラミングをすることができるようになるものです。オブジェクト指向について説明すると、オブジェクト、つまりモノを組み立てていくというプログラミングの考え方と言うことができます。オブジェクト指向は概念ですので、その理解にはやや時間がかかりますが、習得によって開発の効率を上げることができるでしょう。JavaScriptの使い道とは?具体的なJavaScriptの使い道は、以下のようなものになります。Webサイト開発Webアプリ開発ゲーム開発スマホアプリ開発Webサイト開発Webサイトを作る時に、JavaScriptはいたるところで活躍するでしょう。複数枚の写真をスライド形式で表示したいときに、JavaScriptを使ってそれを表現することができます。Webアプリ開発Webアプリを開発したいときにも、JavaScriptは有効です。Reactというライブラリを自社で開発したFacebookは、WebアプリにJavaScriptを使用しています。画像出典:facebookゲーム開発JavaScriptでは、ゲームを開発することだってできます。おなじみのテトリスを、HTMLとJavaScriptを用いることで作ることが可能です。スマホアプリ開発JavaScriptを書くことができれば、スマホアプリの開発も可能です。この「flavabeats」というアプリは、JavaScriptで書かれているリズムゲームですね。画像出典:flavabeatsJavaScriptのフレームワークとは?JavaScriptだけではなく、各言語に用意されている土台のようなもの。それがフレームワークです。フレームワークを直訳すると「枠組み」ですが、「この通りに作ればうまくいく」と考えられた土台だと思ってください。ある程度の道筋をフレームワークに示してもらうことで、初心者でも比較的ラクに開発を行うことができるものがフレームワークですね。ここからは、JavaScriptの有名フレームワークを紹介していきます。AngularJS画像出典:AngularJS企業向けのシステムを作る際に用いられることの多いフレームワークで、複雑なWebアプリを作るときに用いられています。AppleやGoogleなど、世界中で知られている超有名企業がこのAngularJSを使って開発を行っていますね。学習コストは高いですが、これさえあれば大半のことはできるくらい、充実した機能を持っているフレームワークでしょう。React.js画像出典:React.js2013年にリリースされた、新しめのフレームワークがこちらのReact.jsです。FacebookやInstagram、Airbnbなど、こちらの有名な企業が使っているフレームワークといえますね。今までのコーディング手法よりも、より簡潔でわかりやすく記述できる点がメリットです。Backbone.js画像出典:backbonejs制約が少なく、自由度の高いプログラミングをすることができるフレームワークが、こちらのBackbone.jsです。こちらもまた、TwitterやHulu、Pinterestなどの有名で大規模なサービスに使用されています。初期の学習コストが低いので、JavaScriptフレームワークの入門としても使えますね。CodeCamp提供のWebマスターコース当メディアを運営しているCodeCampではWebマスターコースを現役エンジニアのマンツーマンレッスンという形で提供しています。実際にWebサービスをを開発するのでポートフォリオとしても使用できる無料レッスン受講後の申し込みで10,000円クーポンをプレゼントしています!ぜひお試しください。\Webサイト担当者としてのスキルが身に付く/CodeCampの無料体験はこちら▶︎無料体験レッスンの申し込みはスマフォで1分で完了!まとめJavaScriptの大まかな説明とその使い道、フレームワークについて解説しました。説明だけではなんとも言えないと思うので、ぜひ一度コードを書いてみることをおすすめします。使い古した言葉ですが、「習うより慣れろ」です。便利で何にでも使うことができる言語なので、ぜひがんばって習得してみてはいかがでしょうか。HTML/CSSを学んだ後にJavaScriptを学習する方は多いのでしょうか?ここからは一気に難易度が上がる言語になってきます。家事も仕事もプログラミングも。2020年版】社会人でも通いやすいプログラミング教室5選|選び方の基準も解説プログラミング学習プログラミングスクール・サービス「エンジニアは女性のキャリアとして魅力的」モノづくり好き理系女子がWebエンジニアへ転職するまで受講生インタビュープログラミング未経験で介護師からエンジニアへ。家事も仕事もプログラミングも。受講生インタビュープログラミング習得後、フリーランスに転身。受講生インタビューフリーランス塾講師からエンジニアへ26才で転職。先生の支えがあって成長できました。学習ガイドtwitterLINE。