Get hands-on experience with 20+ free Google Cloud products and $300 in free credit for new customers.

Getting Error on deploying Full stack mern application on google app engine

I want delploy a full stack mern application on google app engine.I am trying to deploy
backend and then frontend When I run the command gcloud app deploy on google
cloud sdk terminal.The app is getting deployed, the app url is getting generated. But when I open
the link the webpage is not getting displayed and and on webpage its showing Cannot GET / and
then when we inspect and see the console its showing Failed to load resource: the server responded
with a status of 404 (). And when I run the same command to deploy frontend I am getting the
error, Error: Not Found The requested URL / was not found on this server( 404 Not Found ). While
the app is running perfectly on local host and mongo connection is also established the app is
causing above error.

my project structure :-
MERN STACK PROJECT
project-root/
|-- backend/
| |-- models/
| | |-- Book.js
| |-- routes/
| | |-- api/
| | | |-- routes.js
| |-- config/
| | |-- db.js
| |-- node_modules/
| |-- app.yaml
| |-- app.js
| |-- package.json
| |-- package-lock.json
|-- frontend/
| |-- package-lock.json
| |-- my-app/
| | |-- src/
| | | |-- components/
| | | | |-- BookCard.js
| | | | |-- CreateBook.js
| | | | |-- ShowBookList.js
| | | | |-- UpdateBookInfo.js
| | | | |-- ShowBookDetails.js
| | | |-- App.js
| | | |-- App.css
| | | |-- App.test.js
| | | | ... (other React app files)
| | |-- public/
| | | |-- index.html
| |-- app.yaml
| |-- package.json
| |-- package-lock.json
| |-- .gitignore
| |-- .cloudignore

And my app.yaml files for frontend and backend :-

---Backend :- app.yaml file:-
runtime: nodejs18
instance_class: F2
env_variables:
MONGODB_URI:
"mongodb+srv://aakashmahadik2310:0glAjLcwwvYVEJxq@cluster0.zc70kvw.mongodb.net/?retryWrites=true&w=majority"
handlers:
- url: /api/.*
script: auto

---Frontend app.yaml file :-
runtime: nodejs18
handlers:
- url: /
static_files: my-app/build/index.html
upload: my-app/build/index.html
- url: /(.*)
static_files: my-app/build/\1
upload: my-app/build/(.*)

1 1 750
1 REPLY 1

Hello @AakashMahadik!

Welcome to the Google Cloud Community!

Check the path of your index.html. I have noticed in your frontend app.yaml file that your static_files and upload path both contain /build path. Upon checking your project structure, the index.html seems to be inside the my-app/public/index.html. 

Change your static_files and upload path to my-app/public/index.html.

Let me know if it helped, thanks!

Top Solution Authors