#react

fla@diaspora-fr.org

When you're new to a development stack (here, NextJS for me), it's not easy to know which libraries to use.
This article explains the process quite well, using the internationalization example, but that's true for almost every use case:
https://dev.to/arsenii/how-to-choose-an-i18n-library-for-a-nextjs-14-application-part-1-5hjp

#webdevelopment #nextjs #react #libraries

fla@diaspora-fr.org

I'm discovering #React and I think there's something I don't understand correctly. Where am I supposed to put the code which computes things before displaying them, what would be the Model in a traditional MVC? Let's say my app deals with fruits, and I want to display a list of them. So I get the list from an API (something like [{type: banana, boughtDate: 2021-01-03}, {type: apple, boughtDate: 2021-01-02}], give it to a FruitsList component, which loops over and generate FruitRow component. Now, I want to display every rows which are a banana in yellow. I can add a style="color: yellow" in my row component with a condition on the fruit type. But what if I want to have this color in every places where a banana is displayed in my app? That would duplicate this kind of if in every components. What is the React solution to this? I could have an "utils" file with a function which takes a fruit and return the color, I guess?
Where I'm confused is that, in Java or other object languages, I would have a getColor() method on the Fruit class, and the Banana subclass would override it to return yellow. Or at the very least I would have the if (type === "banana") only once, in the getColor method of Fruit class. Can I (and should I) try to recreate that model in React? So my ¨logical" code is only in one place, and then I could have generic component like Row which would take content and color as props, instead of a Fruit?

#webdevelopment