"This guide is a living compendium documenting the most important patterns and recipes on how to use React (and its Ecosystem) in a functional style with TypeScript and to make your code completely type-safe while focusing on a conciseness of type annotations so it's a minimal effort to write and to maintain types in the long run."
Found it usefull? Want more updates? Show your support by giving a ⭐
The Mighty Tutorial for completely typesafe Redux Architecture 📖
Reference implementation of Todo-App with
typesafe-actions: https://codesandbox.io/s/github/piotrwitek/typesafe-actions-todo-app 💻
Now compatible with TypeScript v2.8.3 (rewritten using conditional types) 🎉
- Complete type safety (with
--strictflag) without losing type information downstream through all the layers of our application (e.g. no type assertions or hacking withanytype) - Make type annotations concise by eliminating redudancy in types using advanced TypeScript Language features like Type Inference and Control flow analysis
- Reduce repetition and complexity of types with TypeScript focused complementary libraries
- Typesafe Action Creators for Redux / Flux Architectures typesafe-actions
- Utility Types for TypeScript: utility-types
- Reference implementation of Todo-App: typesafe-actions-todo-app
You should check Playground Project located in the /playground folder. It is a source of all the code examples found in the guide. They are all tested with the most recent version of TypeScript and 3rd party type definitions (like @types/react or @types/react-redux) to ensure the examples are up-to-date and not broken with updated definitions.
Playground was created is such a way, that you can simply clone the repository locally and immediately play around on your own to learn all the examples from this guide in a real project environment without the need to create some complicated environment setup by yourself.