Next.js App Error Resolution on Firebase Studio
Budget: $50 – $100 CAD
Only real proposal, automatic proposal will be reject!!
Debug and Fix 404 Not Found Error in Next.js App Deployed on Firebase App Hosting
I have a web app built using Firebase Studio (an AI-powered development tool that generates code for full-stack apps). The app is based on Next.js (version 15.3.3 with Turbopack) and deployed via Firebase App Hosting, which proxies to Google Cloud Run. I'm encountering a persistent 404 "Not Found" error on the root path (/) in both local development mode and the live deployed version. This prevents the app from loading properly, and I need an experienced developer to diagnose and patch the issue quickly.
The problem started after iterative changes in Firebase Studio, and it seems related to missing or misconfigured routing in Next.js, possible duplicate directories, and a CORS warning in dev mode. I've tried basic troubleshooting (e.g., checking for root pages, hard restarts), but need professional help to resolve it without breaking other parts of the app.
This is a small, targeted fix—likely 2-4 hours of work for someone familiar with Next.js and Firebase. Once fixed, the app should load correctly at the root URL locally and on deployment.
Likely causes: Missing app/page.tsx or src/app/page.tsx, duplicate app/ directories, CORS block for Cloud Workstations previews.
The app may involve AI integrations like Gemini, but the error seems frontend/routing-focused. I'll provide access to the Firebase project, Studio workspace, and code repo (via GitHub or shared access) for debugging.
Requirements:
Skills Needed:
Strong experience with Next.js (App Router, Turbopack, dev configs like allowedDevOrigins).
Firebase expertise: Studio, App Hosting, Cloud Run, CLI tools (firebase-tools).
Debugging: Analyzing logs (Cloud Logging, build logs), local emulation, CORS issues.
Bonus: Familiarity with Google Cloud Workstations or AI-generated code quirks.
Tasks:
Review provided logs, code, and Firebase console access.
Fix the root path 404 (e.g., add/generate missing page.tsx, resolve directory conflicts).
Address CORS warning by updating next.config.js.
Test locally (npm run dev) and ensure preview works in Firebase Studio.
Redeploy and verify no 404 on live URL.
Document changes and any preventive tips.
Make also a backup function, so I can backup next time
Debug and Fix 404 Not Found Error in Next.js App Deployed on Firebase App Hosting
I have a web app built using Firebase Studio (an AI-powered development tool that generates code for full-stack apps). The app is based on Next.js (version 15.3.3 with Turbopack) and deployed via Firebase App Hosting, which proxies to Google Cloud Run. I'm encountering a persistent 404 "Not Found" error on the root path (/) in both local development mode and the live deployed version. This prevents the app from loading properly, and I need an experienced developer to diagnose and patch the issue quickly.
The problem started after iterative changes in Firebase Studio, and it seems related to missing or misconfigured routing in Next.js, possible duplicate directories, and a CORS warning in dev mode. I've tried basic troubleshooting (e.g., checking for root pages, hard restarts), but need professional help to resolve it without breaking other parts of the app.
This is a small, targeted fix—likely 2-4 hours of work for someone familiar with Next.js and Firebase. Once fixed, the app should load correctly at the root URL locally and on deployment.
Likely causes: Missing app/page.tsx or src/app/page.tsx, duplicate app/ directories, CORS block for Cloud Workstations previews.
The app may involve AI integrations like Gemini, but the error seems frontend/routing-focused. I'll provide access to the Firebase project, Studio workspace, and code repo (via GitHub or shared access) for debugging.
Requirements:
Skills Needed:
Strong experience with Next.js (App Router, Turbopack, dev configs like allowedDevOrigins).
Firebase expertise: Studio, App Hosting, Cloud Run, CLI tools (firebase-tools).
Debugging: Analyzing logs (Cloud Logging, build logs), local emulation, CORS issues.
Bonus: Familiarity with Google Cloud Workstations or AI-generated code quirks.
Tasks:
Review provided logs, code, and Firebase console access.
Fix the root path 404 (e.g., add/generate missing page.tsx, resolve directory conflicts).
Address CORS warning by updating next.config.js.
Test locally (npm run dev) and ensure preview works in Firebase Studio.
Redeploy and verify no 404 on live URL.
Document changes and any preventive tips.
Make also a backup function, so I can backup next time