Setup

Guide to Getting Started with Storefront Project (Vue Framework) for Selldone

Create a fully customized storefront for Selldone using the Storefront Project built on the Vue framework. Follow these simple steps to get started:

Setting Up Your Development Environment

Step 0: Setting Up Development Environment

Step 1: Clone the Storefront Project

First, clone the project to your local machine using the following command:

gh repo clone selldone/storefront

Step 2: Install Necessary Packages

Next, install all the required packages. You can use either Yarn or npm as your package manager.

If you're using Yarn, run:

yarn install
yarn setup

For npm, use:

npm install
npm setup

Shell Yarn Setup Screenshot

Step 3: Begin Development

Now, you're ready to start developing your storefront. To launch the development server, use one of the following commands:

With Yarn:

yarn serve

With npm:

npm serve

Open served address: e.g. https://localhost:8080/

‼️ Caution: While serving over HTTPS, the browser may display an error page due to certificate issues. You can manually accept the certificate to proceed. In Firefox, for instance, you can verify and accept the certificate by clicking on the 'More' button and then verifying the certificate.

Shell Yarn Serve Screenshot

Configuring Your Storefront

Manifest File (manifest.json)

To publish your storefront on Selldone and make it available for use, configure your layout settings in the manifest.json file. This step is crucial for personalizing and defining the structure of your storefront.

Test Environment (.env File)

For a realistic development experience, your project will use data from an actual Selldone store. To set this up, modify the .env file with the following variables:

Variable	Description	Example
VUE_APP_SAMPLE_SHOP_NAME	Your Selldone shop name. Use the format my-shop-name.	toysworld
VUE_APP_SAMPLE_SHOP_CUSTOM_HOME	Define the first page of your storefront. Options include blog, avocado, hyper, community, shop, map, number, a specific LANDING-PAGE-ID, or null.	3001
VUE_DEV_SERVER_HOST	Hostname for the Vue development server	localhost
VUE_DEV_SERVER_PORT	Port number for the Vue development server	8080
VUE_DEV_SERVER_HTTPS	Whether to use HTTPS (TRUE or FALSE)	-

By following these steps, you'll be well on your way to developing a unique and fully customized storefront for Selldone using the Vue framework. Happy coding!