Scaling up with React and Typescript
Submitted by Arjun Hariharan (@harjun1601) on Wednesday, 11 April 2018
We have adopted typescript with our project and are using it at the frontend and the backend. Through this talk, I would like to share our experience working with typescript, the practices and conventions we have adopted in our team and how we were able to develop faster while maintaining the code quality at the same time.
Quick walk through of the code stack (react, redux, typescript), the dev tools we use (ts-node, tsc, webpack) and VS code integration (prior knowledge with the tools and libraries mentioned above is expected).
Refresher - typescript interfaces, types and few other concepts like globals.
Demo - Building a simple component in react-redux with typescript. This will demonstrate how the declaration of state, props and redux state and how typecript help us to code faster.
Demo - Iterate over the component to add more features to this. Through this, I would like to show how typescript makes it easy to add new features or modify the existing feature with fewer bugs and issues.
Conventions we have adopted to maintain the typescript interfaces. a. TSLint rules and TSConfig we have adopted for better code quality.
b. Conventions we have adopted for declaring the interfaces/types/enums to keep the code clean.
c. Creating global file to share the the interfaces via npm.
d. Walk through of definitely-typed library which contains typescript interfaces for most of the popular JS libraries.
Demo - How typescript makes it easy to integrate the backend and frontend. Keeping the APIs and the UI in sync as we iterate over the product is a big challenge in itself. With typescript, we can clearly define the mandatory fields, data types of the field, object composition etc to make this proess efficient.
Arjun is a founding member and a senior software engineer at Velotio Technologies, Pune. He leads multiple projects at Velotio technologies and focuses on setting up and growing the agile teams in the company. He is a full stack engineer working primarily with Node and React Js and has worked with Python, Java and Ruby in the past for his projects at Seagate and other companies. He has also worked with different technologies like Botkit, Rasa-NLU, docker, kubernetes, chef and therby brings a vast amount of experience and expertise in multiple domains like SaaS, chat bots, NLU, Cloud and infrastructue.