Skip to content
Switch branches/tags
Go to file
Cannot retrieve contributors at this time

Stripes: quick start


Inform Yarn that packages in the @folio scope are found on the FOLIO NPM repository:

$ yarn config set @folio:registry

Install the Stripes CLI:

$ yarn global add @folio/stripes-cli

App development

Development of a single application can be performed entirely stand-alone. Simply clone the repository, install dependencies, and run yarn start.

$ git clone
$ cd ui-users
$ yarn install
$ yarn start

This is possible because each app declares a devDependency on stripes-cli, and the package script yarn start refers to the CLI command stripes serve.

Refer to the Stripes-CLI user guide for an overview on creating a new app with the CLI.

Platform development

The easiest way to work on multiple applications simultaneously is with a Yarn workspace. Create a new workspace with the stripes-cli workspace command. This command is interactive and will prompt for the ui-* modules you would like to include. Be sure to select a platform such as stripes-sample-platform as well. Selected modules will be git-cloned and installed automatically.

$ stripes workspace
? Stripes modules to include (Press <space> to select, <a> to toggle all, <i> to invert selection)
 --- UI Modules ---
❯◯ ui-users
 ◯ ui-inventory
 ◯ ui-eholdings
 ◯ ui-checkin
 ◯ ui-checkout
 ◯ ui-circulation
(Move up and down to reveal more choices)

At this point, the modules you selected with the workspace command will be added to your stripes.config.js.local configuration for any platform(s) selected. Change to the platform directory and run the development server with:

$ cd stripes/stripes-sample-platform
$ stripes serve stripes.config.js.local

Voilà! A development server should be running at http://localhost:3000

The default configuration has UI modules configured in stripes.config.js.local. If you selected stripes-sample-platform this will include "Trivial" and "Users" by default, plus any other modules selected during the workspace command.

The "Trivial" example will work, as it is independent of Okapi. However the "Users" example requires Okapi and the back-end services of various modules and sample data. The simplest way to achieve that is using one of the provided virtual machines (e.g. folio/testing-backend). Other ways are also explained.

Using local code

When using a Yarn workspace, module developers and those wanting to use a local checkout of core Stripes components can simply select stripes-components (or other stripes-* modules) during module selection of the workspace command.

$ stripes workspace
? Stripes modules to include
 --- Stripes Modules ---
 ◉ stripes-connect
 ◉ stripes-components
❯◉ stripes-smart-components
 ◯ stripes-react-hotkeys
 ◯ stripes-logger
 ◯ stripes-form
(Move up and down to reveal more choices)

Not using a workspace? Please refer to Including another Stripes module of the Stripes CLI user guide for details on how to include additional modules without a Yarn workspace.

More information

Additional information can be found in the Stripes CLI User Guide and the Stripes New Development Setup Guide.