Hello I am new to nextjs and react coming from vue. I would love some of your thoughts about a configuring content which is later rendered using loop.

Let's say we have a sidebar tabs 10 of them with label, icon, link etc. and a posts array, what folder and file would you suggest me to create to store them separately from tsx file.

I thought about useConfig and there export 2 consts I can later on use in tsx file. But read on the docs that custom hooks with use should be only used if containg react state. So the best approach is simple config.ts factory or is there something better ?

Please be understanding if the question is stupid or poorly formulated