My Newbie Road to TypeScript

I gave a quick presentation for frontend engineers about the path of my team into TypeScript:
- Why to use TypeScript?
- What's strategy did we use in my team to adopt TypeScript?
- How to create shared types across multiple apps?
- What are some pros and cons that I found while using TypeScript?

Any questions? Reach out to me on Twitter (@jgferreiro) or on my website: https://jorgeferreiro.com/contact

- - -

on https://www.twitter.com/jgferreiro
on https://www.linkedin.com/in/jgferreiro/
on https://www.youtube.com/c/jgferreiro/

Subscribe for more! https://jorgeferreiro.com/newsletter

Transcript

1. @JGFERREIRO @JGFERREIRO
2. @JGFERREIRO @JGFERREIRO #REACTDESIGNERS How many of you have used TypeScript?
3. @JGFERREIRO Frontend @Eventbrite Studio team Jorge Ferreiro Hi there! I’m
4. @JGFERREIRO @JGFERREIRO www.ferreiro.me Index 1. Why TypeScript? 2. How did we adopt it? 3. After 3 months 4. What’s next?
5. @JGFERREIRO @JGFERREIRO www.ferreiro.me
6. @JGFERREIRO @JGFERREIRO www.ferreiro.me
7. @JGFERREIRO @JGFERREIRO Why did we adopt TypeScript? 1.
8. @JGFERREIRO www.ferreiro.me Some paint points-goals Self-document contract with Backend APIs Guarantee same types on multiple team’s apps Document better our React props and our state types
9. @JGFERREIRO Bonus Try new technologies out. Eventbrite internal tooling was really well set up for TypeScript with some apps already in TS
10. @JGFERREIRO @JGFERREIRO How did we adopt TypeScript? 2.
11. @JGFERREIRO @JGFERREIRO #REACTDESIGNERS Scoped Prototype!
12. @JGFERREIRO @JGFERREIRO #REACTDESIGNERS
13. @JGFERREIRO We needed to build two new internal apps. So we gave an opportunity to TypeScript Experimentation
14. @JGFERREIRO Bunch of tutorials, and most importantly, checking other apps inside Eventbrite and #TypeScript channel Bonus: Useful help from Frontend Infra team! Learning by doing
15. We documented the team connections for writing TypeScript. Example: Studio-build app Team conventions
16. @JGFERREIRO We kept evolving the types as the backend changed or when we added new abstractions. Code duplication on purpose. Now we’ve stable types, and we’re consolidating types in several apps Iterating over the types
17. @JGFERREIRO @JGFERREIRO After 3 months 3.
18. @JGFERREIRo Some TypeScript pros Contract with the backend is now documented! Easy to onboard new engineers High visibility and easy to reason about your app’s datatypes Amazing dev experience with VS Code Low learning curve
19. @JGFERREIRo Some TypeScript cons No runtime typechecking Some libs don't have exported types Example: Our design system
20. @JGFERREIRO @JGFERREIRO What’s next? 4.
21. @JGFERREIRO Studio-types + studio-utils Created shared utils and types libraries to consolidate types and logic across several apps Shared team types and utils libraries!
22. @JGFERREIRO Could we migrate other team’s projects into TypeScript too? Apps migration
23. @JGFERREIRO @JGFERREIRO Action plan! 5.
24. @JGFERREIRO @JGFERREIRO www.ferreiro.me 1. Join #typescript channel 2. Youtube tutorial 3. Create a hello world TypeScript project/ Next steps if you wanna try!
25. @JGFERREIRO - jorge@ferreiro.me Q&A!
26. @jgferreiro Thanks frontenders!