API Call in React JS
0
I need your input for creating a search results application using ReactJS. I have around 8,000 data in a database server. Should I make one api call to retrieve the data at once and save this 8,000 data in an array then filter it by search criteria or should I make multiple api calls based on what user's search criteria? Thanks.
reactjs
asked Nov 14 '18 at 19:56
user788448user788448
727
add a comment |
0
I need your input for creating a search results application using ReactJS. I have around 8,000 data in a database server. Should I make one api call to retrieve the data at once and save this 8,000 data in an array then filter it by search criteria or should I make multiple api calls based on what user's search criteria? Thanks.
reactjs
asked Nov 14 '18 at 19:56
user788448user788448
727
1
Just fetch the data that you need from the backend.
– Federkun
Nov 14 '18 at 20:08
There are lots of tools to help you with problems like this. One of such is Algolia, which has a react library. If you intend to build this your self, then you should paginate the 8,000 records, and only by default fetch for the first page. And users can navigate from page to page, which will be an offset of the previous page and the limit you set for each page.
– theterminalguy
Nov 14 '18 at 20:26
You should fetch only the first page (top 25, for example) of the data that matches your search criteria and create pagination interface.
– dk-na
Nov 14 '18 at 20:28
Thanks everyone. I will fetch what I need instead of all 8,000 at once.
– user788448
Nov 14 '18 at 20:34
add a comment |
0
0
0
I need your input for creating a search results application using ReactJS. I have around 8,000 data in a database server. Should I make one api call to retrieve the data at once and save this 8,000 data in an array then filter it by search criteria or should I make multiple api calls based on what user's search criteria? Thanks.
reactjs
asked Nov 14 '18 at 19:56
user788448user788448
727
I need your input for creating a search results application using ReactJS. I have around 8,000 data in a database server. Should I make one api call to retrieve the data at once and save this 8,000 data in an array then filter it by search criteria or should I make multiple api calls based on what user's search criteria? Thanks.
reactjs
reactjs
asked Nov 14 '18 at 19:56
user788448user788448
727
asked Nov 14 '18 at 19:56
user788448user788448
727
asked Nov 14 '18 at 19:56
user788448user788448
727
asked Nov 14 '18 at 19:56
user788448user788448
727
asked Nov 14 '18 at 19:56
user788448user788448
727
727
1
Just fetch the data that you need from the backend.
– Federkun
Nov 14 '18 at 20:08
There are lots of tools to help you with problems like this. One of such is Algolia, which has a react library. If you intend to build this your self, then you should paginate the 8,000 records, and only by default fetch for the first page. And users can navigate from page to page, which will be an offset of the previous page and the limit you set for each page.
– theterminalguy
Nov 14 '18 at 20:26
You should fetch only the first page (top 25, for example) of the data that matches your search criteria and create pagination interface.
– dk-na
Nov 14 '18 at 20:28
Thanks everyone. I will fetch what I need instead of all 8,000 at once.
– user788448
Nov 14 '18 at 20:34
add a comment |
1
Just fetch the data that you need from the backend.
– Federkun
Nov 14 '18 at 20:08
There are lots of tools to help you with problems like this. One of such is Algolia, which has a react library. If you intend to build this your self, then you should paginate the 8,000 records, and only by default fetch for the first page. And users can navigate from page to page, which will be an offset of the previous page and the limit you set for each page.
– theterminalguy
Nov 14 '18 at 20:26
You should fetch only the first page (top 25, for example) of the data that matches your search criteria and create pagination interface.
– dk-na
Nov 14 '18 at 20:28
Thanks everyone. I will fetch what I need instead of all 8,000 at once.
– user788448
Nov 14 '18 at 20:34
1
1
Just fetch the data that you need from the backend.
– Federkun
Nov 14 '18 at 20:08
Just fetch the data that you need from the backend.
– Federkun
Nov 14 '18 at 20:08
There are lots of tools to help you with problems like this. One of such is Algolia, which has a react library. If you intend to build this your self, then you should paginate the 8,000 records, and only by default fetch for the first page. And users can navigate from page to page, which will be an offset of the previous page and the limit you set for each page.
– theterminalguy
Nov 14 '18 at 20:26
There are lots of tools to help you with problems like this. One of such is Algolia, which has a react library. If you intend to build this your self, then you should paginate the 8,000 records, and only by default fetch for the first page. And users can navigate from page to page, which will be an offset of the previous page and the limit you set for each page.
– theterminalguy
Nov 14 '18 at 20:26
You should fetch only the first page (top 25, for example) of the data that matches your search criteria and create pagination interface.
– dk-na
Nov 14 '18 at 20:28
You should fetch only the first page (top 25, for example) of the data that matches your search criteria and create pagination interface.
– dk-na
Nov 14 '18 at 20:28
Thanks everyone. I will fetch what I need instead of all 8,000 at once.
– user788448
Nov 14 '18 at 20:34
Thanks everyone. I will fetch what I need instead of all 8,000 at once.
– user788448
Nov 14 '18 at 20:34
add a comment |
0
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
});
}
});
draft saved
draft discarded
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%2f53307883%2fapi-call-in-react-js%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
draft saved
draft discarded
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.
draft saved
draft discarded
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%2f53307883%2fapi-call-in-react-js%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
1
Just fetch the data that you need from the backend.
– Federkun
Nov 14 '18 at 20:08
There are lots of tools to help you with problems like this. One of such is Algolia, which has a react library. If you intend to build this your self, then you should paginate the 8,000 records, and only by default fetch for the first page. And users can navigate from page to page, which will be an offset of the previous page and the limit you set for each page.
– theterminalguy
Nov 14 '18 at 20:26
You should fetch only the first page (top 25, for example) of the data that matches your search criteria and create pagination interface.
– dk-na
Nov 14 '18 at 20:28
Thanks everyone. I will fetch what I need instead of all 8,000 at once.
– user788448
Nov 14 '18 at 20:34