Stripes: quick start
- Node.js with an active LTS version
- Yarn package manager
- Vagrant for optionally hosting a local pre-built back-end environment
Inform Yarn that packages in the
@folio scope are found on the FOLIO NPM repository:
$ yarn config set @folio:registry https://repository.folio.org/repository/npm-folio/
Install the Stripes CLI:
$ yarn global add @folio/stripes-cli
Development of a single application can be performed entirely stand-alone. Simply clone the repository, install dependencies, and run
$ git clone https://github.com/folio-org/ui-users.git $ 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
Refer to the Stripes-CLI user guide for an overview on creating a new app with the CLI.
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
$ 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.