# Next.js

Next.js is a full-stack React framework. This guide covers running Next.js with Specific.

## Configuration

To deploy a Next.js application with Specific, use the standard `next build` and `next start` commands:

```hcl
build "web" {
  base = "node"
  command = "npm run build"
}

service "web" {
  build = build.web
  command = "npm start"

  endpoint {
    public = true
  }

  env = {
    PORT = port
  }

  dev {
    command = "npm run dev"
  }
}
```

Next.js reads `PORT` from the environment automatically, so no additional configuration is needed.

## Migrating existing secrets

If the project has existing secrets in `.env`, `.env.local`, or similar files, move them to `specific.local` so they don't need to be re-entered when running `specific dev`:

```hcl
# specific.local
secrets {
  stripe_api_key = "sk_test_..."
  database_password = "..."
}

configs {
  api_url = "https://api.example.com"
}
```

If there are secrets that are not defined in `specific.hcl` but exist in `.env`, ask the user about it and perhaps add configs/secrets for them.

## Important note on pre-rendering during builds

During a build, Next.js will load a lot of code to perform pre-rendering. That code can not reference any environments variables from `specific.hcl`, like database URLs or API keys from secrets, as those are not available during the build and will cause it to fail. Ensure all code that relies on these env vars DOES NOT get executed during the build phase.
