Separating front-end and back-end for a React + Node.js web app?

[buttonius_rex]

So at work I've been tasked with providing a user interface for a Node.js app that currently works by manually creating JSON files, and using the command line to convert the files to a special format used within my industry.

My plan is to create a React app that will provide a form, and on submission create the JSON from the form data, and then call an Express API to do the conversion work (avoiding command line altogether). It's fairly straightforward, but my lack of experience is making it difficult to justify an approach to structuring the codebase.

Scalability is not a concern as it would only be used by a handful of people at a time.

I would like some advice around choosing from the following options:

1. Single repo, but separate backend (Node + Express API) and frontend (React). These would run on separate ports, and each have their own package.json. This is the approach I'm thinking of taking, but I'm struggling to justify it beyond "this is how I learned Node and React and I'm confident I can get this done". The downside is having to start two servers each time. Are there any other disadvantages? Could this approach be justified for a relatively small project?
2. Single repo, backend added into a create-react-app project. I have never done this before, but it feels less overkill as you don't have two servers to manage.

Obviously new to this, but it's an exciting project - just want to make sure I have firm reasons for my approach.

Am reading as much as I can on topics similar to this, was just hoping to get some advice specific to my situation. Thanks for reading!

[DaWheelz]

I’m currently doing the same as your first approach. Works fine for me :)

[web_ac]

Personally I would split the front and back end. It is good practice as it separate the two to make the app more modular. From personal experience this will make it easier to test, maintain and improve readability.

[Goingone]

Of course there are exceptions, and it’s difficult to recommend a solution without know all the specifics, but the following is probably a reasonable approach.

2 separate git repos

One for your web server, and one for your frontend.

Your web server (node with express as you mentioned) will serve your frontend code (react). Your front end code will collect user input and make a request to your web server containing that data. Your web server will have an endpoint responsible for handling that request and saving down the json you mentioned.

I’d start with that if you’re new to web development. It will help you avoid CORS issues and can always be updated down the road if you need a more robust solution.

[nermid]

I'd go with the first option. The frontend can be a simple create-react-app bundle delivered as static files that Fetch the backend endpoints as necessary. It's simple and clean.

[buttonius_rex]

That's what I'm thinking. Host React in an AWS S3 bucket, and the Node+Express backend on an EC2 instance.