2

I have a simple testing project with NodeJS and ReactJS

.
├── server
└── web
  • Server - Is for nodejs
  • Web - Is for Reactjs

I know how to host a single react project.

Is there a way to do that?

1 Answer 1

1

Assuming the 'server' is an Express application, you can initialize Cloud Functions in the same directory and use a onRequest() function. You just need to pass the Express app instance in it and you won't have to refactor much of your code. Try running firebase init and initialise Cloud functions and Firebase hosting if you haven't already. If the CLI asks for a directory name for hosting, then enter build (the directory created when you build your React app)

Your directory structure should look something like this now:

app_name/
├─ build/ (React build)
├─ functions/ (created by Firebase CLI for Functions)
│  ├─ index.js
├─ web/ (React app)

Then move the contents of "server" in function and pass the Express app instance in index.js as shown below:

const app = express(); 
// ... routers

exports.api = functions.https.onRequest(app);

Then make sure all the directory names are updated in firebase.json file. It should look this:

{
  "functions": {
    "predeploy": "npm --prefix \"$RESOURCE_DIR\" run build",
    "source": "functions"
  },
  "hosting": {
    "public": "build",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

Now you can deploy both the service by:

firebase deploy --only functions,hosting

You must update the API URL in your web app with the Cloud Function's URL. It should be shown in the CLI once you deploy it.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.