Skip to content

Setup for Genesis Site-Build

Use the following instructions to prepare a Miva Store and your local development environment for developing a site-build that will redesign a site with the Genesis framework.

You should only need to follow this process one time, then move onto the Development Workflow process and get started customizing your site.

Main Steps

  1. Install the dev-dependencies on your computer
  2. Install Genesis on your store
  3. Setup your Git & BitBucket repo
  4. Configure your development environments
  5. That's it. Continue on to the developer workflow

Ensure your pre-requisites are met

Do not proceed until you have prepared your computer with all of the dev-dependencies: node, pnpm, yoeoman, linters, etc.

Install Genesis on Your Store

Follow the Miva store installation process

Setup Repo

Here are some command line depictions that shows the main steps involved in installing genesis. Note: You may need to change the directories and paths depending on your store's setup (ex. htdocs vs httpdocs, mm5 vs Merchant2, etc.)

# Setup your local Repo
mkdir some-store
cd some-store
git init

# Download Genesis
genesis quickstart # Defaults to `genesis quickstart --branch main`
# Answer the questions to match the site's existing folder structure.
# Add "theme-settings.json" to the store-repo's .gitignore file
# Take the .pkg file (typically can be found in a path like miva-server/httpdocs/mm5/frameworks/00000001/) and install it on your store
git commit -m "Added Genesis"

# Start Working with Genesis
pnpm run init
cd themes/genesis
pnpm run build
# FTP Upload the public folder (ex themes/genesis/dist/public/) to your store's server (ex: /httpdocs/mm5/themes/genesis/branches/production/public)

# Optionally, start local development preview
pnpm run start

# Download the store's templates with mmt and add them to the store's repo
cd ../../miva-templates/
mmt credential add ...
mmt remote add ...
mmt checkout ...

# Test everything to make sure it works
cd ../
git commit -m "Finished installing Genesis"
# Setup your local Repo
git clone https://bitbucket.mivamerchant.net/scm/ps/www.marketviewliquor.com.git
cd www.marketviewliquor.com
git checkout main
git checkout -b redesign/main
git checkout -b redesign/develop

# Download Genesis
genesis quickstart # Defaults to `genesis quickstart --branch main`
# Answer the questions to match the site's existing folder structure.
# Add "theme-settings.json" to the store-repo's .gitignore file
# Take the .pkg file (typically can be found in a path like miva-server/httpdocs/mm5/frameworks/00000001/) and install it on your store
git commit -m "Added Genesis"

# Start Working with Genesis
pnpm run init
cd themes/genesis
pnpm run build
# FTP Upload the public folder (ex themes/genesis/dist/public/) to your store's server (ex: /httpdocs/mm5/themes/genesis/branches/redesign/public)

# Optionally, start local development preview
pnpm run start

# Download the store's templates with mmt and add them to the store's repo
cd ../../miva-templates/
mmt credential add ...
mmt remote add ...
mmt checkout ...

# Test everything to make sure it works
git commit -m "Finished installing Genesis"
git tag -a v2.0.0
git push
# Create a pull request in BitBucket to merge the changes from `redesign/develop` to `redesign/main`

Setting up a "Mall" Store

See Independent Theming per Store.

Local Computer Setup

After the repo has been setup, other developers working on the project may need to go through this local-computer setup.

  1. Clone the repo to your machine
  2. Open your terminal and cd into the Genesis theme directory of the store's repo (ex. themes/genesis/)
  3. Run pnpm install.
  4. Create a copy of theme-settings.example.json and rename it to theme-settings.json.
  5. Open theme-settings.json and configure the moduleRoot, themePath, and proxyUrl variables for each environment.

Note

After following the above processes you should be able to run $ pnpm run start from the geneis directory and proceed to follow the Developer Workflow