docs/developer/tutorial/introduction.mdx
This tutorial walks you through creating a complete Spree feature from scratch: a "Brands" feature that lets admins manage Product brands, exposes them through the Store API, and consumes them from TypeScript.
It's written for both backend and frontend developers. The Ruby you'll write is minimal and mostly generated — Spree's generators produce convention-correct models, admin UIs, and API endpoints, and the TypeScript SDK gives you typed access from your storefront. You don't need to be a Rails expert to follow along.
You need a running Spree app. The fastest path is create-spree-app — a Docker-based project with the Spree CLI, no local Ruby required:
npx create-spree-app@latest my-store
An existing app with Spree gems works just as well. Every command in this tutorial is shown in two forms — Spree CLI (runs inside Docker) and Without Spree CLI (runs directly on your machine) — pick the tab that matches your setup and ignore the other.
<Note> **create-spree-app projects:** run `spree eject` once before starting. Fresh projects use a prebuilt Docker image; ejecting switches to the dev setup that mounts `backend/` into the container, so the files the generators create land in your project (and reload live as you edit them). </Note> <Tip> Using an AI coding agent? Install the [Spree agent skills](/developer/agentic/agent-skills) (`npx skills add spree/agent-skills`) and connect the [docs MCP server](/developer/agentic/mcp) before starting — your agent will know the conventions this tutorial teaches and can follow along with you. See [Agentic Development](/developer/agentic/overview). </Tip>Brand model with a rich text description and an uploadable logo — one generator commandbrand association on Products, surfaced in the product admin formGET /api/v3/store/brands) with serializers and prefixed IDs@spree/sdk