次の方法で共有

もっと Web 開発を簡単に ～ 復活！？ WebMatrix ～

  • [アーティクル]

さてさて、 IIS Express, SQL Server compact Edition, ASP.NET "Razor" と、新しい Web サイト構築のためのツールやテクノロジーをご紹介してきましたが、これらを統合的に使って Web サイトを作成するためのまったく新しい無償ツール "WebMatrix" (Beta) が、とうとう ScotGu's Blog でアナウンスとなりました。（待ってました！）

Introducing WebMatrix
https://weblogs.asp.net/scottgu/archive/2010/07/06/introducing-webmatrix.aspx

QuickStart

図１ WebMatrix

簡単に言ってしまうと、ASP.NET "Razor", IIS Express, SQL CE 等をベースとした軽量な Web サイトを構築・管理するためのツールですが、加えて、様々なオープンソース (OSS) Web アプリケーションを使った Web サイト構築を簡単に行うための Web Gallery の機能も持ち合わせています。WebMatrix を使って ASP.NET もしくは PHP ベースの CMS を構成＆カスタマイズして Web サーバーへ配置することができます。

WebGallery

図２ Web Gallery

ScottGu's Blog では、WebMatrix で BlogEngine.NET ベースの Web サイト構築例が詳しく記載されていますのでご参照ください。

 

● WebMatrix で Web サイトを作ってみる

それでは実際に WebMatrix を使って簡単な Web サイトを作ってみましょう。
Site From Template をクリックするとデフォルトで用意されている Web サイトのテンプレートが一覧表示されます。

SiteFromTemplate

図３ Site from Template

ひとまず、ここで “Starter Site” をクリックしてみましょう。Starter Site という名前の Web サイトが作成され、図 4 の表示になります。

StarterSite

図４ Starter Site の作成

このままで、リボンツールバーの Run ボタンをクリックするとデフォルトのブラウザで Web サイトが実行されます。

Run

図５ Starter Site の実行

どこかで見たことのある Web サイトが表示されました。そうですね、ASP.NET MVC プロジェクトを作成したことのある方なら見覚えのあるサイトデザインだと思います。ただし、これは ASP.NET MVC アプリケーションではありません。ASP.NET "Razor" で記述されている Web ページになります。

図４の左下の Files をクリックすると、サイト構成とファイル群を見ることができます。

Files

図５ Starter Site のサイト構成とファイル群

ここで、拡張子 .cshtml のファイルが "Razor" で記述されている Web ページのファイルです。Default.cshtml をダブルクリックすると、WebMatrix 内でソースコードを編集することができます。試しに、Default.cshtml を図６のように編集してみます。

Edit_P

図６ Default.cshtml

Run ボタンを押してブラウザで実行すると、現在時刻が表示されるようになりました。

Edit2_p

図７ 編集後の Default.cshtml の表示 

このように、WebMatrix で cshtml ファイルを編集することもできます。残念ながらインテリセンスなどには対応していませんが、例えばこれまでテキストエディタを使って HTML や PHP コードを記述していた Web 製作者の方などには、軽量なサイト作成ツールとしてとても便利なツールになるのではないでしょうか。

さらに、リボンツールバーにある Visual Studio のボタンから Visual Studio 2010 や 無償版の Visual Web Developer 2010 Express を起動して、簡単に Visual Studio の ASP.NET アプリケーションプロジェクトとして開発を進めることができるようになる予定です。また、ASP.NET MVC の次期バージョンで cshtml を ViewEngine として使えるようにもなる予定です。

 

● Twitter 検索パネルを使う

面白い機能として、"Razor" では Web ヘルパー機能として Twitter 検索パネルを Web ページに簡単に埋め込むこともできるようになっています。

@Twitter.Search(“検索ワード”)

と cshtml に記述するだけです。楽しいですね♪

EditTwitterPanel_p

図７ Web ヘルパー “Twitter 検索パネル” を使う 

RunTwitterPanel

図８ Twitter 検索パネル実行結果

そのほか、SQL Server Compact の Database の作成や管理ももちろん WebMatrix で可能です。

Database

図９ SQL CE Database (.sdf) の作成と管理

さらに、右下の Reports から、作成している Web サイトの SEO レポートを見ることもできます。

