egghead.io videosのようなdev環境をセットアップするには

Question

AngularJSを学ぶために私のマシンに環境を設定したいと思います。私はegghead.ioのビデオで、AngularJSコードの入力を続けていて、サーバーで更新してその変更をリアルタイムでブラウザに表示すると見ました。どうやってするか？私はビデオにWebStromのロゴが表示されますが、それだけです。

Answer 1

ファイルを設定するにはサーバーが必要です。あなたが見たビデオは、ブラウザリロードプラグインを使用していたかもしれません。プラグインはファイルの変更を監視し、ファイルが変更されるとすぐにページを更新します。 yeoman（およびジェネレータの1つ）をプロジェクト設定用に使用することができます（基本的には足場用）。最初にNodeJSをインストールし、NPM（ノードパッケージマネージャー）をインストールする必要があります。その後、YEOMANをインストールし、それぞれ発電機を使用することができます。私の推薦はgenerator-gulp-angularです。 手順についてはreadmeを参照してください。しかし、NodeJSを適切にインストールした後は、コマンドプロンプトでこれらのコマンドを実行する必要があります。

npm install -g yo gulp bower 

上記のコマンドは上記のコマンドは、「TESTDIR」を言う、あなたはディレクトリを作成することができます次に

一気-角度ヨーマン・ジェネレータをインストールヨーマン、グッとそれぞれ

npm install -g generator-gulp-angular 

バウアーをインストールし、それにナビゲートする。私。

cd testDir 

は、あなたが希望のテクノロジを選択するように求められます

yo gulp-angular 

を実行します。設定が完了したら、あなたはそれはあなたが話しているが、それは彼のように聞こえる何のビデオを確認してください

gulp serve 

Answer 2

ない（ライブリロードして）作業を確認するために、次のコマンドを実行することができます/彼女が一気やイサキタスクを持っていますそれはあなたのブラウザを変更してライブを再読み込みすることを監視しています。それはどちらか

• 一気-livereloadすることができた（https://www.npmjs.com/package/gulp-livereload）

または

• browsersync（https://www.browsersync.io/）