Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/sergio-salcedo-dev/excel-product-manager/llms.txt

Use this file to discover all available pages before exploring further.

Preoc Product Manager is a Next.js 15 application that can be deployed to any platform that supports Node.js. The repository ships with firebase-tools as a devDependency and the Next.js build is configured with output: 'standalone', making it particularly well-suited for Firebase App Hosting — though the same build artifact can be served on any Node.js-compatible host such as Vercel, Railway, or Render. Before deploying, ensure the NEXT_PUBLIC_GEMINI_API_KEY environment variable is set in the build environment: Next.js inlines all NEXT_PUBLIC_* variables into the client bundle at compile time, so the key must be available when npm run build runs — not only at server start.

​
Build for Production

Before deploying to any platform, generate an optimized production build: 
npm run build
next build compiles the application and writes the output to the .next directory. Because the project uses output: 'standalone', Next.js also emits a self-contained .next/standalone folder that bundles only the Node.js code needed to run the server — minimizing the deployment footprint. All Gemini AI search calls are initiated from the browser using NEXT_PUBLIC_GEMINI_API_KEY, which Next.js inlines into the client bundle at build time. Ensure this variable is present in the build environment so it is correctly embedded before you serve the app.

​
Firebase App Hosting

Firebase App Hosting is the primary deployment target for this project. It natively understands Next.js 15, handles server components, streaming, and image optimization automatically, and integrates with Google Cloud secrets management — which makes injecting the Gemini API key straightforward.
Firebase App Hosting natively supports Next.js 15 with zero additional configuration. Server components, streaming responses, and Next.js image optimization are all handled automatically by the platform.
1

Install the Firebase CLI

The Firebase CLI is already listed as a devDependency (firebase-tools v15), so you can use it via npx without a global install. Alternatively, install it globally for convenience:
npm install -g firebase-tools
To use the bundled version without a global install, prefix every firebase command with npx:
npx firebase --version
2

Authenticate with Firebase

Log in to your Google account and authorize the CLI:
firebase login
This opens a browser window for OAuth authentication. Once complete, the CLI stores credentials locally.
3

Initialize Firebase Hosting

From the project root, run the initialization wizard:
firebase init hosting
When prompted:
  • Select your existing Firebase project or create a new one.
  • Confirm the framework as Next.js — the CLI detects next.config.ts automatically.
  • Accept the defaults for the public directory and rewrites; App Hosting manages routing for Next.js apps natively.
4

Configure the Gemini API key

The application reads NEXT_PUBLIC_GEMINI_API_KEY at build time — Next.js inlines NEXT_PUBLIC_* variables into the client bundle during next build, so the variable must be present in the build environment, not just the runtime environment. Set it as a build-time environment variable in Firebase App Hosting:
  1. Open the Firebase Console and navigate to your project.
  2. Go to App Hosting → Environment variables (or Secrets if you prefer encrypted storage).
  3. Add a variable named NEXT_PUBLIC_GEMINI_API_KEY and paste your Google Gemini API key as the value.
If the project was created in Google AI Studio, the plain GEMINI_API_KEY secret is injected automatically at runtime from your AI Studio user secrets. For Firebase App Hosting deployments outside AI Studio, add NEXT_PUBLIC_GEMINI_API_KEY explicitly so that Next.js can inline it into the client bundle during the build step.
5

Deploy to Firebase

Push the application live:
firebase deploy
The CLI builds, uploads, and routes traffic to the new revision. When the command completes it prints the public URL of your deployed application.

​
Other Node.js Hosts

The standalone output produced by npm run build runs on any Node.js host. The generic deployment flow is as follows:
  1. Set environment variables on your host platform before the build step. Because NEXT_PUBLIC_GEMINI_API_KEY is inlined at build time, it must be available when you run npm run build, not only at server start:
    VariableValue
    NEXT_PUBLIC_GEMINI_API_KEYYour Google Gemini API key (inlined into the client bundle at build time)
    APP_URLThe full public URL of the deployed app (e.g. https://preoc.example.com)
  2. Build the application — either trigger npm run build in your CI pipeline or let the host platform run it automatically on push: 
    npm run build
  3. Start the server using the start script, which runs next start and listens on port 3000 by default: 
    npm run start
Vercel, Railway, and Render all detect Next.js 15 projects automatically and offer zero-config deployments — simply connect your repository and set the two environment variables above in each platform’s dashboard.

​
Environment Variables in Production

Both variables must be present in the build environment so that Next.js can inline NEXT_PUBLIC_GEMINI_API_KEY into the client bundle. APP_URL is read at runtime.
VariableRequiredDescription
NEXT_PUBLIC_GEMINI_API_KEYFor AI featuresGoogle Gemini API key inlined into the browser bundle at build time; used for CYPE Precios and Mercado AI lookups
APP_URLRecommendedFull URL of the deployed application, used for self-referential links and API endpoints
Because NEXT_PUBLIC_GEMINI_API_KEY is embedded in the client bundle, it is visible to anyone who inspects your JavaScript. In production, restrict the key to your app’s domain in the Google Cloud Console under APIs & Services → Credentials by adding an HTTP referrer restriction. This prevents the key from being used by unauthorized origins even if it is discovered in the bundle.

​
Checking the Deployment

After a successful deploy, verify the application end-to-end:
  1. Open the deployed URL in a browser and confirm the product dashboard loads with the 20 default construction products visible in the catalog table.
  2. Use the CYPE Precios search field to run a simple query such as cemento and confirm that AI-powered pricing results are returned — this validates that NEXT_PUBLIC_GEMINI_API_KEY was correctly set during the build and is active in the production bundle.
  3. Click Export to Excel and confirm that the download produces a file named productos.xlsx containing the current product list — this validates that the xlsx package is bundled and served correctly.
If any of these checks fail, inspect the platform’s runtime logs for missing environment variables or build errors before redeploying.

Build docs developers (and LLMs) love

Get started for freeTalk to us