Sharing data between repos/modules in Angular 6 multi-repo architecture
I am tasked with designing an Angular application in a multi/micro-repo structure so that the smaller Angular feature components will be broken down into individual repos and can be consumed by React apps in a React wrapper.
The requirement is that the feature components will need to be re-usable across different businesses units and datasets. Essentially making some of our features shared re-usable components. This means that the service logic of fetching data needs to be an input rather than an embedded service. Same for logos, branding, styling, HTML items, etc. Also, we want to make a clear distinction of the mapping of dev teams to features.
Because of this I expect to only be able to use inputs for getting this data.
Question 1: Have I made a correct assumption in that Angular input decorators are the best way to go?
Question 2: Has anyone else taken this approach and if so can you please share your thoughts?
Example using simple logo
Feature module *.component.ts
import { Component, Input } from '@angular/core';
...
export class HeaderComponent {
@Input() logo: string;
..
}
Consuming module *.html
<app-header [logo]="logo"></app-header>
angular architecture
add a comment |
I am tasked with designing an Angular application in a multi/micro-repo structure so that the smaller Angular feature components will be broken down into individual repos and can be consumed by React apps in a React wrapper.
The requirement is that the feature components will need to be re-usable across different businesses units and datasets. Essentially making some of our features shared re-usable components. This means that the service logic of fetching data needs to be an input rather than an embedded service. Same for logos, branding, styling, HTML items, etc. Also, we want to make a clear distinction of the mapping of dev teams to features.
Because of this I expect to only be able to use inputs for getting this data.
Question 1: Have I made a correct assumption in that Angular input decorators are the best way to go?
Question 2: Has anyone else taken this approach and if so can you please share your thoughts?
Example using simple logo
Feature module *.component.ts
import { Component, Input } from '@angular/core';
...
export class HeaderComponent {
@Input() logo: string;
..
}
Consuming module *.html
<app-header [logo]="logo"></app-header>
angular architecture
add a comment |
I am tasked with designing an Angular application in a multi/micro-repo structure so that the smaller Angular feature components will be broken down into individual repos and can be consumed by React apps in a React wrapper.
The requirement is that the feature components will need to be re-usable across different businesses units and datasets. Essentially making some of our features shared re-usable components. This means that the service logic of fetching data needs to be an input rather than an embedded service. Same for logos, branding, styling, HTML items, etc. Also, we want to make a clear distinction of the mapping of dev teams to features.
Because of this I expect to only be able to use inputs for getting this data.
Question 1: Have I made a correct assumption in that Angular input decorators are the best way to go?
Question 2: Has anyone else taken this approach and if so can you please share your thoughts?
Example using simple logo
Feature module *.component.ts
import { Component, Input } from '@angular/core';
...
export class HeaderComponent {
@Input() logo: string;
..
}
Consuming module *.html
<app-header [logo]="logo"></app-header>
angular architecture
I am tasked with designing an Angular application in a multi/micro-repo structure so that the smaller Angular feature components will be broken down into individual repos and can be consumed by React apps in a React wrapper.
The requirement is that the feature components will need to be re-usable across different businesses units and datasets. Essentially making some of our features shared re-usable components. This means that the service logic of fetching data needs to be an input rather than an embedded service. Same for logos, branding, styling, HTML items, etc. Also, we want to make a clear distinction of the mapping of dev teams to features.
Because of this I expect to only be able to use inputs for getting this data.
Question 1: Have I made a correct assumption in that Angular input decorators are the best way to go?
Question 2: Has anyone else taken this approach and if so can you please share your thoughts?
Example using simple logo
Feature module *.component.ts
import { Component, Input } from '@angular/core';
...
export class HeaderComponent {
@Input() logo: string;
..
}
Consuming module *.html
<app-header [logo]="logo"></app-header>
angular architecture
angular architecture
asked Nov 20 at 21:07
david
165
165
add a comment |
add a comment |
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53401545%2fsharing-data-between-repos-modules-in-angular-6-multi-repo-architecture%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53401545%2fsharing-data-between-repos-modules-in-angular-6-multi-repo-architecture%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown