So I have made a simple React Native recipe app for my Bachelor Thesis to use as a base for implementing analytic tools. I have been getting questions about what the architecture is of my demo application and how those analytic tools will fit in.

The thing is that I have no clue on how to make an architecture for a simple React Native application.

I do have to mention that this react native application is build in Managed Expo.

So the Recipe application itself has a stackNavigator with a tab navigator containing 3 tabs. 1 tab for the list of recipes, 1 tab to check personal recipes, 1 tab to check recipes based on leftovers. Only the first tab really works there you can like a recipe view its details and simulate buying a recipe (which ofcource is just a regular button).

So there are 4 different screens 1 for each tab and the recipe detail. There are also 3 custom components, 1 representing the cell of a recipe in the list, 1 for the custom tabbar and 1 for custom tabItem. The only thing left is a static list of recipes in .json file.

That's literally all there is to.

So is there anyone who can help me with this?

Thanks in advance

Edit 1:

So far I found the C4 model which is specific for software architecture. I also find it very descriptive and easy to understand. The main issue I have is that I have no clue what I have to put in the component diagram.