All Tutorials
AI Agents
Intermediate
15 min

Build & Deploy a Full-Stack App with Claude Code

Go from an idea to a production full-stack application in 15 minutes. Claude Code scaffolds the code, provisions the infrastructure, and deploys everything to Open Source Cloud — all through natural language.

What You'll Learn

Scaffold a full-stack app with Claude Code
Provision databases and infrastructure via MCP
Deploy frontend and backend to production
Connect services together automatically

Prerequisites

  • Claude Code CLI installed (npm install -g @anthropic-ai/claude-code)
  • OSC MCP server configured (see Getting Started tutorial)
  • An authenticated OSC account
  • A GitHub account (for deployment)

Step-by-Step Guide

1

Set Up Your Project

Create a new project directory and start Claude Code:

mkdir my-task-app && cd my-task-app
claude

Tip: If you haven't set up Claude Code with OSC yet, follow our Getting Started tutorial first.

2

Describe Your Application

Tell Claude Code what you want to build. Be specific about the stack and features:

> Build a task tracker application with:
> - React frontend with a clean UI for creating, editing, and completing tasks
> - Express.js API with CRUD endpoints for tasks
> - PostgreSQL database for persistent storage
> - Include user authentication with email/password

Claude Code will scaffold the entire project — frontend, backend, and database schema — in your project directory.

3

Create the Database on OSC

Once the code is scaffolded, ask Claude to provision the database:

> Create a PostgreSQL database on Open Source Cloud for this app

Claude uses the OSC MCP tools to create a PostgreSQL instance and automatically configures the connection string in your app's environment variables.

Note: Save the database credentials shown by Claude. You'll need them if you want to connect directly via a database client.

4

Deploy the Backend API

Deploy your Express API as a custom app on OSC:

> Push the code to GitHub and deploy the backend API to Open Source Cloud

Claude will create a GitHub repository, push your code, and use the OSC MCP tools to deploy it as a Node.js application. You'll get a live API URL.

5

Deploy the Frontend

Finally, deploy the React frontend pointing to your live API:

> Deploy the frontend to OSC and connect it to the deployed API

Claude configures the frontend with the correct API URL, deploys it to OSC, and returns your production URL. Your full-stack app is now live!

Tip: Ask Claude to set up a custom domain if you want a branded URL for your app.

Your App is Live!

You've built and deployed a complete full-stack application using only natural language. Your task tracker is running in production with a React frontend, Express API, and PostgreSQL database — all on Open Source Cloud.

Built with This Approach

Streaming Tech TV+

A complete streaming service with 14 OSC services, built in 36 hours by 1 human directing 6 AI agents.

View example →

Community Examples

CRM systems, game trackers, medication apps — all built with AI agents and deployed on OSC.

Browse examples →

What Will You Build?

The full OSC service catalog is at your fingertips. Ask Claude Code to build anything — databases, APIs, frontends, pipelines.

Get Started FreeMore Tutorials