Quickstart
Pick your favorite Static Site Generator and locally run your VTEX store in less than 5 minutes
info
This guide is for intermediate to advanced developers. For a comprehensive intro to FastStore, head to our getting started tutorial!
Step by step
Step 1. Starting a new FastStore project
Clone the Base Store repository into your local files and change to the corresponding working directory.
- Next.js
- Gatsby
npx degit vtex-sites/nextjs.store mystore.store && cd mystore.store
npx degit vtex-sites/gatsby.store mystore.store && cd mystore.store
Step 2. Installing dependencies
Install dependencies using yarn.
yarn install
Step 3. Configuring your project settings
Open the store.config.js
file using the code editor of your choice and set up the config to you store.
- Replace the
storeId
value with the id of your account. - Replace the
storeUrl
andcheckoutUrl
values with the corresponding production URLs of your store. - Go to the
lighthouse.pages
property and add the paths of the pages you want to track performance over time. - Go to the
cypress.pages
property and add the paths of the pages you want to end-to-end test before each release.
Step 4. Running your store locally
Start a development server on port 8000.
yarn develop
Your store will start at a hot-reloading environment at http://localhost:8000/. You'll also have access to GraphiQL, a tool that you can use to fetch data and build queries, at http://localhost:8000/___graphql.
🎉 That's all! You're now ready to start making changes to your FastStore storefront.