web-dev-qa-db-ja.com

Angularjsを使用するにはnode.jsが必要ですか?

ウェブサイトの画像編集ツールにangular.jsを使用したいと思います。 node.jsも必要ですか?

シナリオがわかりません。必要ない場合、いつnodejsとangularjsを一緒に使用しますか?

クライアント側の画像編集ツールを作成するためにNodeJSは必要ありません。

AngularJSは、Googleとコミュニティが管理するWebアプリケーションフレームワークであり、クライアント側でCSSとJavaScriptを備えた1つのHTMLページで構成される単一ページアプリケーションの作成を支援します。

しかし、いつかそれらの画像をサーバーにアップロードして保存し、複数のクライアントからアクセスできるようにする場合は、サーバーも必要になります。このサーバーはNodeJSで作成できます。

61

あなたの痛みが分かります。

Angular 2開発に慣れていない人にとって、本質的に何かをするためにサーバー側の技術を学ばなければならないという苦痛を感じることができますクライアント側テクノロジー。私が理解していることから:

  1. node.jsは、angular 2アプリケーションの依存関係を管理するためにのみ使用されます。 node.jsnpm、またはjspmを使用せずに何らかの方法でこれらの依存関係を取得できる場合、アプリケーションをオフラインで実行および開発できます。ただし、手動でファイルをダウンロードする必要があるため、他のファイルを再度ダウンロードする必要があるファイルを手動でダウンロードする必要があるため、手作業で行うには容赦ない時間がかかります(はい)。 node.jsまたはnpmまたはjspmは、このプロセスを自動化するとともに、ファイルを構成するために必要なすべてのステップ(jspm)を実行して、特定の依存関係を使用するときにアプリケーションでは、その特定の依存関係の他の依存関係もシステムに存在します。
  2. 一部のブラウザ、特にGoogle Chromeは、セキュリティ目的でローカルにロードされるファイルを制限するため、Angular 2で使用される特定のHTML 5テクノロジーは、file:プロトコルを使用してロードされるとエラーを生成します。そのため、Angular 2を実行するために利用可能なすべてのHTML 5テクノロジーを利用できるように、アプリケーションを提供できるサーバーが必要です。
  3. node.jsは、ソースコードへの変更を検出するためのhot-module-reloadを提供するため、file watcher api機能の迅速なアプリケーション開発にも必要です。

ただし、node.jsを使用せずにAngular 2アプリケーションをオフラインで開発する方法があります。

  1. 必要な依存関係をすべて取得できれば、アプリケーションをオフラインで実行および開発できると言ったことを覚えていますか?アプリケーションが必要とするすべての必要な依存関係を持つパッケージを何らかの方法で検索または作成できる場合、依存関係を管理するためにnpmまたはjspmは必要ありません。
  2. file-access-restriction問題の場合、プロジェクトを拡張機能としてロードできます。拡張機能は、開発環境に対してローカルであると同時に、利用可能なすべてのHTML 5テクノロジーといくつかの強力なAPI(サーバーで提供されるアプリケーションでも利用できない)を使用する機能を備えています。したがって、アプリケーションを拡張機能として提供する場合、HTML 5テクノロジーにアクセスするためにWebサーバーを起動する必要はありません。
  3. hot-module-reload機能については、他の方法からアプローチできます。ローカルシステムのファイルへの変更を監視するために、Webサーバーにファイルウォッチャーを配置する代わりに、アプリケーション自体から行うことができます。アプリケーションはアプリケーションが必要とするfetchまたはxmlhttprequestリソースを使用できるため、定期的にfetchまたはxmlhttprequestアプリケーションが必要とするリソースをキャッシュと比較できます。しかし、どのファイルをチェックするのかをどうやって知るのでしょうか?ページ内でlinksを探すことができます、scriptimg.をSystemLoaderをモジュールローダーとして使用する場合、そのレジストリを使用してアプリケーションに必要なファイルを検索できますが、ページにロードされていない、なぜならそれはトランスパイルされているか何かのためです。これをすべて行うと、非ネイティブコードのトランスコンパイルまたは前処理のオーバーヘッドが追加され、システムのパフォーマンスが低下する可能性がありますが、このジョブは、システムのメイン実行スレッドを解放するweb workerに外部委託できますアプリケーションコード。

