Documentation
Feedback
Guides
Storefront Development

Storefront Development

Creating new projects

After setting up your FastStore monorepo, you can create new projects for additional stores, brands, or modules using the fsp create command. This is useful when you need to add a new storefront, extend your monorepo with additional modules (Checkout, Sales App), or create projects for different brand variants within your organization.
The fsp create command automatically creates the project directory with the necessary structure and updates your faststore.json configuration file with the new project settings, including the path and port allocation.

Instructions

Run the following command in your terminal at the root of your monorepo:

_10
yarn fsp create

Or using npm:

_10
npx fsp create

Use case example

Consider you want to create a new Discovery project for a different brand. The fsp create command will guide you through an interactive setup by asking for:
  1. Account name: The VTEX account for which you're creating the project (example: store-a, brand-store-1).
  2. Module type: The module you want to initialize (discovery, checkout, or sales-app).
  3. Project path: The directory path where the project will be created (example: ./packages/store-a, ./store-a/checkout).
In your terminal, you should answer the questions as follows to create a new Discovery project for a different brand:

_10
? What's the account name? brand-store-1
_10
? Which module do you want to initialize? discovery
_10
? What should be the path to initialize discovery? ./packages/brand-store-1

You can also include all parameters directly in your command:

_10
yarn fsp create brand-store-1 discovery ./packages/brand-store-1

Or using npm:

_10
npx fsp create brand-store-1 discovery ./packages/brand-store-1

After running the command, your monorepo structure will be updated with:

_10
πŸ“‚ Account monorepo
_10
β”‚
_10
β”œβ”€β”€ πŸ“‚ packages
_10
β”‚ └── πŸ“‚ store-a
_10
β”‚ β”œβ”€β”€ πŸ“‚ discovery
_10
β”‚ └── πŸ“‚ brand-store-1
_10
β”‚ β”œβ”€β”€ πŸ“‚ discovery
_10
β”œβ”€β”€ πŸ“„ faststore.json
_10
β”œβ”€β”€ πŸ“„ package.json
_10
β”‚

And your faststore.json will be automatically updated with the new configuration:

_17
{
_17
"$schema": "https://unpkg.com/@vtex/fsp-config/faststore.schema.json",
_17
"stores": {
_17
"store-a": {
_17
"discovery": {
_17
"path": "packages/store-a",
_17
"port": 3000
_17
}
_17
},
_17
"brand-store-1": {
_17
"discovery": {
_17
"path": "packages/brand-store-1",
_17
"port": 3001
_17
}
_17
}
_17
}
_17
}

Contributors
2
Photo of the contributor
Photo of the contributor
Was this helpful?
Yes
No
Suggest Edits (GitHub)
Contributors
2
Photo of the contributor
Photo of the contributor
Was this helpful?
Suggest edits (GitHub)
On this page