Skip to content

Commit

Permalink
Update getting-started.md and tutorial.md in docs/hydrogen
Browse files Browse the repository at this point in the history
  • Loading branch information
hta218 committed Apr 11, 2024
1 parent 9147ac3 commit 1854c45
Show file tree
Hide file tree
Showing 2 changed files with 13 additions and 13 deletions.
14 changes: 7 additions & 7 deletions docs/hydrogen/getting-started.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,34 +25,34 @@ Begin by installing the Weaverse app. Go to the [Shopify app store](https://apps

## Creating a New Weaverse Hydrogen Project

### Start a New Project
#### Start a New Project

![Create Weaverse Hydrogen Project](https://cdn.shopify.com/s/files/1/0728/0410/6547/files/create_weaverse_hydrogen_project.webp)

In the Weaverse dashboard, click "Create New Project" to begin.

### Choose a Starter Theme
#### Choose a Starter Theme

![Select Weaverse Starter Theme](https://cdn.shopify.com/s/files/1/0728/0410/6547/files/select_weaverse_starter_theme.webp)

Select from various Hydrogen starter themes. The default "Pilot" theme is free and a great starting point.

### Experiment with the Demo
#### Experiment with the Demo

Use the default Preview URL to explore the theme's features and interface.

![Start setup Weaverse Project](https://cdn.shopify.com/s/files/1/0728/0410/6547/files/start_setup_weaverse_project.webp)

When ready, click "Start Setup" to proceed with building or deploying your project.

### Setting Up Your Project
#### Setting Up Your Project

Choose from two setup options:

- **For Developers**: Clone the project locally or use our command to start the development server.
- **For Non-Developers**: Follow our guide to deploy the project live. This option is less technical. For more information, refer to our [deployment guide](/docs/deployment/oxygen).

### Accessing the Development Server
#### Accessing the Development Server

After setup, enter the development server preview URL (default `http://localhost:3456`) in the Preview URL field and click "Next."

Expand All @@ -62,11 +62,11 @@ Note: You can later modify the Preview URL in the **Project Settings**:

💡 **Tip**: Use a **Chrome-based Browser** for optimal experience. Browsers like **Safari** may not support `localhost`.

### Exploring the Theme Customizer
#### Exploring the Theme Customizer

The Theme Customizer is designed to mirror Shopify's OS2 Theme Customizer for ease of use.

### Adding Sections and Customizing
#### Adding Sections and Customizing

Start adding and customizing sections in the user-friendly Theme Customizer.

Expand Down
12 changes: 6 additions & 6 deletions docs/hydrogen/tutorial.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: Tutorial (20m)
title: Quick Start Guide (20m)
description: A comprehensive guide to Weaverse, the first-ever Theme Customizer & CMS for Shopify Hydrogen.
publishedAt: March 28, 2024
updatedAt: March 28, 2024
Expand All @@ -8,7 +8,7 @@ published: true
---


# Weaverse Hydrogen Tutorial
# Weaverse Hydrogen Quick Start Guide (20m)

Welcome to this step-by-step guide on setting up a Weaverse Hydrogen project using the pre-made "Pilot" theme. Aimed at providing a hands-on experience, this tutorial is structured to guide you from installation through to deployment, ensuring you're ready to launch your Shopify store with a custom theme. Whether you're coding along or just browsing, expect to spend about 20 minutes on this guide.

Expand Down Expand Up @@ -45,7 +45,7 @@ After project creation, dive into the theme editor to customize your theme, from



### **Setup Local Development**
### Setup Local Development

To kickstart your local development with the Weaverse Hydrogen project, there are several methods to clone or set up the project on your local machine. Here's how you can proceed with the Pilot theme, available at: [Pilot Theme GitHub Repository](https://github.com/weaverse/pilot).

Expand Down Expand Up @@ -99,7 +99,7 @@ After selecting one of the setup methods for your project, follow these steps to
```bash
cd <your-project-name>
```
2. **Setting Up Environment Variables**:
Expand All @@ -121,7 +121,7 @@ After selecting one of the setup methods for your project, follow these steps to
WEAVERSE_PROJECT_ID="your-weaverse-project-id"
PUBLIC_CUSTOMER_ACCOUNT_API_CLIENT_ID="your-customer-account-api-client-id"
PUBLIC_CUSTOMER_ACCOUNT_API_URL="https://your-shopify-store.myshopify.com/api/2022-01/graphql"
### Optional:
#PRIVATE_STOREFRONT_API_TOKEN="your-private-storefront-api-token" # Optional
#PUBLIC_STOREFRONT_API_VERSION="unstable" # Optional, defaults to Hydrogen's version
Expand Down Expand Up @@ -263,7 +263,7 @@ export const schema: HydrogenComponentSchema = {
title: 'User Profiles',
type: 'user-profiles',
inspector: [
]
};
```
Expand Down

0 comments on commit 1854c45

Please sign in to comment.