Skip to content

Integrate create-vara-app as default frontend bootstrap#16

Merged
ukint-vs merged 5 commits into
mainfrom
integrate-create-vara-app
Apr 3, 2026
Merged

Integrate create-vara-app as default frontend bootstrap#16
ukint-vs merged 5 commits into
mainfrom
integrate-create-vara-app

Conversation

@ukint-vs
Copy link
Copy Markdown
Member

@ukint-vs ukint-vs commented Apr 2, 2026

Summary

  • sails-frontend: Add "Greenfield Bootstrap" section directing agents to npx create-vara-app --idl before manual wiring
  • sails-new-app: Add step 8 routing to create-vara-app after gtest passes
  • ship-sails-app: Split frontend route into "new" (create-vara-app) vs "extend" (sails-frontend) paths
  • sails-frontend-and-gear-js reference: Add Quick Start section with create-vara-app command

Agents now use create-vara-app instead of building React frontends from scratch. The scaffold generates typed wrappers, wallet integration, event subscriptions, validation, and a debug panel from any Sails IDL.

What create-vara-app provides

npx create-vara-app my-dapp --idl path/to/service.idl
  • Typed query/transaction wrappers generated from IDL (str->string, u32->number, u64->string for precision)
  • React 18 + Vite 6 + TypeScript + Tailwind 3
  • Wallet integration (SubWallet, Polkadot.js, Talisman)
  • Live event subscriptions via sails-js 0.5.1
  • Client-side input validation
  • Debug panel with runtime IDL explorer and manual call interface
  • 37 vitest tests for the codegen pipeline
  • Correct signing feedback (signing -> submitted -> confirmed)

Test plan

  • Verified npx create-vara-app test-app creates a building project from npm registry
  • Verified npx create-vara-app test-app --idl service.idl works with custom IDLs
  • 37 vitest tests passing for type mapping, icon heuristics, helpers
  • Frontend builds with zero TypeScript errors

🤖 Generated with Claude Code

ukint-vs and others added 5 commits April 3, 2026 00:34
- sails-frontend: add Greenfield Bootstrap section directing agents
  to npx create-vara-app --idl before manual wiring
- sails-new-app: add step 8 routing to create-vara-app after gtest
- ship-sails-app: split frontend route into new (create-vara-app)
  vs extend (sails-frontend) paths
- sails-frontend-and-gear-js reference: add Quick Start section

Agents now use create-vara-app instead of building frontends from
scratch. The scaffold generates typed wrappers, wallet integration,
event subscriptions, and a debug panel from any Sails IDL.

Source: https://github.com/gear-foundation/create-vara-app
Published: create-vara-app@0.1.0 on npm

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Add npm and GitHub links to sails-frontend skill and reference doc
- Replace brittle "37 vitest tests" with generic coverage mention
- Broaden create-vara-app as default for any project needing a frontend
- Fix scaffold re-run path to use project root instead of ambiguous cd
- Add detection heuristic for which codegen path to use
- Make create-vara-app the primary recommendation in Default Decision

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Add prerequisite note: contract must be built before using --idl flag
- Add Minimal Path section for simple apps (4 steps, skip the rest)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@ukint-vs ukint-vs merged commit 844e3c5 into main Apr 3, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant