React Code Generator

This tool generates React 14.0 with NodeJs(12),ExpressJs(4.13) and MongoDB Project(CURD operations) for the given database schema.

Responce form Server :

Delete Form

To craete Delete form. can set the display text of the form, and the message. For more info click here
  • Select the collectionto which properties need to set.
  • Properties for the Delete form will be appread
  • Set the required properties. It will be auto saved.

Collection Name :
Delete form Title :
Delete form Message :

To generate the code:-

  • Manage Collections:: To add/delete/update use Manage collections. For each collection Forms with CRUD operations is Generated.
  • For grouping the fields of the form(s) under different Tabs use "Manage Tabs". By selecting the Collection, the Tabs can be added under them. The Tabs can be assigned to the fields using the "Add/Update form."
  • For adding static list items to comboboxes create StaticLookUps . Click on "Manage Static Lookups" button and provide a service name to it and Key and values.
  • For adding dynamic list items to comboboxes create DynamicLookUps . Click on "Manage Dynamic Lookups" button and provide a service name to it and set the Collection name to fetch the data from and respective fields for Kay and value.
  • View Form :To set the properties related to generated view form(for each collectiona view form will be created) use "View Form". The following properties can be set.
    • Fields to display in grid.
    • Number of rows in a page.
    • Allowing the Add,Delete, Edit features.
    • Search features.
  • Add\Update Form : To set the properties related to generated add/update form use "Add/Update Form". The following properties can be set.
    • Which control to be set for the field.
    • IsRequired Validation and the Validation message.
    • Display Name of the field.
    • Under which Tab the field should be in etc.
  • Delete Form : To set the properties related to generated delete form use "Delete Form". The following properties can be set.
    • Delete form Title.
    • Message to be displayed.
  • Generate Code : After the setting the required properties, use this button to generate the code. After the code is generated it will provide the path to download the generated code in zip format. Unzip the file and follow the instructions provided in ReadMe.txt file to host the created project.

**Note: Every collectionneeds a primary key.

Read Tables Schema

1. Download the following php script files from here

2. Open the database.php file and change the host, username and password varailabes.

3. Upload the files to your server/virtual directory and run the Generate.php file.

4. Copy the generadted json data in the following Textarea. And click GetTablesSchema button.

Project Details

Client Type:

Service Type:

Import JSON Data

Copy the contents of Project.json file and click on "Import JSON Data".

Add Update Form

To craete Add/Update form. can set the display text of the form, control types for the fields, validation messages etc. For more info click here
  • Select the collectionto which properties need to set.
  • Properties for the Add/Update form with the list of fields will be appread
  • Set the required properties. It will be auto saved.

Collection Name :
Field Name Display Name Control Type Dynamic LookUpSource Static LookUpSource Tab Name Is Required Validation Message

Manage Collections

Create collection by using the "Add New Collection" button.

To add fields and set properties use "Add New Field." button.

Collection Name Manage Fields Action

View Form

To create a form which Displays the list of records for the collectionin a Grid. Can set the properties like display in grid or not, included in search or not etc. For more info click here
  • Select the collectionto which properties need to set.
  • Properties for the view form with the list of fields will be appread
  • Set the required properties. It will be auto saved.

Collection Name
Allow Add Feature : Allow Delete Feature :
Allow Edit Feature :
Field Name Display In Grid
Static LookUp :

Manage Menues

A menu is a set of options presented to the user to find information. Click on "Add New Menu" and provide the required Menu name. For more info click here
Menu Name Action

Manage Tabs

Tabs are used to show alternative views of the same group of information in a page. Select the collectionthe tabs need to be added and click on "Add New Tab" and provide the required tab name. For more info click here
Collection Name :
Tab Name Action

Manage Static LookUps

Static lookup service is used for filling the combo boxes with static array of data. Like for filling a combobox with Gender we can create a static lookup with list of Male and Female types. Key is the one which is displayed to the user and the value is for storing to DB etc.
  • Click on the "Add New Lookup Service".Given the service name and click ok.
  • Then select the lookup service from the list box and click on "Add New Lookup".
  • Provide the key and value information.
LookUp Name :
Key Value

Manage Dyanamic Lookups

Dynamic lookup service is used for filling the combo boxes with data from a collection. Need to provide Collection from which the data needs to be fetched. Key the filed which is shown in the UI and Value is the one which is stored to DB etc.
  • Click on "Add New Lookup Service".Give the required service name.
  • Click on "Edit".
  • Select the collectionname from which the data needs to be fetched.
  • Select the key and value fields.Click on "Done" to save the information.
Look Up Name TableName Key Value Action
Look Up Name :
Collection :
Key :
Value :

Note : Every collectionneeds a _id Column and with datatype as string. Do not modify or delete it. If any issue with button click, click on anywhere on the form and click on the button to work.

Name DataType IsNullable Delete

Start by creating the tables.

Set the properties for view, add, update and delete forms.

Click Generate code to get the code generated code.

A menu is a set of options presented to the user to find information

As shown below.

Create Collection by using the "Add New Collection" button.

To add fields and set properties use "Add New Field." button.

Tabs are used to show alternative views of the same group of information in a page.

As shown below.

Static lookup service is used for filling the combo boxes with static array of data. Like for filling a combobox with Gender we can create a static lookup with list of Male and Female types. Key is the one which is displayed to the user and the value is for storing to DB etc.

Dynamic lookup service is used for filling the combo boxes with data from a Collection. Need to provide Collection Name from which the data needs to be fetched. Key the filed which is shown in the UI and Value is the one which is stored to DB etc.

To create a form which Displays the list of records for the Collection in a Grid. Can set the properties like display in grid or not, included in search or not etc.

Example.

To craete Add/Update form. can set the display text of the form, control types for the fields, validation messages etc.

Example.

To craete Delete form. can set the display text of the form, and the message.

Example.