Introducing SPEAK
SPEAK is a framework for building Sitecore applications. SPEAK is an acronym for "Sitecore Process Enablement & Accelerator Kit". Developers use Sitecore Rocks to implement SPEAK applications (SPEAK does not currently support building websites). Sitecore provides a library of SPEAK compatible components, visual layouts, and styles that developers need in order to implement applications.
SPEAK takes advantage of the latest browser features and standards, specifically HTML5 and CSS3, and it uses JavaScript extensively on the client.
The main goals of SPEAK are to:
-
Provide a streamlined approach to application development.
-
Enable reuse of UI elements.
-
Enforce a consistent look and feel.
SPEAK gives developers starting points for applications that consist of several pages, and starting points for single-page dialogs.
The Sitecore Business Component Library
Developers use SPEAK components to build applications (components with a visible representation on a page are also called controls). Developers are not limited to the components that Sitecore delivers: they can make their own.
The following table provides an overview of the types of components in the Sitecore Business Component Library (BCL).
|
Group |
Description |
|---|---|
|
Authentications |
Components related to validating the identity of an application user. |
|
Charts |
Components that display business graphics. |
|
Common |
The bulk of the simple controls that developers use to implement pages. |
|
Containers |
Components that group and organize other components on the page. |
|
Data |
Components that retrieve data from the server to the application when running on the client, and make that data available to other components. |
|
Dialogs |
Components used to display application dialog windows. |
|
Forms |
Components that assist end-users in providing data to the application. |
|
Lists and Grids |
Components that display multiple entities of the same type. |
|
Navigation |
Components that assist application end-users in moving between the pages that make up the application. |
|
Resources |
Components that provide specialized application functionality used by developers. |
|
Searching and Filtering |
Components that implement search and filtering capabilities in applications, often through interaction with other components. |
|
Structures |
Components that define the visual layout of elements on a page. |
Component properties
The properties of a component specify how the component looks and acts. For example, developers specify the text shown by a button control in one property and they specify which method to call when an end-user clicks on the control in another property.
Developers may assign property values statically, when they configure an application initially, or they may assign values to some properties dynamically, at run-time, either programmatically in JavaScript or through data binding.
During application configuration, developers can set properties "directly" on the component or "indirectly" in a "configuration item".
For some properties, developers either should, or must, set properties indirectly in a configuration item. A developer should set properties indirectly, for example, in cases where a property defines visible text on an application page, or where using a configuration item makes localization possible. A developer must set properties indirectly when, for example, the developer defines multiple values, such as a list of tabs shown by a TabControl control.
Data binding
Data binding synchronizes data between components. Developers configure data binding declaratively so they do not need to write code for simple data synchronization.
For example, an application may present a text box that end-users use to provide search criteria. Developers can data bind this text box to the search criteria property of a data retrieval component. When an end-user changes the text in the text box, SPEAK automatically updates the search criteria of the data retrieval component, which in turn retrieves data that matches the provided search term. The developer can also bind the data retrieval component to a data display component, which then displays the retrieved data automatically.
Adding logic to a SPEAK application
Developers add logic to a SPEAK dialog or application in several different ways:
-
The PageCode and SubPageCode components execute code that developers write in either JavaScript (front-end) or C# (server-side).
-
Using SPEAK rules, which are front-end JavaScript rules. Developers use the Rule component to listen for a specific trigger event. When the event occurs, the Rule component executes the associated rule.
-
The Pipeline component configures JavaScript client-side pipelines and processors. Developers can configure pipeline execution to start as the result of an event.
Developers typically define that SPEAK executes some logic in response to an event. For example, many controls, such as the Button control, have a Click property. Developers configure how the button responds when the end-user triggers a Click event in this property (for a Button control, this happen when a user clicks the button).
For example, to call a function called findContact in the PageCode component code when the end-user clicks on a button, the developer provides the following value in the Click property:
javascript:app.findContact()
If a developer provides the following code in the Click property of a button, then SPEAK triggers the hide event of a component called VisitDialog:
trigger:hide:VisitDialog