«« プロジェクトの情報共有に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

カテゴリ

最近のエントリー

最近掲載した画像
  • 大人の麻しん対策としてMMRワクチンを予防接種してきた
  • 親知らずのむし歯を治療して合わせて神経も抜いてもらいました
  • 先日Doll's Mythとガールズアートコレクション2019へ行ってきました!
  • 先日Doll's Mythとガールズアートコレクション2019へ行ってきました!
  • 先日Doll's Mythとガールズアートコレクション2019へ行ってきました!
  • 先日Doll's Mythとガールズアートコレクション2019へ行ってきました!
  • 先日Doll's Mythとガールズアートコレクション2019へ行ってきました!
  • 先日Doll's Mythとガールズアートコレクション2019へ行ってきました!
  • 先日Doll's Mythとガールズアートコレクション2019へ行ってきました!
  • 先日Doll's Mythとガールズアートコレクション2019へ行ってきました!
  • むし歯にはとりあえずロキソニン?
  • サーバーレスなサーバー(特にAWS Lambda)を調べてみた
  • TwitterのフィードをJSONに変換するcall_twitterをGitHubで公開しました
  • 3DSのわがままファッションGIRLSMODEよくばり宣言!は女の子画像が好きなら男性でも楽しめるかも
  • 3DSのわがままファッションGIRLSMODEよくばり宣言!は女の子画像が好きなら男性でも楽しめるかも
  • 3DSのわがままファッションGIRLSMODEよくばり宣言!は女の子画像が好きなら男性でも楽しめるかも
  • 3DSのわがままファッションGIRLSMODEよくばり宣言!は女の子画像が好きなら男性でも楽しめるかも

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