Question

0

70

Views

Dump state into json or tsv (backend)

Many of the tutorials for survey / forms in React tend to cover front-end mechanics only. In my case, I pretty much have the front-end where I want it but have come to realize I know virtually nothing about back-end programming.

I thought it best to take baby steps, so maybe adding a line to a json/tsv after the user clicks a button would be a reasonable goal. I'm imagining the user manipulates all the bells and whistles I have then once he/she clicks "submit" then a new row is added to a "master_data.tsv" file on the back end.

Just for illustration, the portion of the state I would like to save is:

  state = { 
    selectBoxes: [
        {id:1, strategies:['Strat1','Strat2', 'Strat3','Strat4','Strat5']},

    ]

For context, this state gets passed down to drop-down menu components that have event listeners to record the user's choice. I have it so that the state is updated to reflect the user's desired choice. But I have not figured out how to dump the data on the back end once the choice is selected and the user click's "submit."

Question

Assuming click-flow:

Toggle dropdown menu -> choose item -> click "submit" button

How would I add a new row to master_data.tsv after each "submit" event?

(can ignore unique user qualification and all the fancy stuff, maybe we can settle for each new row has an id though. )

7 months ago · Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Answer 1 · 2022-07-10T15:08:09.340Z

I would recommend taking a step back and first, thinking about the actual flow and data persistence of your application.

I would recommend creating a backend server (any language) that offers you to post the data to it via an API endpoint (usually a REST API with a POST endpoint) After you receive your data, you have to persist it. Either in a database, in a session or on disk. The last step is to retrieve the data in the desired format (tsv). Either create another endpoint to return the data, or return the entire file already on POST. Here is an example flow of how it could look like

Front-End: Send data on submitting to the backend (POST /entries)
Backend: Receive data and store it (disk, database …)
Front-End: Receive data from backend (GET /entries)
Backend: Returns entries as tsv

This way you are rather flexible and decoupled. Later on, you could exchange the format easily to JSON, XML, CSV … Your source of truth should always be your storage layer (database, file on disk)