Hey everyone! I'm getting ready for a talk where I'll introduce my open-source library, and I want to challenge my own understanding of typing in frontend development. I teach other developers about TypeScript and Angular, and I usually say that we should always be strict with typings, avoiding `any`, and that types generally shouldn't be defined in the frontend. I do allow for exceptions, like when creating a library or specific components that require frontend-only types. However, I believe that types should typically come from the backend or other libraries. I'm curious to hear your thoughts on this rule of mine: when do you think we should define types in the frontend? Thanks for sharing your insights!
4 Answers
I think being strict about types might not always be practical. For instance, at my workplace, we map our domains and find that using types liberally increases readability and safety in the codebase. If you have a good reason for not using types in the frontend, I’d love to hear it!
I think there's no hard rule here. Use types in the frontend whenever you need them. If the frontend interacts with the backend, shared type definitions are super helpful. And, if you don’t have a shared type, it’s totally fine to create local types. But just be careful—relying too much on shared definitions can lead to mismatches between the code and the data being used. It’s about keeping things clear and visible throughout the development process.
I get your point! What’s your strategy to avoid getting stuck with incorrect types? I've seen developers rush to create quick interfaces just to avoid using `any`, which often results in a lot of duplicated or slightly differing types.
Regarding your rule that 'types should generally never be defined in the frontend,' I have to disagree. TypeScript is good at inferring types, but defining types is necessary when it comes to API responses. You should define them when the shape of the data is important for your application’s logic, especially with complex interactions.
Exactly! So, in your opinion, in what scenarios do you think types should be defined in the frontend if they're not part of a shared module?
I think types related to user interactions and state management really should be defined in the frontend. Sometimes, you don't have control over all the backend APIs you’re interfacing with. Striking a balance is key—ideally, you want types defined as upstream as possible, but it’s valid to define them in the frontend when necessary, especially in React apps!
Would you say that defining types in the frontend should be a last resort? It's important to use available resources before creating your own.
Couldn’t you achieve the same mapping in the backend instead? It seems like a better practice to keep frontend logic simple and light.