Shoeisha Technology Media

CodeZine(コードジン)

記事種別から探す

開発環境の便利機能で「Wijmo(ウィジモ) 5」開発をパワーアップ

ECMAScript 5に準拠した高速・軽量なJavaScript UIライブラリ「Wijmo 5」の活用 第8回

  • LINEで送る
  • このエントリーをはてなブックマークに追加

 本連載では、グレープシティが提供するJavaScriptライブラリWijmo(ウィジモ)について、サンプルとともに利用例を紹介します。今回はVisual Studioなどの開発環境と組み合わせて、Wijmoを用いた開発をより効率よく行う方法について紹介します。

目次

はじめに

 Wijmo(ウィジモ)は、グレープシティがHTML/JavaScript環境に向けて提供しているJavaScriptライブラリで、WebサイトやWebアプリケーションで活用できるUI部品を利用者に提供します。現行版はECMAScript 5に対応した「Wijmo 5」です。

 Wijmoの利用では、ソースコードはHTMLやJavaScriptなどのプレーンテキストなので、「メモ帳」のようなシンプルなテキストエディタでも編集できます。とはいえ現実的な開発の現場では、何らかの開発環境を利用することになるでしょう。Visual Studioに代表される統合開発環境から、Visual Studio CodeやSublime Textのようなコーディングに特化したテキストエディタまで、目的に応じてさまざまな環境が選択できます。後述のようにWijmo 5は開発環境と組み合わせやすいライブラリで、開発環境が提供する支援機能を活用して開発効率を向上できます。

 本記事ではWijmoを利用した開発で、各種開発環境の支援機能を利用する方法を紹介していきます。

対象読者

  • より軽量/高速なJavaScriptのUI部品を探している方
  • 今までテキストエディタで開発していて効率の悪さを感じていた方
  • 開発環境の支援機能なしでは開発ができないと思っている方

使用する開発環境

 今回記事では以下の開発環境について紹介します。動作OSはWindows 10 64bit版です。

  • Visual Studio Community 2015 Version 14.0.25123.00 Update 2
  • Visual Studio Code 1.1.1
  • WebStorm 2016.1.2
  • Eclipse 4.5.2
  • Sublime Text 3

 また開発環境が依存する以下ライブラリをインストールしています。

  • Node.js v6.2.0 64bit版
  • Java SE 8u92 64bit版

 なおサンプルコードの動作確認はWindows 10上のMicrosoft Edge(25.10586.0.0)で行っています。Wijmo 5の動作対象ブラウザはWijmoのWebサイトを参照してください。

TypeScriptで開発されたWijmo 5は開発環境との相性良好

 APIの候補を表示するコード補完や、変数やメソッドの名前を一括変更できるリファクタリングなど、開発環境の支援機能は開発効率の向上に大きく貢献します。しかしJavaScriptは変数に型定義がなく、開発環境が変数の内容を静的に判断できないため、利用できる支援機能は限定的です。

 そこで型定義が行えるようにJavaScriptを拡張した言語がTypeScriptです。マイクロソフトが提唱した言語なのでVisual Studioで標準サポートされていますが、他の環境でもサポートが広がってきています。TypeScriptからJavaScriptファイルを変換して生成する、いわゆるAltJS言語です。

 TypeScriptを利用すると開発環境が型定義を参照できるため、コード補完やリファクタリングなどの支援機能が利用できます。また既存のJavaScriptライブラリを参照する場合も、ライブラリが持つメソッドやプロパティなどを記述した「型定義ファイル」があれば支援機能が利用できます。Wijmo 5はもともとTypeScriptで開発されており、型定義ファイルも標準で提供されるため、TypeScriptや開発環境との相性がよいライブラリといえます。

 以下では各種開発環境で支援機能を利用してWijmo開発を行う方法を説明します。


  • LINEで送る
  • このエントリーをはてなブックマークに追加

著者プロフィール

  • WINGSプロジェクト  吉川 英一(ヨシカワ エイイチ)

    <WINGSプロジェクトについて> 有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2017年5月時点での登録メンバは52名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂き...

  • 山田 祥寛(ヤマダ ヨシヒロ)

    静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for ASP/ASP.NET。執筆コミュニティ「WINGSプロジェクト」代表。 主な著書に「入門シリーズ(サーバサイドAjax/XMLD...

バックナンバー

連載:ECMAScript 5に準拠した高速・軽量なJavaScript UIライブラリ「Wijmo 5」の活用

もっと読む

All contents copyright © 2005-2017 Shoeisha Co., Ltd. All rights reserved. ver.1.5