SproutCore Guides

These guides are designed to help you write and perfect your code.

Start Here

Getting Started: Part 1

Learn how to get your first SproutCore app up-and-running.

Getting Started: Part 2

Spring forward with the information you learned in Part 1 and learn about statecharts and views.

Getting Started: Part 3

Expand upon your knowledge from the first two guides, and build a full-scale Todos application.

Classes and SC.Object

In this guide, we will touch on SC.Object, the basis for SproutCore's class-like object-oriented programming structure.

Computed Properties, Observers and Bindings

In this guide, we will touch on KVO in SproutCore.


Core View Concepts

In this guide, we will cover the basics of SproutCore views, and show you how to customize the built-in SproutCore views for your own use.


SproutCore Records

The SproutCore data framework is a full-featured ORM-like framework for working with data in SproutCore. Learn about the SproutCore data framework and how you can use it to interact with your data sources.

Using Fixtures

In order to facilitate rapid development, SproutCore provides a facility for using pre-set fixture data as your data source. This guide covers how to set up your fixtures, and how to replace them with your real server once you're ready to get going.


Theming Your App

In this guide, we'll cover how to change the style of SproutCore controls in your app. As an example, we'll re-theme an SC.ButtonView.


Unit Testing

SproutCore has an easy-to-learn unit test facility that can be used to drive SproutCore test-driven development. This guide describes the basic SproutCore test commands.

Adding a Unit Test

Adding a unit test automatically or manually.

Writing Unit Tests

Describes how to write unit tests using module and test functions

Running Unit Tests

How tests are loaded and executed by the test runner.

SproutCore Development Using TDD

Show implementing the TODOs project using TDD.


Build Tools

Discover the many performance advantages and development benefits of SproutCore's build tools.

The Run Loop

An indepth look at SproutCore's Run Loop for an advanced understanding of the framework.


To simplify working with various kinds of lists, SproutCore provides a unified Enumerable interface. This guide explores which SproutCore objects are Enumerable, and how to use the Enumerable API.

Contributing to SproutCore

Javascript Style Guide

This guide covers the style of SproutCore framework code.

Committer Guidelines

A detailed checklist of the do's and don'ts of SC framework code.

Documentation Guidelines

Writing and generating jsdoc documentation.

Get Involved

Contribute New Guides
SproutCore Guides are a community effort; contribute your own!

Author Credits
Meet the team responsible for putting the SproutCore Guides together.

Icon Legend

The warning icon means the content you're looking at isn't quite done yet.

Notes are bits of important side info you want to make sure you pay attention to.

Pins are for supplementary info tidbits you might want; background, fun facts, etc.

This icon tells you you're looking at code. Which you likely knew... It's still pretty :p