formMOD reviews and mentions

• Create React forms in a few minutes.
  1 project | /r/Frontend | 11 Apr 2022
  2 projects | /r/javascript | 11 Apr 2022
  2 projects | /r/react | 11 Apr 2022
  2 projects | /r/reactjs | 11 Apr 2022
  2 projects | dev.to | 11 Apr 2022

  https://github.com/nickorsk2017/formMOD What do you think about this system? Thank you!

• Why you need a new library for forms on React?
  2 projects | /r/reactjs | 11 Apr 2022

  import { Form, Field } from ‘react-final-form’; … … ( Bio {meta.touched && meta.error && {meta.error}} )} /> …

  What issue??

  1. If you currently have a project you need to redoing all your UI components to specific syntax.
  2. Until today a developers have millions UI libraries.Why can't you just install it and use it?You must make a wrapper components, adapt logic to use library.

  We calculated time for redoing a large app.

  It need about from few months to fixing bugs, changing syntax…

  For a business it crazy huge.

  Example 3

  import { useForm } from ‘react-hook-form’;
  …
  const { register, handleSubmit, errors } = useForm();
  …
  return (
   
      …
      
      {errors.lastname && 'Last name is required.’}
      …
    
  );
  

  What issue?

  Problem is specific syntax inside UI component.

  At first glance short syntax is good.

  But you can do it easy without libraries.

  const props = helper({…});
  
  
  

  Solution

  When you need to think about a form library at first moment?

  Yes, when you need a validations.

  A form library only must know about data.

  For example, that a data row is valid or not.

  - Not about your app structure.

  - Not about JSX or UI components inside.

  - Not about UI logic.

  A form system must be abstract. It's like a smart useState().

  You should make your app easy, just connect your components to data.

  How it can look.

  After long analyse we decided to make our library.

  For creating your forms you need two simple steps:

  1. Define a scheme which describes validation and some properties of form data.
  2. Connect your scheme via methods to your UI components.

  Scheme

  // scheme.ts
  export default {
   valid: null,
   formValue: {
      first_name: "",
      last_name: "",
   },
   rules: {
      full_name: [
          ["empty", "please enter your full name"]
      ],
      email: [
          ["empty", "please enter your email"],
          ["email", "is not email"],
      ]
   }
  }
  

  Form

  //MyForm.ts
  import {useFormMod} from "formmod";
  
  export const MyForm = () => {
  const {setValue, getValue, getError, validate} = useFormMod(
      FORM_SCHEME
  );
  return (
  
      …
       setValue("full_name", value)}
      />
      …
  
  );
  

  Full documentation :

  https://doc.formmod.org/

  **WE RECOMMEND TO USE LAPTOP OR DESKTOP DEVICE FOR READING DOCUMENTATION.

  Advantages:

  • No dependencies. This is the power of simple work.This form system don’t know about your components, JSX, your app, store…You can use it with any UI components. No longer need to make wrappers components, understanding JSX syntax.Just use it with anything.
  • Easy system, easy code. It’s very simple.
  • Save time. Just connect properties to your components.

  Important

  We have finished our library recently.

  Until today we have 151 commits, 14 releases in our repository and this is just the beginning of the work.

  We started work with community, fixing documentation.

  We need your support, just set a star in gitHub here:

  https://github.com/nickorsk2017/formMOD

  Other features

  Also our library can work with optional, group, composite components.

  It has described work with CRUD, store (about mutable data) and more.

  It is absolutely free (MIT).

  We are working for world community.

  We want to make development easer for everybody.

  Thank you for reading!

  2 projects | /r/u_formmod | 11 Apr 2022

  {meta.touched && meta.error && {meta.error}}

  )}

  />

  …

  What problem??

  1. If you currently have a project you need to redoing all your UI components to specific syntax.
  2. Until today a developers have millions UI libraries.
     Why can't you just install it and use it?
     You must make a wrapper components, adapt logic to use library.

  We calculated time for redoing a large app.

  It need about from few months to fixing bugs, changing syntax…

  For a business it crazy huge.

  Example 3

  import { useForm } from ‘react-hook-form’;

  …

  const { register, handleSubmit, errors } = useForm();

  …

  return (

  …

  {errors.lastname && 'Last name is required.’}

  …

  );

  What problem?

  A specific syntax inside UI component.

  At first glance short syntax is good.

  But you can do it easy without libraries.

  const props = helper({…});

  Solution

  When you think about form library at first moment?

  Yes, when you need a validations.

  The form library only must know about data.

  For example, that a data row is valid or not.

  - Not about your app structure.

  - Not about JSX or UI components inside.

  - Not about UI logic.

  You should make your app easy, just connect your components to data.

  How it can look.

  After long analyse we decided to make our library.

  For creating your forms you need two simple steps:

  1. Define a scheme which describes validation and some properties of form data.

  2. Connect your scheme via methods to your UI components.

  Scheme

  // scheme.ts
export default {

  valid: null,

  formValue: {

  first_name: "",

  last_name: "",

  },

  rules: {

  first_name: [

  ["empty", "please write your first name"]

  ],

  last_name: [

  ["empty", "please write your last name"]

  ]

  }

  }

  Form

  //MyForm.ts

  import {useFormMod} from "formmod";

  export const MyForm = () => {

  const {setValue, getValue, getError, validate} = useFormMod(

  FORM_SCHEME

  );

  return (

  …

  label={"First name"}

  value={getValue("first_name")}

  error={getError("first_name")}

  onChange={(value: string) => setValue("first_name", value)}

  />

  …

  );

  Advantages:

  ​

  • No dependencies. This is the power of simple work.
    This form system don’t know about your components, JSX, your app, store…
    You can use it with any UI components.
    No longer need to make wrappers components, understanding JSX syntax.
    Just use it with anything.
  • Easy system, easy code. It’s very simple.
  • Save time. Just connect properties to your components.

  Important

  We have finished our library recently.

  Until today we have 151 commits, 14 releases in our repository and this is just the beginning of the work.

  We started work with community, fixing documentation.

  We very need your support, just set a star in gitHub here:

  https://github.com/nickorsk2017/formMOD

  Full documentation for Heroes:

  https://doc.formmod.org/

  Other features

  Also our library can work with optional, group, composite components.

  It has described working with CRUD, store, data and more.

  It is absolutely free.

  We are working for world community.

  We want to make development easer for everybody.

  Thank you for reading!

• React.js. Complex react forms are easy. The FormMOD is new library for react forms.
  1 project | /r/reactjs | 21 Mar 2022

  We really need your support, set a star on github here: https://github.com/nickorsk2017/formMOD

• A note from our sponsor - InfluxDB
  www.influxdata.com | 23 Apr 2024

  Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality. Learn more →