ちょっとしたHTML・CSS・JavaScriptをテストしたいときに重宝している無料オンラインツール

先月からHTMLとCSSをイジる機会があり、特にコーディングなどを商売道具としているわけでもないので、愛用の編集ツールなどはありませんでした。

1980年代は、ご存知「ポームページビルダー」を購入して使用していましたが、ブログが出現してからというもの一切、手に入れることがなくなったのです。

それ以来、無料ブログを皮きりに、MT(ムーバブルタイプ)を経てWordPress一択となりました。

ただ、ちっょとしたソースいじりも必要になったりするので正直なところ、都合の良いツールを探していたのです。

結果、満足できるツールがありましたので紹介したいと思います。

お気に入りツール

ゴリゴリのコーディングではなくて、ソースの一部をこちょこちょイジるための環境が欲しい場合など、実に都合の良い無料ツールと出会いました。

それが、Liveweave(ライブウィーブ)です。

About Liveweave.com

このページは英語表記なので、長文読解が苦手な方は、ぜひ和訳してごらんください。

筆者は読まなくても直感で使い倒したら、何となく理解できましたので、家電を購入しても説明書を読まないタイプは、さっさと触ったほうが良いかもです。

HTML、CSS、JavaScript、Previewの画面が4等分に配置されている独読な初見にはたまげましたが、慣れてしまえばどうということはありません。

レイアウトはいくつかパターンがあるので、好みで変えられます。

タグを忘れても大丈夫

ソースコードを書くのが久ぶりだったので、書き方をほぼ忘れていましたが、オートコンプリート機能が充実しているお陰で、段々と記憶がよみがえってきました。

• ああ、「.class」ってあったな・・・
• そうそう、「;」で締めるんだった
• インラインは使えたかな?

そういった遠い記憶を呼び戻すには十分の役割を果たしています。

ちなみに、

• HTML5
• CSS3

に準拠していますので、シャレオツなウェブサイトをデザインできますよ。

オンラインプレビューが軽い

最も助かったのはオンラインプレビューの軽さです。

すぐに反映されるので確認作業も苦労しません。

良いサーバー使ってるんでしょうか。

完全無料で会員登録がおすすめ

言い忘れていましたが完全無料で使えます。

さらに会員登録しておけば、テストした毎に保存可能です。

例えば、JavaScriptを学習し始めた場合に、それぞれの課題ごとに保存しておくとかすると、後で復習なり見直しなりが便利になります。

インストール型ではなくオンラインツールなので、ブラウザのブックマークを同期させていれば、どのデバイスからでもアクセスすることができます。

スタバでプログラミングってか?

自宅かオフィス、もしくはコワーキングスペースでやった方が効率的だと思いますけどね。

HTML5とCSS3の習得

この無料ツールで、ある程度の練習はできます。

HTML5、CSS3はもちろんJavaScriptもいけますが、欲を言えばPHPを似たような環境でこちょこちょできないものですかね・・・。

引き続き探してみたいと思います。

ローカルやレンタルサーバーで開発環境を持つまでも無い身なので、サクッとできる編集ツールがあると、個人的には非常に助かります。

まとめ

「ちょっとしたHTML・CSS・JavaScriptをテストしたいときに重宝している無料オンラインツール」ということで、Liveweave(ライブウィーブ)を紹介しました。

今まで、いくかの無料ツール、オンライン版もイントール版も試しましたが、Liveweaveがベストに近いものがあります。

本格派の方には物足りないでしょうが、それは当たり前。

がっつりとしたサイトの開発や作成には向かないと思いますので、あくまでも、こちょこちょとテストしたり、HTML5、CSS3、JavaScriptプログラミングの習得向けです。

リンクウェアとかプレビューのたびにブラウザを覗くとか一切ないので、かなり集中することができます。