How do I connect a react UI to a nodeJS backend ?

Question

I am currently building a nodejs application using the azure cognitive services API specifically for Text-To-Speech, right now I am building a front end in React so that the user can edit the SSML ( Speech Synthesis Markup Language ) and edit different attributes of the speech with a simple UI which I am currently building.

Just for reference, this https://cloud.google.com/text-to-speech/docs/ssml is what SSML looks like, the tags I am trying to turn into buttons/ sliders etc are things like speech tone, pitch and all that.

I just have a few questions and hopefully someone can guide me in the right direction.How would I go about to fetch the SSML attributes from the backend to the frontend ?Do I need to use express ?What are some things I should think about for this project so I dont fumble around like an idiot trying to do the wrong things ?
Appreciate the time you take answering this :)

Answer 1

Thanks for your reply.

If the changes should be made by the user, here is an example with Electron.js for building desktop app:

Server side script:
https://github.com/bradtraversy/electronshoppinglist/blob/master/main.js

Notice the ipcMain.on({event)},....
at line 53, it is listening to data change posted by addWindow and then throwing new content to mainWindow.

Here is the video tutorial:
https://youtu.be/kN1Czs0m1SU

Hope this example illustrates the flow of states, from frontend to backend, back to frontend.

Good luck with your interesting project.

Answer 2

Gordon Thanks for the reply Gordon, the changes are only gonna be made by the user.

Answer 3

@Gordon Yes, this definately points me in the right direction, about to pull an all nighter.
Thank you so much Gordon

Answer 4

that depends on whether the change is made by frontend user only or not.

If the changes are made by others and real-time, you need to use web socket

https://stackoverflow.com/questions/24858752/how-to-push-data-to-client-using-node

if the changes are made by the current user only, add an event listener on the server side script, once the states change, update the client result.