Getting started with FTW
- basic command line
- text editing
This tutorial is the place to start your journey of getting hands-on with Sharetribe Flex. You will learn the basic building blocks by creating an example marketplace with the Flex Template for Web (FTW).
FTW is a marketplace web application built on top of the Marketplace API. While you can create a marketplace purely using just the API, it requires a lot of effort and we recommened using the template as a starting point for customizations.
Depending on your needs for customization, changing the template application requires varying levels of development knowledge. For this tutorial it is enough to know how to open a terminal to run some commands and edit text files to change configuration values.
To use the Marketplace API, you will need an API key. You can request access at https://sharetribe.typeform.com/to/BI9M4O
To get FTW up and running, you will need to download and install some basic development tooling:
Clone the Git repository:
git clone https://github.com/sharetribe/flex-template-web.git
NOTE: When starting an actual customization project, we recommend forking the Git repository instead of cloning it. This enables pulling in FTW updates later. However, for the purposes of this tutorial, cloning the repository is enough.
Go to the cloned directory:
Install all dependencies:
Start the configurations:
yarn run config
This command will create
.env file and guide you through setting up
the required environment variables. If the
.env file doesn't exist the
application won't start.
There are three required variables for FTW to work correctly:
Client ID is the API key you will use to access the Marketplace API with the SDK.
If you don't set the client ID, API calls to the Marketplace API won't work in the application.
Public Stripe key enables payments using Stripe. You can follow How to set up and use Stripe guide to get the publishable key. You should also make sure you have enabled Stripe Connect in your platform.
If you don't set the Stripe key, payment's won't work in the application.
Mapbox access token is used for the maps in the marketplace. Follow the Mapbox set up guide to get your access token.
If you don't set the Mapbox key, the map components won't work in the application.
See the FTW Environment configuration variables for more information on the environment variables.
Start the development server:
yarn run dev
This will automatically open
http://localhost:3000 in a browser:
Now that we have the default template marketplace running, let's make some customizations!
src/marketplace.css file with a text editor and change the
--marketplaceColor to have a different value:
This will automatically refresh the browser and show the updated styles:
In this tutorial, we used Flex Template for Web to make our own customized marketplace. As you see, FTW is a fully ready and polished marketplace application that is running on top of the Marketplace API. All of the customization is in your control, and you can change it to fit your marketplace needs. To start customizing FTW as you own marketplace, see the How to Customize FTW guide.