Setting Up the Instance
This guide will help you prepare a development environment for building an e-commerce site on platformOS.
To follow this tutorial, you should be familiar with basic platformOS concepts, the topics in the Get Started section, and the sample scenario of the e-commerce use case.
- How platformOS Works
- Get Started
- E-commerce in platformOS — sample scenario
- Layouts — creating templates
- Pages / Homepage — creating the home page
Setting up the Instance for an e-commerce site is a five-step process:
- Create new instance
- Add version control
- Enable sync
- Add application layout
- Create home page
Step 1. Create new instance
Set up your development environment, create a new Instance, and create the codebase as described in the Get Started section.
Step 2. Add version control
We strongly recommend using a version control system. Set up your version control system, create a new repository, and commit your initial version of the code.
Make sure to add the
.marketplace-kit file to ignore list. It contains access keys used for deploying, specific to your user.
Step 3. Enable sync
Configure your local environment for working with the remote Instance. Use
marketplace-kit to add a new
development environment and then run
marketplace-kit sync development
to automatically update your Instance with changes made on your local machine.
Step 4. Add application layout
At the end of the design process you usually get a number of HTML files that represent sections of the site. This example uses only pure Bootstrap styles and scripts, hosted on their CDN.
marketplace-kit init command provides a sample layout and some partials. They are a good starting point for implementing the application layout.
Create a file
views/layouts/application.liquid to create a default layout for all pages. A good rule of thumb is to keep common sections of HTML (e.g.
<head> or navigation) that should appear on every single page in separate partials. It will help you to stay DRY whenever you want to add a new layout file.
You can learn more about application layouts in our documentation.
Step 5. Create homepage
You can now start adding page placeholders with static HTML, that will be gradually transformed into dynamic content in the following parts of this tutorial. Start with the homepage that will be shown at the root URL of your website.
--- slug: / --- <h1>Welcome!</h1>
How to create a homepage has been described in detail in our documentation.
Congratulations! You have set up the instance. Now you can go on and configure the data schema.