Web上でJavaScriptを開発する
お久しぶりのエントリです。
またまた長らくサボってしまいました。
自社で*1Advent Calendarをやろうという事になりまして、私も参加する事にしました。
本来は12月にやるものですが、細かい事は気にしないのが我が社のスタイルです。
メンバーはベテラン、中堅(私は多分ここ)、若手の計6人で、曜日(土曜日はお休み)で担当を決めています。
技術の勉強もそうですが、文章を書く勉強にもなるので、私的には良い試みだと思っています。
そして、私の担当は火曜日なのにいきなり遅れてすいません。
今回のテーマは「JavaScript」です。
昨日(もう一昨日)は、id:yamasahi先輩の「PhantomJS入門 スクリーンキャプチャを撮るまで」です。
明日は同期のid:koizussさんです。
今回は題名の通り、開発環境について書きます。
JavaScriptの開発環境は、みなさん思い思いのスタイルがあると思います。
Vim、Emacs、IDE(Eclipse、Aptana、WebStorm)等、考えるとキリがないくらい多種多様です。
今回はその中でもWeb上で開発できるサービスを紹介したいと思います。
jsFiddle (http://jsfiddle.net/)
作者はPiotr Zalewa
主な特徴は以下になります。
- アカウントなしでサービスが利用できる
- 組み込みライブラリが充実している
- 独自に作成したJavaScriptやCSSを追加できる
- 作成したスクリプトを保存できる
- HTML/CSS/JavaScript/出力を4分割した画面でそれぞれ作業できる
- *2JSLintの構文チェック機能が使える
- インデント機能がある
- *3weinreによるデバッグ機能が使える
JS Bin (http://jsbin.com/)
作者はRemy Sharp
主な特徴は以下になります。
- アカウントなしでサービスが利用できる
- 組み込みライブラリが充実している
- 作成したスクリプトを保存できる
- HTML/CSS/JavaScript/コンソール/出力を5分割した画面でそれぞれ作業できる
- JSLintの構文チェック機能が使える
jsdo.it (http://jsdo.it/)
作者は株式会社カヤック
主な特徴は以下になります。
- OpenIDとOAuthに対応している
- 組み込みライブラリが充実している
- 独自に作成したJavaScriptやCSSを追加できる
- 作成したスクリプトを保存できる
- HTML/CSS/JavaScriptをタブで切り替えて開発できる
- モバイル向けプレビュー機能がある
どのサービスもWeb上でJavaScriptの開発、デバッグができ、
サービスごとに日本語に対応していたり、モバイル向けの機能が充実していたりと強みがあります。
サクッと開発してコードをアップして、共有したい時などは便利かなと思います。
Windows 7にXP風のスタートメニューを追加して、「上へ」ボタンを追加して、アドレスバーの表示をデフォルトでパスにする
Windows 7にはWindows XPで使われていたスタートメニューがありません。
僕は以前のUIの方が使い慣れているので、今回はスタートメニューを追加することにします。
手順は以下になります。
- 「Classic Shell」というツールをインストールします。
- インストール後に、左下のWindowsマークボタンを押下します。
- レイアウト選択のダイアログが開くのでWindows XPを選択して、「OK」ボタンを押下します。
他にもクラシックスタイルやVistaスタイルなども選択することができます。
このツールには「Classic Explorer」というツールも同梱されていて、
レイアウトを色々設定変更することができます。
そこで、今回は僕的に必須の「上へ」ボタンの追加と、アドレスバーの表示をデフォルトでパス表示にします。
手順は以下になります。
- スタートメニューから「Classic Shell」→ 「Classic Explorer Settings」をクリックします。
- 「Disable breadcrumbs」のチェックを入れる → アドレスバーをデフォルトでパス表示にします。
- 「Show Up button」の「After Back/Forward」のチェックを入れる → 「上へ」ボタンを追加します。
- 上記の設定後「OK」ボタンを押下します。
これでエクスプローラーを再起動すると以下のような感じになります。
他にもツールバーが以前のように表示されたので、
ここから「フォルダーオプション」の設定を変更することもできます。
何回かに渡ってWindows 7の設定を変更しまくってきましたが、
これでかなりXP風なWindows 7になって使いやすくなりました。
個人的には、F2キーでファイル名の全選択できるようにしたかったんですけど、
お忍びリネームとかのツールを使ってもうまくいきませんでした。
それでも、結構満足な仕上がりになりました。よかったよかった。
Windows 7でタスクバーをXP or Vista風にする
Windows 7ではタスクバーのレイアウトがXPやVistaから大きく変更されています。
本来はこのスタイルに慣れるべきなのですが、
僕的には以前のレイアウトの方が、慣れていて好きなので変更することにしました。
Windows XPのサポートは来年の4月に終わってしまいますが気にしません。
手順は以下になります。
1. タスクバーのアイコン(IE等)を右クリックして「タスクバーにこのプログラムを表示しない」をクリックします。
※ この操作をすべてのアイコンに対して行い、タスクバーに何も表示されていない状態にします。
2. タスクバーを右クリックして、「プロパティ」をクリックします。
3. 「小さいアイコンを使う」にチェックして、「タスクバーのボタン」の「結合しない」をクリックします。
これでアイコンと詳細情報が表示されたXP風のタスクバーが表示されます。
Windows 7でタスクバーにクイック起動を追加する
Windows 7ではタスクバーにクイック起動がありません。
僕はよく使うアプリはランチャーで起動して、
たまに使うようなアプリはクイック起動に登録しているので、ないとちょっと困ります。
そこで、Windows 7にクイック起動を追加することにしました。
手順は以下になります。
1. タスクバーを右クリックして「ツールバー」→「新規ツールバー」をクリックします。
2. 「フォルダーの選択」が表示されるので、以下を入力して「フォルダーの選択」をクリックします。
C:\Users\ユーザー名\AppData\Roaming\Microsoft\Internet Explorer\Quick Launch
3. ツールバーの固定を解除して「Quick Launch」をドラッグして左端に移動します。
4. 「Quick Launch」を右クリックして「ボタン名の表示」と「タイトルの表示」のチェックを外します。
これでクイック起動が使えるようになりました。
Windows 7でエクスプローラーのナビゲーションウィンドウをツリー表示にする
Windows XPではエクスプローラーのナビゲーションウィンドウは、デフォルトでツリー表示になっています。
しかし、Windows 7ではツリー表示ではなくブロックで表示されています。
各フォルダの左三角をクリックすると展開して表示されますが、
毎回クリックするのはちょっと面倒です。
そこで今回はデフォルトでツリー表示になるように設定変更します。
手順は以下になります。
- エクスプローラーを開き、左上の「整理」→「フォルダーと検索のオプション」をクリックします。
- 「フォルダーオプション」の「全般」タブをクリックします。
- 「ナビゲーションウィンドウ」の「自動的に現在のフォルダーまで展開する」にチェックを入れます。
これで自動的に開いた階層に応じて展開されるようになりました。
Windows 7でアプリとファイルの拡張子を関連づける
Windows XPではアプリとファイルの拡張子の関連付けは、「フォルダーオプション」からできました。
しかし、Windows 7では設定できる場所が変わっています。
手順は以下になります。
この画面からアプリとファイルの拡張子の関連付けを行います。
以下の例は「.txt」の関連付けをデフォルトの「メモ帳」から「サクラエディタ」に変更しています。
ちなみにコマンドプロンプトからでも変更できたりします。
手順は以下になります。
- 「assoc 拡張子」でファイルタイプを確認します。
- 「ftype ファイルタイプ」で関連付いているプログラムを確認します。
- 「ftype ファイルタイプ=関連付けるプログラムのパス %1」で関連付けるプログラムを変更します。
まーコマンドプロンプトはマニアックなので、知らなくてもいいですけどねw