Vue.js

この記事はVue.jsについて解説した記事です。会話形式のやさしい文章で「Vue.js」の用語のイメージを紹介した後に、採用に役立つVue.jsの知識を解説しています。

1分で分かる!Vue.jsとは?

遅い…!遅すぎる…!!プンプン…!!

ことりん君、待ち合わせか何か??そんなに怒ってどうしたの??

あ、ジャバ―ド先生!!ちょっと聞いてよ!!このWebサイトがとっっっっても遅くてさぁ…!!

あぁ、だからイライラしてたんだね。

そうなんだよぉぉぉ!他のWebサイトはサクサク見れるのにさぁ…!!

Webサイトって表示に時間がかかると、ユーザーは待ちきれなくなって別のWebサイトに流れちゃうからね。GoogleもWebサイトが表示されるまでの時間を、検索結果の順位にも取り入れているという話もあるんだ。

あぁ、イライラしてるのはきっとボクだけじゃないだね…。でもさ、ちょっと疑問なんだけどWebサイトってどうすれば速くなるの??

そうだねぇ。Webサイトの表示速度って色々な要素の影響を受けるからね。インターネットの速度とかパソコンの性能とかね。最近の流行だとSPA(エス・ピー・エー)っていう手法があるよ。

SPA…。週刊誌…じゃないよね…。

SPAはSingle Page Applicationの略だよ。通常のWebサイトはHTMLっていう言語で画面を作る必要があるんだ。たとえば、50画面あったら50枚のWebページをHTMLでつくるイメージだね。で、Web画面を表示するときは、サーバーからまるまる1ページのデータをもらってくる必要があるんだ。その1ページに画像や項目がたくさんあると、その分だけデータ量も増えるんだ。データ量は大きければ大きいほど、表示に時間がかかっちゃうのは説明するまでもないよね。

ボクたちが見ているWebページって、1ページずつサーバーってところからデータをもらって表示しているのかぁ。でもSPAだと何で速いの??

SPAっていう方式は簡単にいうと、Webページの中で変更する必要がある部分だけをJavaScriptで取得して、画面の一部を更新するんだ。だからWebページのデータをまるごとサーバーからもらうっていう処理がなくなるんだ!

必要なところを必要なだけか!たしかに無駄がなくて良い感じだね!でも、なんか開発するのが結構難しそうだよね…

そんなことないよ!Vue.js(ビュー・ジェイエス)をつかえばSPAも結構簡単につくれちゃうんだ!

また新しいのがでてきた!!Vue.jsってなに??

Vue.jsっていうのはJavaScriptのフレームワークだよ!JavaScriptのフレームワークって結構いろいろあるんだけど、いま最も勢いがあるのがVue.jsだね!

ふむふむ…。もっともっとVue.jsが流行れば、ボクがイライラすることもなくなるってことだね!

そうなるといいね!

Vue.jsとは?採用に役立つVue.jsの基礎知識

Vue.jsとは、JavaScriptのフレームワークです。Vue.jsを用いることで、Webアプリケーション(特にフロントエンド)の開発効率をアップすることができます。

一般的にフレームワークというものは、他のフレームワークと共存することはできないことが多いです。たとえば、PHPLaravelCakePHPなどのようなフレームワークは、どちらかを導入することはできますが、両方を導入するということはできません。そのため、基本的には開発時点で導入を決定したフレームワークに沿って、以降も開発を続ける必要があります。

一方、Vue.jsは公式サイトの言葉を借りれば「プログレッシブフレームワーク」です。プログレッシブとは「徐々に」といった意味を持っています。つまり、Vue.jsはほかのフレームワークが導入されている状態でも、部分的にVue.jsを導入することが可能となっています。フレームワークの乗せ換えというのは大がかりな作業になりがちですが、Vue.jsであれば文字通り「徐々に」対応することが可能なのです。

Vue.jsを使うエンジニア

Vue.jsを使うエンジニアといえば、フロントエンドエンジニアです。Vue.jsはフロントエンドを開発するためのプログラミング言語であるJavaScriptのフレームワークの1つです。そのため、フロントエンドエンジニアなどのようなWebアプリケーションを開発するエンジニアが使用する技術です。

Vue.jsを使うエンジニアの特徴と在籍業界

Vue.jsは、JavaScriptのフレームワークの中でも比較的誕生して間もない部類に入ります。そのため、現時点でVue.jsをマスターしているということは、最新技術のキャッチアップをきちんと行っているエンジニア(または最新技術を好む企業やクライアントの元で働いている)である可能性が高いです。なお、在籍業界としてはWeb業界が多いです。

求人のポイント

求人を作成する時は、下記の内容を求人に入れるとよいです。

1システム(サービス)の詳細
※特にそのシステム(サービス)をなぜ作っているのかを熱量をもって記載する。
2開発環境
3現在のエンジニア組織の体制
4現行システムの課題と募集の背景
5求められる業務と期待値
6エンジニアとしてのスキルアップ支援制度の有無と詳細
7エンジニアチーム内での相互成長のための仕組み(勉強会やLT会など)の有無と詳細
8選考フロー
9待遇
10キャリアパス

豆知識

Vue.jsの開発者

 Vue.jsは、中国出身でアメリカ在住のエンジニアであるエヴァン・ヨー氏によって開発されました。彼はGoogleでAngularJSを使用していましたが、そこから更に便利なものを考えたことがVue.jsの開発につながったそうです。現在、Vue.jsは世界中のエンジニアから支持されているグローバルなJavascriptフレームワークに成長しています。

Vue.jsの特徴

Vue.jsはその他にも様々な特徴を有しています。簡単にご紹介しておきます。

  • プロジェクトの規模に関係なく導入できる
  • 学習コストが低い
  • 拡張性・再利用性が高い

Vue.jsはプロジェクトの規模によらず、高い効果を発揮します。大規模プロジェクトであっても個人開発用であっても、Vue.jsの導入を検討しましょう。

また、Vue.jsは学習コストが低いことでも有名です。JavaScriptにはさまざまなフレームワークがあります。中には非常に強力であるものの、エンジニアが使えるようになるまでに、多くの勉強時間が必要になるものもあるのです。一方、Vue.jsは比較的簡単に学習できるため、Vue.js未経験者であっても、早期の立ち上がりが期待できます。

また、Vue.jsは拡張性や再利用性に富んでいます。よく使用するソースはVue.jsに定義しておけば、別のシーンで再利用することができます。

Vue.js関連のイベント 

Vue.js関連のイベントとしては、Vue Fes Japanがあります。

https://vuefes.jp/2020/

※ 直近数年は、天候や新型コロナの影響を受け、開催が見送りとなっています。

また、世界に目を向けるとオランダの首都であるアムステルダムでVuejs Amsterdamという大規模なカンファレンスが開催されます。

https://vuejs.amsterdam/

関連記事

  1. Kotlin

  2. XML

  3. Scala

  4. Docker

  5. CSS

  6. frontend-engineer

    フロントエンドエンジニア