«« プロジェクトの情報共有にExcelは正直扱いづらい・・・そこで例えばCandyCane | さくら咲きワクワクしますね! »»

LiveweaveとJSHintでサクっとJavaScriptコーディング

2014年3月21日

このエントリーをはてなブックマークに追加
どこでもサクッとしかもバグが少ないJavascriptを構築するのにお勧めのWebサービスとしてLiveweaveとJSHintを紹介します。


自分の環境でない時に軽くコードを書いてみたい場合や、作ってみたコードが本当に動くかどうか不安なのでさくっとコードを試してみたいときなどに便利なのがWebアプリの紹介です。

私はHTML/CSS/JavaScriptをどんな環境でもすぐにテストできるLiveweaveと、軽くエラーチェックできるJSHintを便利に使わせてもらっています。

Liveweave は見ての通りHTML/CSS/Javascriptの入力欄とその結果枠で構成されています。

liveweaveの利用例

入力欄ではコードアシストと文法チェックが行われ、名前の通りライブ=リアルタイムで結果枠に反映されるのがいいですね。
Javascriptこんな書き方で通るのかな?と疑問を持った時に手軽にテスト出来るのが面白いです。
ただ注意して欲しいのが、for文のテストをしようとfor(;;)とか打ち込むと、ご想像の通りとんでもない事になるので注意。
for文が絡むコードをテストするときは、事前にエディタで組んでおいてコピペするか、もしくは(上のスクリーンショットでは隠れてしまっていますが)Live Modeスイッチをオフにしておくのが良いでしょう。


さて、コレで取りあえずは動くかどうかのJavaScript検証は出来るのですがー動けばいいと言うのではなく、簡単に分かる無駄な処理(関数内で同じ変数を再宣言する)とかバグの温床になりそうな箇所(例えば一致しているかの判定に===ではなく==を使う)などを洗い出してくれるのがJSHintです。

問題になってそうなところをズラッと一覧でだしてくれると、確かにここは言われる通りかも、と言うかエラー文を検索してみるとこんなスマートな書き方もあるのか!とハッとさせられました(自分の腕がアレだと言う話でもありますが)。

ということで、どこでもサクッとしかもバグが少ないJavascriptを構築するのにLiveweaveJSHintを押します。


投稿者 kuze : 2014年3月21日 23:16


■このエントリーに関連した記事

■「実用ソフト&サイト」カテゴリの最新記事

«« プロジェクトの情報共有にExcelは正直扱いづらい・・・そこで例えばCandyCane | さくら咲きワクワクしますね! »»


自己紹介
PHPやVBによるコーディングやシステムエンジニアを仕事にしています。
主にiPhoneアプリの紹介やWeb開発などのPC系の話題と、アニメやゲームなどのサブカルな話題を取り扱っています。

[PR]

instagram

カテゴリ

最近のエントリー

最近掲載した画像
  • Surface go購入しました、ちょっとしたコードを弄ったりお絵かきに期待!
  • Surface go購入しました、ちょっとしたコードを弄ったりお絵かきに期待!
  • Surface go購入しました、ちょっとしたコードを弄ったりお絵かきに期待!
  • JAPANGLEの特撮爆破と、はりきり体育ノ介の博士オーバーアクションが見応えあり
  • Super Audio CDはクソ、(最近の)Macで再生できねー!
  • 未来のミライはタイトル&予告編詐欺だった(ネタバレ)
  • 未来のミライはタイトル&予告編詐欺だった(ネタバレ)
  • 先日ドメインとサーバーを引っ越しました
  • 富士山でお鉢巡りをしてきた
  • 富士山でお鉢巡りをしてきた
  • 富士山でお鉢巡りをしてきた
  • 富士山でお鉢巡りをしてきた
  • ニンジャバットマンはとにかくクドい熱血系お馬鹿映画だった(褒め言葉・ネタバレ)

RSS
更新情報はRSSをご利用下さい