テストですったらテストです。クモのようにコツコツと/headタグの直前でCSSファイルを読み込んでます。href="css/style.css"></head>/bodyタグの直前でJSファイルを読み込んでます。src="js/script.js"></script></body>viエディターの画面ではこんな見た目です。viエディターはシンタックスハイライト(プログラミング言語の固有の単語、記号に色がつく)がないんですね。viエディターを閉じる「入力モード」の終了にはESCキーを押します。最後の行の[insert]が消えてコマンドモードに戻ります。viの編集内容を保存して閉じるには:wqと打ちます。wは保存、qは終了を意味します。viでwなしで上書きするには:wqエンターで実行するとviエディターが閉じて、画面は先ほどのターミナルの画面に戻ります。index.htmlをテキストエディタで開くと編集内容が反映されています!ブラウザで開いくとこんな感じです!viエディターで文字を打ち替えみるちょっと実験で、文字の打ち替えをやってみましょう。再度viエディターを開きます。index.html開いたらiキーで「編集モード」に。h1タイトルの文字を打ち替えます。ESCキーで「コマンドモード」に戻り、:wq(またはwq!)でviエディターを保存して閉じる。次はCSSファイルを編集します。基本的にはHTMLと同じ流れです。cdコマンドでcssディレクトリへ移動。cssディレクトリがcssに変わります。style.cssviエディター画面iキーで「編集モード」にスタイルを書きます。スタイルがうまく当たれば見出しh1が赤くなるはずです。画面はターミナルに戻ります。../jsディレクトリがjsに変わります。script.jsviエディター画面iキーで「編集モード」にスクリプトを書きます。スクリプトがうまく動けば「はろー、黒い画面」というアラートが開くはずです。ESCキーで「編集モード」終了:wqでviエディターを保存して閉じる。画面はターミナルに戻ります。JSファイルをテキストエディタで開くとこちらもスクリプトがちゃんと追加されました!ブラウザをリロードするとアラートが開きました!最後にということで、テキストエディタを使わずにターミナルのviコマンドだけでWebページ(HTML、CSS、JSファイル)を作成、編集することができました!とはいえターミナルだとシンタックスハイライトがないのでテキストエディタの方が使い勝手は良さそうです。ゼロからの構築ではなくても、ターミナルで作業してていてコードの一部をちょっと編集したいときには有効かもしれませんね!これまでの作業はPCローカルの作業のみでしたので、今度はターミナルから別サーバにアクセスしてみたいですね。以前アカウントを作ったっきりになっている「GitHub」上に今回のファイルをアップしてみようかと思っています。それではまた!※参考:ぎっとはぶ(GitHub)、始めてました。CLIのプロトタイプとプロジェクトを作るVue.jsの続きです。CLIをインストールしてみました。worldする前回、MAMP環境でLaravelの白い画面を出しました。今回はLarave...2018-11-28ブラウザ上だけでお手軽GitHub体験(リポジトリの作成と変更)ソフトウェア開発プラットフォーム「GitHub」。はてなブログProフロントエンドエンジニア。神奈川に住まう四十路のオジキ。DTP→Webデザイナーから転向し今に至る。引き続きコツコツの日々。(24)リンクTwitterInstagramYoutubeCodePenGitHubPinterestQuolaFacebooknoteQiitaはてなブログをはじめよう!idr_zzさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。