Dart Frog Part 5: Deploying Your Backend Service With Dart Globe 🌍

Source: Dev.to

Prerequisites (From Previous Parts)

• Dart Frog project from Part 4 (with auth, protected routes, in‑memory or simple DB).

• Globe account (sign up free at ).

• Globe CLI installed:

  dart pub global activate globe_cli

• Logged in:

  globe login

• Dart Frog CLI (already installed from the series).

• Build once locally:

  dart_frog build   # creates an optimized production binary in /build

Step 1: Prepare Your Project for Production

Globe auto‑detects Dart Frog projects, but a few tweaks ensure smooth sailing.

Listen on the Right Port

Dart Frog defaults to 8080, but Globe uses the PORT environment variable. Update main.dart (or wherever you start the server):

import 'dart:io';
import 'package:dart_frog/dart_frog.dart';

void main() async {
  final port = int.parse(Platform.environment['PORT'] ?? '8080');
  await serve(handler, InternetAddress.anyIPv4, port);
}

Secrets & Environment Variables

For the JWT secret (from Part 4), use Globe’s env‑vars dashboard instead of hard‑coding:

final secret = Platform.environment['JWT_SECRET'] ?? 'fallback-dev-secret';

CORS (If Needed)

Add any CORS middleware you require before the handler, e.g.:

import 'package:shelf_cors_headers/shelf_cors_headers.dart';

final handler = const Pipeline()
    .addMiddleware(corsHeaders())
    .addHandler(yourRouter);

Build Locally

dart_frog build

This compiles an AOT binary that Globe runs efficiently.

Deploy to Globe

From your project root:

globe deploy

• The CLI will guide you through creating or linking a project and choosing a name (e.g., todo-project).
• Globe detects the Dart Frog structure automatically, applies the appropriate preset, and builds the AOT binary.
• For a production‑grade deployment, add the --prod flag:

globe deploy --prod

After Success

• URL: https://your-project-name.globeapp.dev (or a custom domain later).

• Test endpoints: Use Postman or curl with the live URL, e.g.:

  curl -H "Authorization: Bearer <TOKEN>" https://todo-api-samuel.globeapp.dev/todos

Step 3: Post‑Deployment Tips

• Environment Variables: Dashboard → Project → Settings → Environment Variables → add JWT_SECRET, DB credentials, etc.
• Scaling & Performance: Auto‑scales on demand; edge‑caching where possible.
• Logs & Monitoring: Built‑in logs and metrics dashboard.
• Custom Domain: Add in settings (SSL is auto‑provisioned).
• CI/CD: Connect a GitHub repo for automatic deploys on push.
• Costs: Free tier is generous for starters; pay‑as‑you‑scale thereafter.

Testing Your Full‑Stack App Live

Update the Flutter app’s Dio baseUrl to point at your Globe URL:

final Dio _dio = Dio(BaseOptions(baseUrl: 'https://your-project-name.globeapp.dev'));

Run the Flutter app → CRUD Todos securely via the live backend. Full‑stack Dart in production!

Source Code

Show some ❤️ by starring the repo and following the author.