My Newbie Road to TypeScript

My Newbie Road to TypeScript

I gave a quick presentation for the frontend engineers at Eventbrite and I covered:
- 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 in my website: https://www.ferreiro.me/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://www.ferreiro.me/newsletter

523f2560aefa80575be1aff88ec240dd?s=128

Jorge Ferreiro

December 13, 2019
Tweet

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!