Hello, we meet again!, how was the week? hope you are well and gud!, This post will be about typescript, I’m not explaining what it is, but rather why i choose to use it.

TypeScript was everywhere - background

First of all, I want to clear some air by opening up, In in past, I hated typescript with a passion, Since then I’ve grown a lot as a person, lol.

Typescript was the new kid in the block, soo much hype was around it, stackoverflow surveys did not help either since it had typescript ranked top in their survey.

I’ve been a fan of codecamp’s work, they do useful stuff for the community,

To my suprise they announced this on twitter, I’ve been following their project - chapter, from then. After a month into development they migrated to typescript from javascript, there is an entire debate on their discord and github, but more importantly I was pissed because of this decision.

Ever since they changed the project to use typescript, gradually I started to reason and see-past my hate-wall (because of the respect I have for them). But I was not ready to try it out though, So a month later, I worked on a angular project, I learned basic typescipt(1% - 8%) to complete the project, was still writing javascript code everywhere, I was the “any” guy, if you know what I mean.

Javascript - my experience

After the angular project, I did a few projects in React rinku, with gatsby to name a few, I did the entire thing in javascript. From my experience, when the codebase grew along with the files, some issues I faced were,

  • Trying to remember object properties, function properties, etc, avoidable bcoz of autocompletion.

    • every so-often you are searching through the entire project, either by using find in files/grep.

  • Facing errors that could be avoidable by typesafety and static analysis, spending a ton of time debugging and fixing it.

  • Lack of easy peek into method signatures of third party libraries.`

  • Maintaining seperate documentation

It should be noted that I’m adding this on top of es-lint and prettier.

Solution - reasons for using Typescript

So naturally when I was starting a new project, I choose typescript as the result of my previous experience, I striclty enable no-explicit-any.

Before proceeding below, it should be noted you wont get any of the benefits if they aren’t initialized with types.

ex:


interface ApiItemProps {
  ...
}

const [api, setApi] = useState<ApiItemProps[] | null>(null);

What I get with typescript?

Autocomplete

Library definition

Type checking for parameters

Customtypes, etc.. for comfort

Static analysis

Typing api responses - implemented with awesome library quicktype

Advanced features of typescript,

To achieve the best experience, typescript offers advanced, unity and much more.

an example for unity and how I use it.

interface ListItemProps {
  onPress: () => void;
  id: string;
  name: string;
  color: keyof theme['colors'];
}

type MenuItemProps = Omit<ListItemProps, 'onPress'>;

interface FlatListRenderProps {
  item: MenuItemProps;
  index: number;
}

const [list, setFlatList] = useState<FlatListRenderProps[] | null>(null);

For more official handbook, explains a lot better than me.

Conclusion

I’m just starting to adapt typescript in my javascript workflow, this is the begining phase, obviously there is much more to learn. Bye, See ya soon - Gopinath.