Google Cloud Shellの中でやれることをやる。高価なPCやサーバーを用意しなくてもブラウザだけで従来の「プログラミング」をすることができる。評価の定まった本に書かれたコードを書いて実行できる。いま始める人のためにピッタリ。
Google Cloud ShellにはWebエディターも用意されているけど複雑だから使わない。
vimがインストール済みだからvimを使う。
$ vim index.html
ややこしいことは考えずに、
ESC
とi
と:q!
と:qw
だけで十分使える。
ESCキーの代わりに使えるctrl + [
が便利。
設定しなくても色が付いてるし、自動で閉じタグ書いてくれる。
ただ、タブ幅が大きすぎるからvimrcファイルで設定する。
~/.vim/vimrc
ファイルを置く、中身は3行。
source $VIMRUNTIME/defaults.vim
まずこれを書くこと。これがないとすっぴんで起動して、htmlのハイライトもされない。
set tabstop=4
set shiftwidth=0
これでタブ1文字の表示がスペース4つ分になる。
index.htmlを書いたら、プレビューする。
Google Cloud Shellの「ウェブでプレビュー」は、インターネットからアクセスできるURLを用意してくれる。googleアカウントでログイン済みのアクセスだけをcloud shellの8080ポートへ通してくれる。
ということで、8080ポートで待ち受けするWebサーバーを起動する。何を使ってもいいんだけど、インストールされててすぐ使えるからpython3。
$ python3 -m http.server 8080
実行すると、画面から入力待ちのプロンプトが消えてWebサーバーのログが表示されるようになる。こうなるとvimが使えない。Webサーバーを起動したままで他のこともしたい。cloud shellの別のタブを使ってもいいけど、Google Cloud Shellはtmuxが導入済みで、こういう場面で役に立つ。
ctrl + b, c
を押すと、「Wellcome to Cloud Shell」が表示される。さっきまでの画面はctrl + b, n
で戻れる。迷子になったときはctrl + b, w
で画面の一覧が出せる。
これで、Webサーバーを起動させたままvimでhtmlファイルを編集できる。
vimを終了させずにファイルを保存するには、:w
Crieitは誰でも投稿できるサービスです。 是非記事の投稿をお願いします。どんな軽い内容でも投稿できます。
また、「こんな記事が読みたいけど見つからない!」という方は是非記事投稿リクエストボードへ!
こじんまりと作業ログやメモ、進捗を書き残しておきたい方はボード機能をご利用ください。
ボードとは?
コメント