Best way to store a collection of JSON files so that their CID's are retrievable by index?

I’m trying to learn Solidity and instead of watching 50 tutorials, I’ve decided to try and build a project like CryptoPunks, but with 100 random pictures of my dog instead of 10k randomly generated characters. Problem is I’ve hit a wall.

I know I need to create a JSON file with an image link inside in order to add the data to a token. I’m just unsure how to store all 100 JSON files so that I can use an id to return the correlated file.

This is my current thinking - after adding an image to IPFS and getting the image link, I add that image link to a JSON file and get the CID of that. I then push that JSON file CID into an array, essentially holding all 100 JSON CIDs. I’d then take the token id, which will be a number between 1-100, and grab the correlated JSON CID by doing something like = ArrayOfCID[tokenId].

Is this the correct approach? Is there a better way of doing this? And if this is a good approach, is IPFS a good place to store this array of CID’s rather than Firebase, some other DB, to keep the data hidden from the browser?

Seams to me the correct way. Don’t forget the URI path. Your array is going to be something like

mapping(uint256 => string) private metadata;

and string == ipfs://YOUR_CID_HERE