信じられない?ここに証拠があります。

  1. GithubのAngularプロジェクトのChromeには、最小限のAngular 2アプリケーションの開発に必要な依存関係を含む zip形式のパッケージ が含まれています。最低限、クイックスタートページで参照されているヒーローツアーのチュートリアルを参照しています)。 node.jsでサポートされていないシステム(たとえば、ChromeOSなど)またはnode.jsが利用できない制限されたシステムにいる場合、必要な依存関係はすべて利用可能ですが、必要な依存関係を管理するには、npmまたはjspmが必要です。
  2. proof of concept extension があり、これはヒーローチュートリアル(開発ファイル、TypeScript、およびすべて)のツアーをchrome拡張としてローカルに提供します。
  3. この拡張機能は、alexis vincentがSystemJS向けに開発したhmrプリミティブにフックすることにより、hot-module-reload機能も実装します。 hot-module-reload機能は単一のjavascriptファイルによって有効化されるため、この機能が必要ない場合やリソースを大量に使用している場合は、問題のあるコード行を削除できます。

ただし、注意してください。

  1. このシステムを使用している場合、技術が進歩し、急速なペースで進むにつれて、開発パッケージを更新する方法が必要です(Angular 3の話でAngular 2の場合または、アプリケーションの開発に使用しているテクノロジが廃止されたり、APIの変更により将来アプリケーションが機能しなくなる場合があります。また、これらのタイプのパッケージは手動で維持されるため、依存関係の最新のリポジトリがあることも保証されません。
  2. ChromeのAngularのようなChrome拡張としてアプリケーションをバンドルすると、パフォーマンスのボトルネックが発生します。コードがトランスコンパイルされ、モジュールが遅延ロードされるため、最新のJavaScriptエンジンがブラウザーで実行されるコードを最適化するために使用するJITコンパイルおよびその他のパフォーマンス強化の進歩が失われます。ただし、パフォーマンスが低下すると、開発したいテクノロジーを使用する柔軟性が得られます。常にトレードオフがあります。さらに、パフォーマンスヒットは、コードがロードされたときに最初にのみ発生します。アプリケーションによってロードされると、システムはパフォーマンス強化の実装方法を認識します。アプリケーションを配布する場合、必要なリソースをコンパイルして、最新のJavaScriptエンジンのパフォーマンス強化を活用する必要があります。
  3. hot-module-reload機能は、現在のところプロジェクト(temp1.ts、temp1.css、temp1.htm)の一般的な規則を使用するFile Watcherを実装するハック的な方法です(方法が間違っている可能性があります)。アプリケーションに必要であるがメインページにロードされていないすべてのリソース(トランスコンパイルまたは前処理されたリソース)の最終的なリストを取得する。
72
windsinger

node.jsは、サーバー側でJavascriptを記述するために使用されます。 angular.jsはクライアント側のフレームワークです。

Angular.jsを使用するためにnode.jsは必要ありませんが、npm(ノードパッケージマネージャー)をインストールして、angular開発者としての生活をより簡単にする素晴らしいツールを使用できます。例: yoeman これは優れた足場ツールです。 npmには他にも多くのツールがあります サイトへのリンク angularの詳細は、公式angularウェブサイトまたはangular youtubeチャンネル

9
hasanain

いいえ。Angularはクライアント側で使用され、Nodeはサーバー側で使用されます。

これらは MEAN Stack として一緒に使用されますが、必ずしも必要ではありません。

8
kike

イメージング編集ツールがどのように機能するかを知らずに答えることは困難です。しかし、質問に答えるために、AngularJSを使用するのにNode.jsは必要ありません。

Angularは、クライアントのWebブラウザーで動作するフロントエンドのJavaScriptフレームワークです。

Nodeはjavascriptを実行できるサービスであり、PHPの代わりにサーバーでよく使用されます( MEANスタックのように )。また、NodeはJavaScriptを実行できるサービスであるため、Angularアプリケーションを開発してcssやjavascriptの縮小やテストの実行などのバックグラウンドタスクを実行するときにローカルコンピューターで使用できます。

したがって、イメージング編集ツールがJavaScriptで開発され、アプリケーションがAngularおよびNodeを(Webサーバーとして)使用した場合、コードはクライアント側またはサーバー側で実行できます。

NodeとAngularが適合する場所を確認するためにMEANスタックを読んでください。Nodeはまったく必要ありませんが、すべて同じ言語で開発するのは素晴らしいことです。

3
JayMc

AngularJSが機能するためにNode.JSは必要ありません。 NodeJSはサーバー側で、AngularJSはクライアント側です。

AngularJSを初めて使用する場合は、このチュートリアル AngularJSチュートリアル をお勧めします。このチュートリアルではNodeJSを使用し、2つが連携する理由を理解しますが、必ずしも必要ではありません。

3
Billy