new-app

name: new-app description: | Scaffold a new Cumulocity application using the @c8y/websdk Angular schematic without human interaction. Covers Angular CLI installation, app generation, schematic setup, AI tools configuration, dev server, and build commands. Triggers: new app, scaffold, create application, ng add websdk, setup cumulocity app, new cumulocity project. version: 1.0.1 category: scaffolding triggers: - new app - scaffold - create application - ng add websdk - setup cumulocity app - new cumulocity project - websdk schematic - bootstrap application tags: - angular - cumulocity - scaffolding - websdk - cli - setup

New Cumulocity Application Skill

Overview

The @c8y/websdk Angular schematic scaffolds a custom Cumulocity application and wires it into the platform. This skill produces all CLI commands needed to go from zero to a running dev server without any interactive prompts.

Step 1 — Install Angular CLI

Install the Angular 20 CLI globally:

npm install @angular/cli@v20-lts -g

Why Angular 20? The @c8y/websdk schematic currently targets Angular 20.

Step 2 — Generate the Angular Application

Use these flags to avoid any interactive prompts:

ng new <appName> \
  --style=less \
  --routing=true \
  --ssr=false \
  --skip-git=true \
  --package-manager=npm \
  --interactive=false \
  --defaults

Navigate into the new directory:

cd <appName>

Step 3 — Add @c8y/websdk

Choosing a version

Check available dist-tags on npm to find the right version:

npm dist-tags @c8y/websdk

Common dist-tags:

Pass the tag directly to ng add:

ng add @c8y/websdk@y2026-lts

Or pin to an exact version:

ng add @c8y/websdk@1023.14.131

Fully non-interactive install

Use --application + --skip-confirmation to bypass all prompts:

ng add @c8y/websdk@y2026-lts \
  --application=@c8y/<appName>@<version> \
  --skip-confirmation

Where:

• <appName> must be one of (sorted by highest priority): sample-plugin,application,cockpit,tutorial,administration,codex,devicemanagement, hybrid, package-blueprint
• <version> is the exact package version from npm (e.g. 1023.14.160) — resolve it with npm view @c8y/websdk@<dist-tag> version

Example — cockpit base at 2026-lts:

ng add @c8y/websdk@y2026-lts \
  --application=@c8y/sample-plugin@1023.14.160 \
  --skip-confirmation

Step 4 — Configure AI Tools (Optional)

The schematic can write curated Cumulocity Web SDK guidelines into your project for AI coding assistants. This step is optional but strongly recommended.

Skip AI tools entirely

Passing --skip-confirmation skips AI tool setup automatically:

ng add @c8y/websdk@y2026-lts --application=@c8y/cockpit@$(npm view @c8y/websdk@y2026-lts version) --skip-confirmation

Configure specific AI tools non-interactively

Use the --ai-tools flag with a comma-separated list of tool names:

ng add @c8y/websdk --ai-tools=claude,github-copilot,gemini

Valid tool names: claude, github-copilot, gemini

To explicitly opt out:

ng add @c8y/websdk --ai-tools=none

Note: --ai-tools takes precedence over --skip-confirmation. When both flags are present, only the tools listed in --ai-tools are configured.

What gets written per tool

Each tool receives the same core content adapted to its configuration format:

• Project overview, TypeScript rules, Angular patterns, accessibility requirements
• Angular/TypeScript UI development guidelines
• Cypress e2e and Jest unit test conventions

The schematic overwrites files that match standard template names and preserves any custom files that don't match.

Step 5 — Run the Development Server

ng serve -u https://<yourTenant>.cumulocity.com/

Replace <yourTenant> with your Cumulocity tenant subdomain. The -u (or --url) flag points the dev server proxy at your tenant so API calls are forwarded correctly.

Step 6 — Build

ng build <appName>

Output lands in dist/<appName>/.

Complete Non-Interactive Quickstart

Copy-paste sequence for a fully automated setup:

# 1. Install Angular CLI (once per machine)
npm install @angular/cli@v20-lts -g

# 2. Scaffold the app
ng new my-app \
  --style=less \
  --routing=true \
  --ssr=false \
  --skip-git=true \
  --package-manager=npm \
  --interactive=false \
  --defaults

# 3. Enter directory
cd my-app

# 4. Resolve target version
C8Y_VERSION=$(npm view @c8y/websdk@y2026-lts version)

# 5. Add websdk schematic (no prompts, configure GitHub Copilot + Claude)
ng add @c8y/websdk@y2026-lts \
  --application=@c8y/cockpit@${C8Y_VERSION} \
  --ai-tools=github-copilot,claude

# 6. Start dev server
ng serve -u https://mytenant.cumulocity.com/

Reference