September 20, 2018
The React Library is now a de facto choice for Silicon Valley projects with mature solutions and for a sizeable community of developers. It has a pretty simple concept; every single user interface on a website acts as a component. The main API (Application Programming Interface) is a minimal implementation which includes properties or props, state, and life cycles.
This example illustrates a common problem. My component is called (Notification) and I'm using the representation of a custom HTML element.
<Notification message="My message to the world" />
Let's imagine building a large scale application with more than 20+ components, how many attributes does each component have: two or three? Can you remember every single attribute? What happens if my property is represented by an object?
Now put your project in context:
What happens if your team grows, and new front-end developers join the team? What if the documentation is not up to date?
Luckily, the code can be almost "self-documented" with TypeScript. For developers coming from a Java background or C#, this feels familiar.
The use of types keeps the code well organized, and prevents silly errors like assigning wrong types or creating the wrong object structures for a specific functionality. In addition, projects are more maintainable, and you can easily refactor code.
In summary, I have a quick list of pros and cons:
- Compilation time can be significant with large apps
- There is a steep learning curve for web developers with no Object Oriented Programming background
- Object-oriented features
- Type Safety
- React properties and states can be represented by interfaces, and can make use of both required and optional attributes. This is very useful.
- IntelliSense or autocompletion magic.
Thanks for reading, I hope you’ll give these useful tools a try!