Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

【vte.cx入門】2.ローカル環境でHTMLを編集する

More than 5 years have passed since last update.

アプリを効率よく制作する上で、開発環境を整えることは非常に重要なことです。
わざわざ編集したHTMLをその都度デプロイし、サーバーで変更を確認するといったフローは非常に煩わしく生産性に欠けます。
vte.cxではNode.jsの開発環境を利用することでローカル環境でも効率的な開発が可能です。

ここではその手順を以下に記します。

1. 開発環境の設定を行う

以下の記事で環境設定を行ってください。
【vte.cx入門】1.アカウント登録〜Hellow Worldまで: 「環境を整える」の章を参照してください。

すでに開発環境が整っている場合は、この工程はスキップしてください。

2. ローカル開発環境を立ち上げる

以下のコマンドを実行し、ローカル環境を立ち上げてください。

gulp serve -h http://{自分のサービスドメイン}.1.vte.cx

(例) gulp serve -h http://demo.vte.cx

http://localhost:8000/login.html にアクセスすることでローカル環境のログイン画面に遷移できます。

3. ローカル開発環境でHTMLを編集する

前回の記事で「hellow_world.html」を作成しましたが、それをローカル環境で編集してみましょう。

hello_world.html
<!DOCTYPE html>
<html lang="ja-JP">
  <head>
    <title>Hello World<title>
  </head>
  <body>
    Hello World test    ← testと追記
  </body>
</html>

これを保存すると、更新を検知しブラウザが自動でリロードされ、更新内容が表示されます。
是非アプリ開発に役立ててください。

次回はアプリ開発のための下準備の記事です。
データをサーバに登録するためのスキーマ定義の仕方を説明したいと思います。

以上です。

takeyama
AngularJS始めたばかりの初心者です
http://reflexworks.jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away