CODEWITHSUNDEEP
javascriptnode.jsreactjsexpressreact-fullstack
Adrian
Adrian

Reputation: 335

How to connect two applications React/Node?

Currently I have a problem with connecting two applications. They are independent. I would like to connect them into one application. First application: It is a login/registere form. It had been written in Node.js, Express.js, React.js using MySQL. Files structure is as follow:

enter image description here

Second application: It is a to_do_list. It had been written in Node.js using MySQL. Files stucture is as follow:

enter image description here

I would like to run this two application in two ways (make some type of template for future projects) : ad.1 First users register/login (www.example.com/) to application and then there is a redirect to to_do_list application (www.example.com/to_do_list). ad.2 First users see a to_do_list application (www.example.com/) and then if user want to change/ update something in to_do_list, it's require a login in so there is a redirect to login page(www.example.com/login).

I don't know how to proper connect this two applications (mainly how to create a proper files structure). I have two reasons but don't sure that is proper line of thinking. Currently this two applications run on two independent servers (every have own package.json and node start initialization).

For ad.1 : Create directory in Back-end part of register_app and copy all files from to_do_list app. Then install in package.js of register_app all require scripts that to_do_list uses. Finally I should make a proper redirections and dependences for all filles.

For ad.2: Create a folder called to_do_list and copy there all to_do_list app files. Create second folder called register/login and copy there all register/login_app files. Uses some type of proxy to connect this applications (but it is impossible to run two application on the same port so ... ?).

If you have any kind of reason how to in easy way connect this 2 apps I will be so grateful. I am at beggining of my fullstack way.

Upvotes: 1

Views: 373

Answers (2)

wc203
wc203

Reputation: 1217

You could use monorepo like yarn workspace or lerna.

Upvotes: 0

Violet Rosenzweig
Violet Rosenzweig

Reputation: 665

If you are passing non-sensitive data between the two pages, you could include the data as a query param (see this question)

If it is sensitive, then you should separate your backend and have one uniform API that both apps interact with, and the backend should be agnostic to which it is interacting with.

If you want to simply merge the two projects into one, then that should be simple as moving the files, updating references, and adding required packages.

Upvotes: 0

Related Questions