Frontend Commands

v0.4.8Updated for ɳSelf v0.4.8

The nself frontend command manages frontend applications integrated with ɳSelf backends. Track deployments, manage environment variables, and integrate with deployment providers like Vercel and Netlify.

Frontend Management Features

  • Vercel/Netlify: Integration with popular deployment platforms
  • Nginx Routing: Automatic proxy configuration for all frontends
  • Environment Variables: Framework-specific env var generation
  • Deployment Tracking: Status and logs for frontend deployments

Usage

nself frontend <subcommand> [options]

Subcommands

nself frontend status (default)

Show frontend deployment status.

nself frontend                  # Show all frontends
nself frontend status           # Same as above

nself frontend list

List configured frontend apps.

nself frontend list             # List names
nself frontend list --json      # JSON output

nself frontend add

Add a new frontend application.

nself frontend add <name> [options]

# Options:
#   --port <port>        Development port
#   --route <route>      Subdomain route

# Examples
nself frontend add webapp --port 3000
nself frontend add admin --port 3001 --route admin-ui

nself frontend remove

Remove a frontend application.

nself frontend remove <name>

# Example
nself frontend remove webapp

nself frontend deploy

Deploy frontend (Vercel/Netlify integration).

nself frontend deploy <name> [options]

# Options:
#   --env <env>          Target environment (default: staging)

# Examples
nself frontend deploy webapp              # Deploy to staging
nself frontend deploy webapp --env prod   # Deploy to production

nself frontend logs

View frontend build/deploy logs.

nself frontend logs <name> [options]

# Options:
#   --limit <n>          Number of entries (default: 20)

# Examples
nself frontend logs webapp           # Recent logs
nself frontend logs webapp --limit 50  # Last 50 entries

nself frontend env

Show environment variables for frontend.

nself frontend env <name> [options]

# Options:
#   --json               Output as JSON

# Examples
nself frontend env webapp           # Show env vars
nself frontend env webapp --json    # JSON output

Options

OptionDescriptionDefault
--port NFrontend port3000
--route PATHRoute prefixapp name
--provider NAMEDeployment providerauto-detect
--env NAMETarget environmentproduction
--limit NLog entries to show20
--jsonOutput in JSON formatfalse

Configuration

Frontends are configured in .env:

# Frontend Apps
FRONTEND_APP_1_NAME=webapp
FRONTEND_APP_1_PORT=3000
FRONTEND_APP_1_ROUTE=app

FRONTEND_APP_2_NAME=admin
FRONTEND_APP_2_PORT=3001
FRONTEND_APP_2_ROUTE=admin

Environment Variables

The env subcommand generates framework-specific variables:

Next.js

NEXT_PUBLIC_GRAPHQL_URL=https://api.local.nself.org/v1/graphql
NEXT_PUBLIC_AUTH_URL=https://auth.local.nself.org
NEXT_PUBLIC_STORAGE_URL=https://minio.local.nself.org

Vite

VITE_GRAPHQL_URL=https://api.local.nself.org/v1/graphql
VITE_AUTH_URL=https://auth.local.nself.org

Create React App

REACT_APP_GRAPHQL_URL=https://api.local.nself.org/v1/graphql
REACT_APP_AUTH_URL=https://auth.local.nself.org

Deployment Providers

Vercel

If vercel.json or .vercel/ directory exists:

nself frontend deploy webapp           # Deploy preview
nself frontend deploy webapp --env prod  # Deploy production

Requires: vercel CLI (npm i -g vercel)

Netlify

If netlify.toml or .netlify/ directory exists:

nself frontend deploy webapp           # Deploy preview
nself frontend deploy webapp --env prod  # Deploy production

Requires: netlify CLI (npm i -g netlify-cli)

Output Example

  ➞ Frontend Applications

  Name                 Port     Route           Status       URL
  ----                 ----     -----           ------       ---
  webapp               3000     app             running      https://app.local.nself.org
  admin                3001     admin           stopped      https://admin.local.nself.org

  ➞ Deployment Integrations

  ✓ Vercel configured

Related Commands