thoughtbot / react-native-template

Template React Native project to be used with Cookiecutter
MIT License
61 stars 8 forks source link

Convert to TypeScript #34

Closed sharplet closed 5 years ago

sharplet commented 7 years ago

This change configures the project for TypeScript and then adds type definitions for the redux modules and screen components. See commit log for more info.

Depends on #35.

sharplet commented 7 years ago

Unfortunately the commits are a little messy here: I had to do a lot of debugging to get this into a working state, and it would be really time-consuming to go back and try and tease apart the slightly related but slightly different changes. Having said that, I think this is in a good position to move forward!

gfontenot commented 7 years ago

Do files need the tsx file extension? Why not ts?

sharplet commented 7 years ago

TypeScript doesn't appear to support JSX in .ts files, and I haven't found an option to change that behaviour yet. I decided I didn't mind the explicitness of using the .tsx extension.

tabfugnic commented 7 years ago

This might be something that has been talked about, but can you explain the advantages of using TypeScript over say JSX or anything else? I don't know that I understand the need for this change.

sharplet commented 7 years ago

The lack of a strong type system is something that I've felt quite keenly while working in straight JS/JSX (compared to the native development I've done in Swift). The main problem this solves for me is a lack of confidence in refactoring RN apps as they grow. Another way to help solve the same problem would be to have strong integration/feature tests — but while this (TypeScript) was difficult to get configured, a reliable mobile UI test suite is even harder to set up and maintain. So the benefit is you get greater confidence maintaining the code, but with a tighter feedback loop and less ongoing maintenance than feature tests.

... can you explain the advantages of using TypeScript over say JSX or anything else?

FWIW, now having explained what I believe to be the benefits of a strong type system, I think a more apples-to-apples comparison would be with Flow, which is the main alternative in React Native apps. I think either would do the job, but anecdotally my understanding is that TypeScript has a few more features.

This PR is more about getting a working TypeScript setup that can be easily replicated for new projects, so that we can hit the ground running and really test whether it's the right tool for the job.

mwenger1 commented 6 years ago

Wanted to share this relevant quote from an article I just read.

If you're working with Angular 2+, you might favor TypeScript because it's the dominant language used in the Angular community. If you're using React, on the other hand, you might prefer Flow because it easily integrates with Babel and other infrastructure you probably already have in place.

I don't know enough about the differences between Typescript vs Flow to have an opinion. Was curious if you had considered Flow, and if yes, what factors led you to pick Typescript

sharplet commented 6 years ago

@mwenger1 My choice to try out TypeScript was based on a brief initial experience trying to integrate both it and Flow. I ultimately had a better experience with TypeScript, and felt like I was getting better feedback from it. However, I didn't spend a lot of time on it, so it's possible I could have been missing something obvious.

Additionally, I believe that TypeScript has more features, being a superset of JavaScript rather than just a typechecker.

purinkle commented 5 years ago

Convert to TypeScript