404 Error after Deploying from GitHub

[travelapphub (Cyrus)]

After connecting our private Github repo to Vercel we are receiving a 404 Error and I am not sure why. I am non technical.

We have a web application (MERN) that includes the app users can access, an admin panel web app that internal users can access, and a node back end. They are organized as 3 individual files in our GitHub:

1. Admin Panel – houses front end for admin panel
2. Node
3. React – houses the public facing app front end

Do each of these folders need to be deployed as separate projects OR does the Admin Panel need to be separate from the Node and React folders?

[system]

There’s another community post with 404 debugging tips that might be helpful. Please give these solutions a try and let us know how it goes.

Debugging 404 Errors

Sometimes things don’t go as expected when deploying a website. If you see a 404 on your site, that means the page or resource couldn’t be found. There are many possible causes, and the absence of something can be tricky debug if you don’t know where to look. Here are some things you can do to find the cause and fix it. Debugging Tips Check the error code If you see a mostly white screen with 404: NOT_FOUND along with a Code and and ID then you can click the blue info box below the error deta…

A human should be around soon to offer more advice. But you can also get helpful information quickly by asking v0.

[anshumanb (Anshuman Bhardwaj)]

Hi @travelapphub, welcome to the Vercel Community!

Thanks for reaching out here and providing the detailed context.

We recommend using 3 separate projects to make use of all the Vercel features and deliver the best user experience.

We’ve a detailed post about deploying full stacks applications like yours. It also discusses many troubleshooting ideas. Please give it a read:

Express 101: Everything about deploying your Express app on Vercel

Getting started Express.js is one of the most popular framework choices for building a backend using Node.js. If you are starting a new Express project and want to deploy it to Vercel, we recommend you to follow the Using Express.js with Vercel guide. Common patterns If you are coming from an existing project, we’ve put together this example repository to showcase the common development patterns for Express apps. We recommend hosting your frontend application on a separ…

[travelapphub (Cyrus)]

Hi @anshumanb Thank you for this response. Thanks for the clarification about separating our 2 front ends and 1 back end into 3 separate projects.

I took a look at the link you provided (Express 101) but it doesn’t clearly address the deployment issues I believe I am facing. Also, I mentioned I was non technical, so I would appreciate a clear and concise hand holding explanation. I am assuming many other non technical people evaluating your service, even for recommendation to their technical team will appreciate this guidance.

There is another company that offers a similar service to Vercel we deployed on, and they also separated into 3 folders, which worked, but I have a feeling that even if I separate these files on Vercel, there would be some deployment issue triggered on your side that I would need assistance with.

Our code should be otherwise in good shape for deployment given that it was able to be deployed on the other service.

Can someone help me?

[anshumanb (Anshuman Bhardwaj)]

Hi @travelapphub, thanks for sharing your concerns.

I’m sure your project will work fine with minimal changes on Vercel. We’re here to help you out. Feel free to post questions or issues you run into here and the community members will guide you or suggestion solutions.

[travelapphub (Cyrus)]

Can you extend my trial. I haven’t had enough time to try to get this to work

[anshumanb (Anshuman Bhardwaj)]

Hi @travelapphub, sorry to hear that. Good news is that you can use all Vercel features related to development on the Hobby plan.

Let me know if you run into any issues.