Skip to main content

​
Overview

Quality Hub GINEZ uses environment variables to configure external integrations and application settings. All sensitive configuration should be stored in a .env.local file that is never committed to version control.
Never commit .env.local to your repository. The file contains sensitive credentials and API keys.

​
Setup Instructions

  1. Copy the example environment file:
cp .env.example .env.local
  1. Fill in the actual values for each variable
  2. Restart your development server for changes to take effect

​
Environment Variables Reference

​
Google Sheets Integration

These variables configure the CSV data sources for the product catalog.
​
SHEET_MP_CSV_URL
string
required
Materia Prima (Raw Materials) CSV URLGoogle Sheets published CSV URL for raw materials catalog. This sheet contains all raw material specifications and documentation links.Format: https://docs.google.com/spreadsheets/d/e/YOUR_ID/pub?gid=SHEET_ID_MP&single=true&output=csvHow to get this URL:
  1. Open your Google Sheet
  2. Go to File → Share → Publish to web
  3. Select the specific sheet/tab for Raw Materials
  4. Choose “Comma-separated values (.csv)” format
  5. Click “Publish” and copy the generated URL
​
SHEET_PT_CSV_URL
string
required
Producto Terminado (Finished Products) CSV URLGoogle Sheets published CSV URL for finished products catalog. This sheet contains all finished product specifications and documentation links.Format: https://docs.google.com/spreadsheets/d/e/YOUR_ID/pub?gid=SHEET_ID_PT&single=true&output=csvHow to get this URL:
  1. Open your Google Sheet
  2. Go to File → Share → Publish to web
  3. Select the specific sheet/tab for Finished Products
  4. Choose “Comma-separated values (.csv)” format
  5. Click “Publish” and copy the generated URL
The catalog syncs on every page load. For better performance in production, consider implementing caching with periodic revalidation.

​
Next.js Configuration

​
NEXT_PUBLIC_BASE_PATH
string
default:""
Application Base PathOptional base path for the application if deployed to a subdirectory. Leave empty for root deployment.Example: If deploying to https://example.com/quality-hub, set:
NEXT_PUBLIC_BASE_PATH="/quality-hub"
Default: Empty string (root path)

​
Supabase Configuration

These variables connect the application to your Supabase project for authentication and database access.
​
NEXT_PUBLIC_SUPABASE_URL
string
required
Supabase Project URLThe public URL for your Supabase project. This is safe to expose in the browser.Format: https://your-project-id.supabase.coWhere to find it:
  1. Go to Supabase Dashboard
  2. Select your project
  3. Navigate to Settings → API
  4. Copy the “Project URL” value
Example:
NEXT_PUBLIC_SUPABASE_URL="https://xyzcompany.supabase.co"
​
NEXT_PUBLIC_SUPABASE_ANON_KEY
string
required
Supabase Anonymous KeyThe public anonymous key for browser-side Supabase client initialization. This key is safe to expose as it respects Row Level Security (RLS) policies.Where to find it:
  1. Go to Supabase Dashboard
  2. Select your project
  3. Navigate to Settings → API
  4. Copy the “anon public” key from the “Project API keys” section
Security: This key is restricted by RLS policies and is safe for client-side use.
​
SUPABASE_SERVICE_ROLE_KEY
string
Supabase Service Role Key (Server-side only)
CRITICAL: This key bypasses Row Level Security. NEVER expose this in client-side code or commit it to version control.
Used for server-side operations that require elevated privileges.Where to find it:
  1. Go to Supabase Dashboard
  2. Select your project
  3. Navigate to Settings → API
  4. Copy the “service_role” key (click to reveal)
Usage: Only use in server-side API routes or functions. Never import this in client components.Example:
// ✅ Correct: Server-side only
// app/api/admin/route.ts
import { createClient } from '@supabase/supabase-js'

const supabase = createClient(
  process.env.NEXT_PUBLIC_SUPABASE_URL!,
  process.env.SUPABASE_SERVICE_ROLE_KEY! // Only accessible server-side
)

// ❌ Wrong: Never use in client components
// components/MyComponent.tsx
const supabase = createClient(
  process.env.NEXT_PUBLIC_SUPABASE_URL!,
  process.env.SUPABASE_SERVICE_ROLE_KEY! // DANGER: Exposes admin key
)

​
Complete Example File

# ================================================
# QualityHub - Variables de Entorno
# ================================================
# Copia este archivo como .env.local y rellena los valores reales.
# NUNCA commitees .env.local al repositorio.
#
#   cp .env.example .env.local
#
# ================================================

# --- Google Sheets (URLs de datos CSV) ---
SHEET_MP_CSV_URL="https://docs.google.com/spreadsheets/d/e/TU_ID/pub?gid=ID_HOJA_MP&single=true&output=csv"
SHEET_PT_CSV_URL="https://docs.google.com/spreadsheets/d/e/TU_ID/pub?gid=ID_HOJA_PT&single=true&output=csv"

# --- Next.js ---
NEXT_PUBLIC_BASE_PATH=""

# --- Supabase ---
# Obtén estos valores en: https://supabase.com/dashboard/project/TU_PROYECTO/settings/api
NEXT_PUBLIC_SUPABASE_URL="https://tu-proyecto.supabase.co"
NEXT_PUBLIC_SUPABASE_ANON_KEY="tu-anon-key-aqui"

# --- Supabase Service Role (SOLO para server-side, NUNCA exponer en frontend) ---
# SUPABASE_SERVICE_ROLE_KEY="tu-service-role-key-aqui"

​
Validation

After configuring your environment variables, verify they’re loaded correctly: 
npm run dev
Check the browser console for any connection errors. You should see:
  • ✅ Successful Supabase client initialization
  • ✅ Product catalog loading from Google Sheets
  • ✅ Authentication system responding
Use console.log(process.env.NEXT_PUBLIC_SUPABASE_URL) temporarily to verify variables are loaded. Remove debug logs before committing.

​
Troubleshooting

Solution: Ensure your .env.local file exists in the project root and contains all required variables. Restart the dev server after making changes.
Check:
  • URL format is correct (should start with https:// and end with .supabase.co)
  • Anonymous key is copied completely (usually 200+ characters)
  • No extra spaces or quotes in the values
  • RLS policies are configured (see Supabase Setup)
Verify:
  • Sheet is published to web (File → Share → Publish to web)
  • URL format includes /pub? and output=csv
  • Sheet permissions allow public access
  • CSV structure matches expected format
Try:
  1. Stop the dev server (Ctrl+C)
  2. Delete .next folder: rm -rf .next
  3. Restart: npm run dev
Environment variables are cached during build. Fresh restart required.

​
Security Best Practices

Never Commit Secrets

Add .env.local to .gitignore. Use .env.example for documentation only.

Rotate Keys Regularly

Periodically regenerate API keys, especially if exposed or when team members leave.

Use Separate Environments

Maintain separate Supabase projects and Google Sheets for development, staging, and production.

Validate on Startup

Implement runtime validation to ensure all required variables are present before app initialization.

​
Next Steps

Supabase Setup

Configure your Supabase database tables and Row Level Security policies

Google Sheets Integration

Set up your product catalog spreadsheets for the application

Build docs developers (and LLMs) love

Get started for freeTalk to us