Skip to main content

Introduction

Welcome to the ReFormer tutorial! In this guide, you'll build a complete Credit Application form step by step.

Work in Progress

Tutorial source code on GitHub

What You'll Learn​

By the end of this tutorial, you will understand:

  • How to define form schemas with TypeScript
  • How to create reusable field components
  • How to add validation (built-in, async, cross-field)
  • How to implement behaviors (computed fields, conditional logic)
  • How to handle form submission and server errors

Tutorial Structure​

  1. Introduction β€” Overview and form structure
  2. Project Setup β€” Install dependencies and set up project structure
  3. Form Schema β€” Define interface, create schema, decompose into parts
  4. Rendering β€” Build form components and steps
  5. Behaviors β€” Add computed fields, conditional logic, and more
  6. Validation β€” Implement all types of validation
  7. Working with Data β€” Loading, transformation, validation and saving