質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

89.12%

Angularのプロジェクトにおける自作ライブラリの置き場所

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 1
  • VIEW 166

sin_250

score 106

背景

AngularでWebアプリを作ろうとしています。
緯度経度などの地理情報の便利計算サイトのようなものです。
Angular, TypeScriptについては素人(公式チュートリアルを一通り終えた程度)です。

質問

例ですが、以下のような緯度経度に関する計算を司るモジュール(関数群)の実装が必要です。

  • 緯度経度で与えられる2地点間の直線距離を計算する関数
  • 緯度経度で与えられる基準地点から、与えられた距離だけ平行移動した地点の緯度経度を計算する関数
  • 上記関数群を統一的・効率的に実装するための型やインターフェースの定義

これらは基本的にWebとは無関係なので、Angularのcomponentやserviceとして実装するのはおかしいと感じています。
しかしこの場合、Angularプロジェクトディレクトリ内のどこのファイル・ディレクトリに実装するのが一般的なのでしょうか?

srcディレクトリ以下の階層はコンポーネント志向のコードが格納されると理解しています。
かといってsrcと同じ階層に手動で適当なディレクトリを作っていいものか、よく分かっておりません。

参考

Angularの標準的なディレクトリ構成(ng newコマンドで作成したプロジェクト)

.
├── angular.json
├── browserslist
├── e2e
├── karma.conf.js
├── node_modules
├── package.json
├── package-lock.json
├── README.md
├── src
│   ├── app
│   ├── assets
│   ├── environments
│   ├── favicon.ico
│   ├── index.html
│   ├── main.ts
│   ├── polyfills.ts
│   ├── styles.css
│   └── test.ts
├── tsconfig.app.json
├── tsconfig.json
├── tsconfig.spec.json
└── tslint.json
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • miyabi_takatsuk

    2020/05/04 22:08

    ライブラリ、プラグインとして、その機能を設置したい、ってことでしょうか?
    特に外部に(npmなど)公開する予定がないのであれば、わざわざプラグイン、ライブラリとして作成せずに、serviceでやっちゃった方が、やりやすいかと思いますが・・・。
    (Angularの枠組み外での機能を、Angular内で使うのはけっこうめんどくさいというか難しい)

    それでも、ライブラリとして、機能定義したい、ってことでしょうか?

    キャンセル

  • sin_250

    2020/05/04 23:34

    コメント記載ありがとうございます。
    私のやりたいこととしては、、、
    ・外部にNPMライブラリとして公開する予定はない。あくまで自サイト内でのみ使用するライブラリ。
    ・ただ、自サイトのコードのディレクトリ構成はキレイにしておきたい。
    たとえばWebサイト上のUIと関係ないロジックや型定義をコンポーネント内に記載したくない、など。
    あるべきコードをあるべき場所に書いて、できるだけ再利用性が高いコードにしたい。
    ・本来、緯度経度にまつわる計算ロジックは、Webとは全く関係ない、純然たる数値計算処理なのですが、Angular内のディレクトリ構成上、Webと関係ないロジックを置く場所が見当たらない、というのが困りごとです。

    >serviceでやっちゃった方が、やりやすいかと思いますが・・・。
    >(Angularの枠組み外での機能を、Angular内で使うのはけっこうめんどくさいというか難しい)
    やはりそういうことなのですかね。そういうことであればそれが答えですかね・・・ >o<

    キャンセル

  • miyabi_takatsuk

    2020/05/04 23:42

    なるほど・・・。
    回答に移らせていただきます。

    キャンセル

回答 1

checkベストアンサー

0

前置きをさせていただきますと、ある程度、使用者達の傾向や、CLIを使っている以上、その方が、構築しやすい、などはありますが、最終的には正解はなく、作成者の自由ということはご承知おきください。
(つまり本回答も、ただの一つの案に過ぎないということ)

・外部にNPMライブラリとして公開する予定はない。あくまで自サイト内でのみ使用するライブラリ。

を踏まえて回答させていただきます。

これらは基本的にWebとは無関係なので、Angularのcomponentやserviceとして実装するのはおかしいと感じています。

たとえそうであっても、Angularを使う以上、Angularはcompornent指向であるため、(言語ではなく、フレームワーク自体がコンポーネント指向ということ)
compornentを中心に構築すべきですし、そちらの方が、自然に、かつ機能的な構築が可能です。
よって、今回の機能を作成するには、serviceで構築するのが一番妥当でしょう。
ディレクトリを綺麗にしたいなら、
app/services/といった風にディレクトリを作り、その中に各serviceを展開していくのがいいかと。

Angularはもちろん、その枠組み外のライブラリなどを読み込むことは可能です。
ただし、インポートがやりずらかったり、そのライブラリの機能を、Angular内で使うには、設定やらないし、毎回手で各コンポーネントで仕様を記述しなければいけなくなる、など、けっこう厄介です。
(かくいう私も同じことをやろうとして、様々格闘した挙句、これserviceでいいじゃん・・・って結論になった経験があるので)
それであれば、Angularの枠組み内で機能を作成した方が、手間も少ないですし、
最終的にコンポーネントに落とし込むのも、自然にできるのでそちらのほうがいいかと。

逆に、最終的にはWebページで使うが、直接Webページで使うわけではないが様々な処理をするために、Angularの枠組み内で機能を提供するのが、serviceという機能と推察されます。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/05/05 22:02

    ご回答有り難うございます。
    確かに「ビジネスロジックはサービスに記述する」と言われていますが、
    便利変換サイトにおいては変換ロジックはサービスかもしれません。
    まずはそれでやってみたいと思います。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 89.12%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

同じタグがついた質問を見る