SEO

図 １０ SEO レポート

そして、WebMatrix には、完成した Web サイトを簡単にインターネット上に配置、公開する機能も用意されています。WebMatrix に対応したホスティング環境にも簡単に配置できるのは魅力です。（日本での対応ホスティングも整備していく予定です）。またこれはあくまでも個人的な希望で、実際にどうなるかは全くの未定ですが Windows Azure への展開にも期待したいところです。

Deploy

図 １１ ホスティング環境への配置

 

ということで、今後は徐々にですが、WebMatrix の日本語情報も整備して皆様にご提供していく予定です。ご期待ください。

もう待ちきれない！今すぐに試したい！というみなさんは、まずは下記のサイトをご参照して WebMatrix をインストールしていろいろと試してみていただければと思います。

● WebMatrix インストール

Microsoft Web Platform – WebMatrix
https://www.microsoft.com/web/webmatrix/
※ Web Platform Installer 3.0 Beta (Web PI 3.0 Beta) から WebMatrix をインストールすることができます。

● 関連ドキュメント (英語)

WebMatrix on asp.net
https://www.asp.net/webmatrix

WebMatrix Beta on iis.net
https://learn.iis.net/page.aspx/855/webmatrix-beta/

 

※ WebMatrix Beta の起動時のエラーについて

WebMatrix Beta では、一部環境によっては起動時にエラーになる場合が確認されています。

errorerror2

お手数ですが、Visual Studio がインストールしてある場合は、「キャンセル」を押さずに我慢して待つと、デバッグするか否かのダイアログが表示されるので、「デバッグ」をクリックしてから Visual Studio にアタッチして、VS のデバッガで「継続」実行してください。

 

※ 名称についての混乱

以前から Visual Studio を使って Web アプリケーション開発を行っていた方の中には、昔々にリリースされていた ASP.NET Web Matrix (今でいう Visual Web Developer Express の前身) と呼ばれる無償の Web アプリケーション開発ツールをご存知の方も多いかと思います。同じ Matrix という名前になっているので混同してしまうかもしれませんが、今回の WebMatrix は全く別物の新しいツールになります。私も、初めて WebMatrix の名前を聞いたときは、昔の ASP.NET Web Matrix を真っ先に思い出しました。なぜ同じ名前を使ったかは不明ですが、マイクロソフトの Web プラットフォームの再出発(笑)の気合いを感じ取っていただけると、とてもうれしいです。まさに「マトリックス・リローデッド (Matrix Reloaded) 」ですね！

ちなみに WebMatrix の名称が決定する前のマイクロソフト社内での呼び名（コードネーム）は xxxxx でした・・・ふふふ。現時点では秘密にしておきましょう。Public にできる時が来たらお知らせします。

 

※ WebMatrix をお使いいただきたい皆様

もちろん、すべてのエンジニア、開発者、Web 制作者、デザイナーなどなど、多くの方々にご使用いただきたいと思っています。ただ、その中でも特にお使いいただきたい皆様は、

  • Classic ASP (Active Server Pages) を使ったサイトのアップグレードを検討されている皆様
  • HTML ベースの静的な Web サイトを作成、および管理運用されている方々で、簡単な機能アップを検討されている皆様や、将来的には ASP.NET MVC への移行を検討している皆様
  • Visual Studio & ASP.NET ベースの高機能な Web アプリケーション開発までは不要もしくは習得する時間がない等の理由で ASP.NET の採用を控えている皆様
  • これから Web 制作などを始められる方々で、言語やフレームワークの選択 (ASP.NET, PHP, Perl, Ruby on Rails などなど) に迷っている皆様

です。

Web 開発をもっとシンプルで簡単にしたいという思いから始まったプロジェクトで、マイクロソフト全社をあげて皆様の Web サイト制作をサポートしていきたいと思っています。

WebMatrix お楽しみください！

Comments

  • Anonymous
    July 18, 2010
    is this web site availible in English?

  • Anonymous
    July 19, 2010
    Thank you for the comment. I'm afraid I have no plan to write this post in English. If you need Technical Contents of  WebMatrix, please see  the "Introducing WebMatrix" on ScottGu's Blog. weblogs.asp.net/.../introducing-webmatrix.aspx