sgw sgw

Fラン大卒の海外就職

英語、カナダ生活、ウェブサイト開発、学校とかいろいろ書いてます
sgw

sgw

2018年にバンクーバーの州立学校BCITを卒業してバンクーバーでコーダー兼デザイン業務みたいな仕事したあと就活兼フリーランスやって今はバンクーバーの制作会社でワードプレス中心のフロントエンドとして働いていますw

オフラインで使えるライブコーディングエディターWeb Makerを紹介する

こんにちは。今日は自分がHTMLを学び初めてから使ってるオフラインで使えるライブエディター、Web Makerを紹介します。

Web Makerとは

コーディングを同時にしながら動作確認ができるエディターです。まぁ簡単に言うとオフラインでも使えるCodePenです。

Chromeの拡張機能の1つなので基本的にはChromeでしか使えません。

ダウンロード方法

上記のウェブサイトにアクセスしてダウンロードをクリック。

するとChromeの拡張機能のところにオレンジ色のマークが出てくるのでそれをクリックすると新規タブでこんな感じの画面が出てきます。

f:id:sgwshu:20170909080803j:plain

簡単な機能

ざっとシンプルに画像で解説。

f:id:sgwshu:20170909080807j:plain

これが主な画面になります。色で囲んだとこを解説して行きます。

赤:コードを書いてくとこです。

青:書かれたものが表示されます。

白:HTMLのダウンロード

黄色:Codepenに即座に変換します。

緑:設定です。文字サイズや言語などを変更できます。

シルバー:配置の変更ができます。

オレンジ:コンソールをリセットします。

水色:コンソールを表示します。

ちなみに画像で囲い忘れてましたが右上のADD LIBRARYを使うとCodePenと同じようにBootstrapやJqueryのライブラリが使えます。

それと<script>で直接HTMLに書き込むとJSは動作しないので注意してください。

これでオフラインでいつでもコーディングできます!!

それではSee yaaaaaaa!!!

この記事が気にったらいいね!して下さい

SNSでsgwをフォローしよう!

コメントする

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

necoyapa

迷子だ!迷子!猫やぱさん絶賛迷子中!
 
うんうん。ほほぉー。これは便利だ。
つまりあれだ!柿の種は1日1袋に
しとけって事かな?

sgwshu

迷い込んでくれてありがとうございますww