Organizing NgRx entities in Angular
I have been having some trouble with just figuring out how to hook up my app following NgRx patterns.
Let's say I want to make a Sports app, in which users can add their favorite teams to a dashboard and receive realtime stats for each team. Let's say they get one team per league. The app will use some external API to fetch the data on the team they add.
My question is, how do I organize NgRx so that all of this state gets stored correctly?
I suppose I would start out with an entity like:
export class User {
username: string;
password?: string;
token?: string;
nflTeamAdded?: boolean;
nflTeam?: string;
nflTeamStats?: nflStats;
mlbTeamAdded?: boolean;
mlbTeam?: string;
mlbTeamStats?: mlbStats;
nbaTeamAdded?: boolean;
nbaTeam?: string;
nbaTeamStats?: nbaStats;
// each of the stats objects would be tailored to what they receive from an third-party api
// that would send that information
}
But how would I split this up into individual actions, reducers, effects, and selectors with NgRx? Should I make a folder for each league, and treat each league team as an entity? I am always terrible with folder structure.
Eventually I would store the username, password, league booleans, and league teams inside of a database, but for right now I am mainly just concerned with NgRx organization. Any suggestions or advice would be greatly appreciated.
angular redux ngrx ngrx-store ngrx-effects
asked Nov 10 at 17:15
Stamden
83
add a comment |
I have been having some trouble with just figuring out how to hook up my app following NgRx patterns.
Let's say I want to make a Sports app, in which users can add their favorite teams to a dashboard and receive realtime stats for each team. Let's say they get one team per league. The app will use some external API to fetch the data on the team they add.
My question is, how do I organize NgRx so that all of this state gets stored correctly?
I suppose I would start out with an entity like:
export class User {
username: string;
password?: string;
token?: string;
nflTeamAdded?: boolean;
nflTeam?: string;
nflTeamStats?: nflStats;
mlbTeamAdded?: boolean;
mlbTeam?: string;
mlbTeamStats?: mlbStats;
nbaTeamAdded?: boolean;
nbaTeam?: string;
nbaTeamStats?: nbaStats;
// each of the stats objects would be tailored to what they receive from an third-party api
// that would send that information
}
But how would I split this up into individual actions, reducers, effects, and selectors with NgRx? Should I make a folder for each league, and treat each league team as an entity? I am always terrible with folder structure.
Eventually I would store the username, password, league booleans, and league teams inside of a database, but for right now I am mainly just concerned with NgRx organization. Any suggestions or advice would be greatly appreciated.
angular redux ngrx ngrx-store ngrx-effects
asked Nov 10 at 17:15
Stamden
83
add a comment |
I have been having some trouble with just figuring out how to hook up my app following NgRx patterns.
Let's say I want to make a Sports app, in which users can add their favorite teams to a dashboard and receive realtime stats for each team. Let's say they get one team per league. The app will use some external API to fetch the data on the team they add.
My question is, how do I organize NgRx so that all of this state gets stored correctly?
I suppose I would start out with an entity like:
export class User {
username: string;
password?: string;
token?: string;
nflTeamAdded?: boolean;
nflTeam?: string;
nflTeamStats?: nflStats;
mlbTeamAdded?: boolean;
mlbTeam?: string;
mlbTeamStats?: mlbStats;
nbaTeamAdded?: boolean;
nbaTeam?: string;
nbaTeamStats?: nbaStats;
// each of the stats objects would be tailored to what they receive from an third-party api
// that would send that information
}
But how would I split this up into individual actions, reducers, effects, and selectors with NgRx? Should I make a folder for each league, and treat each league team as an entity? I am always terrible with folder structure.
Eventually I would store the username, password, league booleans, and league teams inside of a database, but for right now I am mainly just concerned with NgRx organization. Any suggestions or advice would be greatly appreciated.
angular redux ngrx ngrx-store ngrx-effects
asked Nov 10 at 17:15
Stamden
83
I have been having some trouble with just figuring out how to hook up my app following NgRx patterns.
Let's say I want to make a Sports app, in which users can add their favorite teams to a dashboard and receive realtime stats for each team. Let's say they get one team per league. The app will use some external API to fetch the data on the team they add.
My question is, how do I organize NgRx so that all of this state gets stored correctly?
I suppose I would start out with an entity like:
export class User {
username: string;
password?: string;
token?: string;
nflTeamAdded?: boolean;
nflTeam?: string;
nflTeamStats?: nflStats;
mlbTeamAdded?: boolean;
mlbTeam?: string;
mlbTeamStats?: mlbStats;
nbaTeamAdded?: boolean;
nbaTeam?: string;
nbaTeamStats?: nbaStats;
// each of the stats objects would be tailored to what they receive from an third-party api
// that would send that information
}
But how would I split this up into individual actions, reducers, effects, and selectors with NgRx? Should I make a folder for each league, and treat each league team as an entity? I am always terrible with folder structure.
Eventually I would store the username, password, league booleans, and league teams inside of a database, but for right now I am mainly just concerned with NgRx organization. Any suggestions or advice would be greatly appreciated.
angular redux ngrx ngrx-store ngrx-effects
angular redux ngrx ngrx-store ngrx-effects
asked Nov 10 at 17:15
Stamden
83
asked Nov 10 at 17:15
Stamden
83
asked Nov 10 at 17:15
Stamden
83
asked Nov 10 at 17:15
Stamden
83
asked Nov 10 at 17:15
Stamden
83
83
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%2f53241448%2forganizing-ngrx-entities-in-angular%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%2f53241448%2forganizing-ngrx-entities-in-angular%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
