I'm a begineer JS student and this is my first question in Stack.
I am looking to make a flashcard website with about 8000 Flashcards.
In an old post (10 years ago) they recommend: AJAX-loading-one-at-a-time approach. (didn't learn that yet by the way).
So far I made 3 flashcards and it's working with variables and arrays but with 8000 not sure which is the best option:
function Card(term, definition) {
this.term = term;
this.definition = definition;
}
let front = document.getElementById("front");
let back = document.getElementById("back");
let flip = document.getElementById("flip");
const card1 = new Card(
"Good Morning",
"Buenos Dias"
);
const card2 = new Card(
"Welcome",
"Bienvenido"
);
const card3 = new Card(
"How are you? ;)",
"Que tal"
);
const myCards = [card1, card2, card3];
const cardIndex = 0;
Thank you in advance guys and sorry if I not explain well.
As it is, what you're doing looks good to me... JSON is useful for storing data but I don't think what you're doing is wrong - it's just a matter of opinion.
When storing data like you are, I prefer to use this method:
const myCards = [
{english: 'Good Morning', spanish: 'Buenos Dias'},
{english: 'Welcome', spanish: 'Bienvenido'},
{english: 'How are you?', spanish: 'Que tal?'}
]
const cardIndex = 0
console.log(myCards[cardIndex].english)
console.log(myCards[cardIndex].spanish)This is a much smaller technique and it's very scalable.
Feel free to look further into JSON data if you like, but I don't think you need to worry.
I hope this helps.