Skip to content

Commit c02ba8b

Browse files
authored
Update readme (#3)
1 parent e899e0e commit c02ba8b

1 file changed

Lines changed: 61 additions & 34 deletions

File tree

README.md

Lines changed: 61 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,22 @@
55
[![codecov](https://codecov.io/gh/shopdevs/multi-shop-cli/branch/main/graph/badge.svg)](https://codecov.io/gh/shopdevs/multi-shop-cli)
66
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
77

8-
> Contextual development and automated shop management for multi-shop Shopify themes
8+
> Contextual development and automated shop management for multi-shop Shopify
9+
> themes
910
1011
## What is Multi-Shop?
1112

12-
Transform any Shopify theme into a sophisticated multi-shop system with **contextual development** that adapts to your branch context and **automated shop syncing** that keeps all your stores in sync safely.
13+
Transform any Shopify theme into a sophisticated multi-shop system with
14+
**contextual development** that adapts to your branch context and **automated
15+
shop syncing** that keeps all your stores in sync safely.
1316

14-
**Perfect for teams managing multiple Shopify stores** with Dawn theme, custom themes, or any existing Shopify theme that needs multi-shop capabilities.
17+
**Perfect for teams managing multiple Shopify stores** with Dawn theme, custom
18+
themes, or any existing Shopify theme that needs multi-shop capabilities.
1519

1620
### ✨ Key Features
1721

18-
- **🧠 Contextual Development** - One command (`pnpm run dev`) adapts to your branch context
22+
- **🧠 Contextual Development** - One command (`pnpm run dev`) adapts to your
23+
branch context
1924
- **🤖 Automated Shop Syncing** - PRs auto-created when main updates
2025
- **🔐 Secure Credentials** - Developer-specific tokens stored locally only
2126
- **🎨 Shop Isolation** - Complete separation between shop customizations
@@ -25,8 +30,9 @@ Transform any Shopify theme into a sophisticated multi-shop system with **contex
2530
### 🛡️ Built-In Safeguards (v2.1.0+)
2631

2732
- **🚨 Content Detection** - Warns before overwriting shop-specific settings
28-
- **🔒 Security Audit** - `multi-shop audit` command checks permissions and credentials
29-
- **✅ 543 Tests** - Unit, integration, security, E2E, and performance tests
33+
- **🔒 Security Audit** - `multi-shop audit` command checks permissions and
34+
credentials
35+
- **✅ Tests** - Unit, integration, security, E2E, and performance tests
3036
- **🌐 Cross-Platform** - Works on Windows, macOS, Linux (Node 18, 20, 22)
3137
- **📚 Complete Docs** - API reference, guides, and working examples
3238

@@ -43,6 +49,7 @@ pnpm add -D @shopdevs/multi-shop-cli && npx multi-shop init
4349
```
4450

4551
This creates:
52+
4653
- `shops/` directory for shop configurations
4754
- GitHub workflow for automated shop syncing
4855
- Updated package.json with multi-shop scripts
@@ -57,14 +64,14 @@ pnpm run shop
5764

5865
# For each shop, you'll configure:
5966
# 1. Shop ID (e.g., fitness-store)
60-
# 2. Display name (e.g., "Fitness Store")
67+
# 2. Display name (e.g., "Fitness Store")
6168
# 3. Production domain (e.g., fitness-store.myshopify.com)
6269
# 4. Staging domain (e.g., staging-fitness-store.myshopify.com)
6370
# 5. Authentication method (theme-access-app recommended)
6471

6572
# Repeat for all shops:
6673
# → shop-a (Shop A)
67-
# → shop-b (Shop B)
74+
# → shop-b (Shop B)
6875
# → shop-c (Shop C)
6976
# → shop-d (Shop D)
7077
```
@@ -76,15 +83,16 @@ pnpm run shop
7683
pnpm run dev
7784
# → Contextual development that adapts to your branch
7885

79-
# Or use npx directly
86+
# Or use npx directly
8087
npx multi-shop dev
8188
```
8289

8390
---
8491

8592
## 🚀 Complete Setup for Multiple Shops
8693

87-
Here's the step-by-step process to set up multi-shop on a new Shopify theme (example shows 4 shops, but you can use any number):
94+
Here's the step-by-step process to set up multi-shop on a new Shopify theme
95+
(example shows 4 shops, but you can use any number):
8896

8997
### Step 1: Initialize Project
9098

@@ -102,27 +110,27 @@ pnpm run shop
102110
# Shop A
103111
# Shop ID: shop-a
104112
# Name: Shop A
105-
# Production: shop-a.myshopify.com
113+
# Production: shop-a.myshopify.com
106114
# Staging: staging-shop-a.myshopify.com
107115
# Auth: theme-access-app
108116

109-
# Shop B
117+
# Shop B
110118
# Shop ID: shop-b
111119
# Name: Shop B
112120
# Production: shop-b.myshopify.com
113121
# Staging: staging-shop-b.myshopify.com
114122
# Auth: theme-access-app
115123

116124
# Shop C
117-
# Shop ID: shop-c
125+
# Shop ID: shop-c
118126
# Name: Shop C
119127
# Production: shop-c.myshopify.com
120128
# Staging: staging-shop-c.myshopify.com
121129
# Auth: theme-access-app
122130

123131
# Shop D
124132
# Shop ID: shop-d
125-
# Name: Shop D
133+
# Name: Shop D
126134
# Production: shop-d.myshopify.com
127135
# Staging: staging-shop-d.myshopify.com
128136
# Auth: theme-access-app
@@ -135,12 +143,13 @@ Each developer needs to set up their own theme access tokens:
135143
```bash
136144
# Create credential files manually:
137145
shops/credentials/shop-a.credentials.json
138-
shops/credentials/shop-b.credentials.json
146+
shops/credentials/shop-b.credentials.json
139147
shops/credentials/shop-c.credentials.json
140148
shops/credentials/shop-d.credentials.json
141149
```
142150

143151
Example credential file format:
152+
144153
```json
145154
// shops/credentials/shop-a.credentials.json
146155
{
@@ -166,7 +175,7 @@ When creating each shop, you'll be prompted:
166175

167176
# This automatically creates:
168177
# shop-a/main and shop-a/staging
169-
# shop-b/main and shop-b/staging
178+
# shop-b/main and shop-b/staging
170179
# shop-c/main and shop-c/staging
171180
# shop-d/main and shop-d/staging
172181

@@ -225,28 +234,33 @@ pnpm run dev # Try different shop contexts
225234
The system detects your branch context and adapts automatically:
226235

227236
**Feature Branches** (like `feature/new-carousel`):
237+
228238
```bash
229239
pnpm run dev
230240
# → Prompts for shop context
231-
# → Prompts for environment (staging/production)
241+
# → Prompts for environment (staging/production)
232242
# → Your code stays on feature branch
233243
# → Testing happens against selected shop
234244
```
235245

236246
**Shop Branches** (like `shop-a/custom-checkout`):
247+
237248
```bash
238-
pnpm run dev
239-
# → Auto-detects "shop-a"
249+
pnpm run dev
250+
# → Auto-detects "shop-a"
240251
# → Skips shop selection
241252
# → Starts development immediately
242253
```
243254

244255
### Automated Shop Syncing (GitHub Flow)
245256

246257
When you merge features to main:
247-
1. **Use Tools → Sync Shops**: Select shops and create PRs `main → shop-*/staging`
248-
2. **Each shop team reviews** their shop-specific PRs
249-
3. **Shop teams create final PRs**: `shop-a/staging → shop-a/main`, `shop-b/staging → shop-b/main`, etc.
258+
259+
1. **Use Tools → Sync Shops**: Select shops and create PRs
260+
`main → shop-*/staging`
261+
2. **Each shop team reviews** their shop-specific PRs
262+
3. **Shop teams create final PRs**: `shop-a/staging → shop-a/main`,
263+
`shop-b/staging → shop-b/main`, etc.
250264

251265
### Campaign Management (Per Shop)
252266

@@ -281,7 +295,7 @@ git checkout main && git checkout -b feature/new-component
281295
# 2. Contextual development
282296
pnpm run dev # Select shop context for testing
283297

284-
# 3. Test across shops
298+
# 3. Test across shops
285299
pnpm run dev # Try different shop contexts
286300

287301
# 4. Sync with latest main (if needed)
@@ -319,7 +333,7 @@ main (core theme)
319333
├── hotfix/critical-bug # Emergency fixes
320334
321335
├── shop-a/main # Connected to shop-a
322-
│ ├── shop-a/staging # Connected to staging-shop-a
336+
│ ├── shop-a/staging # Connected to staging-shop-a
323337
│ └── shop-a/promo-summer # Campaign branches
324338
325339
├── shop-b/main # Connected to shop-b
@@ -336,20 +350,21 @@ main (core theme)
336350
### Security Model
337351

338352
**Shop Configuration** (committed):
353+
339354
```json
340355
// shops/shop-a.config.json
341356
{
342357
"shopId": "shop-a",
343-
"name": "Shop A",
358+
"name": "Shop A",
344359
"shopify": {
345360
"stores": {
346-
"production": {
361+
"production": {
347362
"domain": "shop-a.myshopify.com",
348363
"branch": "shop-a/main"
349364
},
350-
"staging": {
365+
"staging": {
351366
"domain": "staging-shop-a.myshopify.com",
352-
"branch": "shop-a/staging"
367+
"branch": "shop-a/staging"
353368
}
354369
},
355370
"authentication": {
@@ -361,7 +376,8 @@ main (core theme)
361376
```
362377

363378
**Developer Credentials** (local only):
364-
```json
379+
380+
```json
365381
// shops/credentials/shop-a.credentials.json (NOT committed)
366382
{
367383
"developer": "your-name",
@@ -387,15 +403,16 @@ pnpm run dev # Get preview URL
387403

388404
# Run comprehensive tests
389405
pnpm test:integration # Shopping flow tests
390-
pnpm test:visual # Visual regression tests
406+
pnpm test:visual # Visual regression tests
391407
pnpm test:accessibility # WCAG compliance tests
392408
pnpm test:performance # Core Web Vitals tests
393409

394410
# Test shop sync PRs
395411
pnpm run test:pr # Comprehensive PR testing
396412
```
397413

398-
All tests use **real Shopify preview themes** instead of mocks, providing realistic testing conditions.
414+
All tests use **real Shopify preview themes** instead of mocks, providing
415+
realistic testing conditions.
399416

400417
---
401418

@@ -404,20 +421,23 @@ All tests use **real Shopify preview themes** instead of mocks, providing realis
404421
### Common Setup Issues
405422

406423
**"No shops configured yet"**
424+
407425
```bash
408426
# Make sure you've created shop configurations:
409427
pnpm run shop → Create New Shop
410428
# Check: ls shops/ should show *.config.json files
411429
```
412430

413-
**"No credentials found for shop-x"**
431+
**"No credentials found for shop-x"**
432+
414433
```bash
415434
# Create credential file manually:
416435
# shops/credentials/shop-x.credentials.json
417436
# Get theme tokens from Shopify admin or theme access app
418437
```
419438

420439
**"Shopify CLI not found"**
440+
421441
```bash
422442
# Install Shopify CLI globally:
423443
pnpm add -g @shopify/cli
@@ -427,6 +447,7 @@ shopify version
427447
```
428448

429449
**"Permission denied" (Unix/Linux/macOS)**
450+
430451
```bash
431452
# Fix credential file permissions:
432453
chmod 600 shops/credentials/*.credentials.json
@@ -435,18 +456,21 @@ chmod 600 shops/credentials/*.credentials.json
435456
### Workflow Issues
436457

437458
**"Can't connect theme to GitHub branch"**
459+
438460
- Ensure branch exists: `git branch -r | grep shop-a/main`
439461
- Check Shopify admin → Themes → Add theme → Connect from GitHub
440462
- Verify repository connection in Shopify
441463

442464
**"Development server won't start"**
465+
443466
```bash
444467
# Check your credentials and domain:
445468
pnpm run shop → List Shops
446469
# Verify tokens are correct in credential files
447470
```
448471

449472
**"Feature branch not detecting context"**
473+
450474
```bash
451475
# Check branch name pattern:
452476
git branch --show-current
@@ -458,6 +482,7 @@ git branch --show-current
458482
## 📚 Documentation
459483

460484
Comprehensive guides included:
485+
461486
- **Getting Started** - 5-minute setup
462487
- **Contextual Development** - Core workflow innovation
463488
- **Shop Management** - Creating and managing shops
@@ -468,7 +493,8 @@ Comprehensive guides included:
468493

469494
## 🤝 Contributing
470495

471-
This package provides proven multi-shop workflow patterns for any Shopify theme development team.
496+
This package provides proven multi-shop workflow patterns for any Shopify theme
497+
development team.
472498

473499
### Development
474500

@@ -498,4 +524,5 @@ MIT © [ShopDevs](https://shopdevs.com)
498524

499525
- Built for modern multi-shop Shopify development workflows
500526
- Inspired by the need for better multi-shop Shopify development workflows
501-
- Powered by [@clack/prompts](https://www.npmjs.com/package/@clack/prompts) for beautiful CLI experiences
527+
- Powered by [@clack/prompts](https://www.npmjs.com/package/@clack/prompts) for
528+
beautiful CLI experiences

0 commit comments

Comments
 (0)