Vue.js Live Conference

Vue.js London 2023

Today's Talk focused on building forms in Vue using FormKit. The speaker highlighted the simplicity of forms in Vue and the importance of adding buttons, labels, and help text for a better user experience. They also discussed handling form data and errors, refactoring form components, and implementing inline validation. The introduction to FormKit showcased its features such as a single component approach, automatic data collection, and simplified form building. The talk also covered applying validation and form generation using the FormKit schema, which allows for easy form representation and rendering.

Web forms are the connective tissue of the internet. Without them, people cannot request their health records, apply for university, order pad thai, or book a plane ticket. Yet too often, the tools we use to build those forms are a grab bag of libraries and DIY solutions that can result in a subpar user experience, poor accessibility, and low maintainability.In this talk, we will introduce FormKit — a form-building framework — and explore how this tool can empower Vue developers to write consistent, accessible, even delightful forms without spending a lifetime building them.Talk table of contents:<ul><li>- The problem with forms, why they’re hard</li><li>- Introduction to FormKit</li><li>- Input library</li><li>- Validation</li><li>- Accessibility</li><li>- Form architecture</li><li>- Generating forms from JSON</li><li>- Next steps and closing statements</li></ul>

Conquering Forms in Vue

Justin Schroeder

React Summit

React Summit 2022

This Talk explores the concept of form wizards and their role in creating intuitive, multi-step workflows. It discusses the use of state machines and various implementation options, including Formic and the Dream API. The process of building a form wizard using React context, reducers, and custom hooks is explained. Integrating state machines and the introduction of the Robo Wizard library are also covered, highlighting its flexibility and compatibility with different UI frameworks.

Forms are a core part of many applications and complex actions are often broken up into multiple forms as steps in this workflow. Using React’s Context API and a conventional state machine, we can build a reusable system for building these wizards and make the web a bit more magical.

Becoming a Form Wizard: Intuitive Multi-Step Workflows

Nick Hehr

React Advanced

React Advanced 2021

Andy Richardson, a software engineer at GraphCDN, introduces Fielder, a project aimed at simplifying form creation in React. Fielder allows for decentralized form schema and onSubmit logic, making it easier to handle async validation. It eliminates the need for hoisting conditional logic and simplifies rendering and validation. The Fielder library is recommended for exploration but not yet stable for production. The speaker emphasizes the importance of being truthful and addresses the performance and re-rendering capabilities of Fielder.

Why form-wide validation schemas are bad for developers and users - and how we can fix this! <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

#forms