Good afternoon.
It is necessary to create several pages from the ready layout on reactjs. The ready layout was purchased on themeforest, and I will provide the link to the layout (it is paid, I do not distribute paid material, so I do not publish it here) to those who show great interest and are suitable as a candidate for the job.
Here is the link to themeforest - https://themeforest.net/item/tailwise-react-typecript-admin-dashboard-template/51856970?s_rank=1
What needs to be created (everything you see in Figma):
1. The main page with a form block (as in Figma)
2. A table with forms and buttons to edit, add, and delete. And a search by name.
3. A page for adding/editing a form
Link to Figma - https://www.figma.com/design/chkL3HRkIEsWM26oSC3g3g/Form-generator?node-id=6357-41096&t=jOiuwcVF8HBx0WVQ-0
Explanation:
The Menu page consists of large square button-links to pages:
Fillable forms
________________________________________________________________
When clicking on Fillable forms - Display a list of forms in the form of a table
Table columns: Name, name (unique name of the form), action buttons (edit, delete)
Forms are taken and saved through a simple API. The API has 2 methods:
1. Get json of all forms (there are all the necessary fields and data)
2. Save json of all forms (if something is added or edited, then we add it to the general json and send it to the server)
When clicking on edit form or on the add form button:
Open another page for adding/editing the form
________________________________________________________________
Explanation:
Form blocks are like <div class="col-md-6"></div> in Bootstrap. That is, these are columns where the added field will be placed.
You can add as many form blocks as you want.
Inside the form block, you can add as many fields as you want. Each field has its own type (described below). When selecting the field type, we add the necessary inputs, as shown in Figma.
Fields:
1. Text input
2. TextArea
3. Text editor
4. Select
5. Image
6. Multiple image upload
Validators:
-required field
-number
-text
-image
--extension
--size
--image resolution
According to the layout template from themeforest, all unnecessary elements should be removed from there, leaving only what is used, so that the package is not so large.
I expect reasonable deadlines from you (please do not disturb intermediaries), cost, experience