From 985df891c88d918795c5c8e5913698ff831fb026 Mon Sep 17 00:00:00 2001 From: Nathan Ferguson Date: Wed, 19 Jul 2017 18:13:26 -0400 Subject: [PATCH] Docs new getting started (#205) --- docs/commands/index.md | 4 ++-- docs/index.md | 40 +++++++++++++++++++++++++++++++--------- 2 files changed, 33 insertions(+), 11 deletions(-) diff --git a/docs/commands/index.md b/docs/commands/index.md index e47cbc0db..bf70718e4 100644 --- a/docs/commands/index.md +++ b/docs/commands/index.md @@ -33,9 +33,9 @@ Generate a new blank theme. The `name` argument is required for the new theme di slate migrate ``` -Converts an existing theme to work with Slate. Run this command from your project root to install dependencies and restructure your theme files into a `src/` directory. Empty `icons/`, `styles/`, and `scripts/` folders will also be created. +Converts an existing theme to work with Slate. Run this command from your project root to install dependencies and restructure your theme files into a `src/` directory. Empty `icons/`, `styles/`, and `scripts/` folders will also be created. -Create `config.yml` in your root using [this sample file](https://github.com/Shopify/slate/blob/master/config-sample.yml), then use [theme commands](#theme-commands) to start developing. +A `config.yml` will also be created in your root directory which is required for [build commands](#build-commands) and [sync commands](#sync-commands). ##### Options ``` diff --git a/docs/index.md b/docs/index.md index 5afbd2bcb..295b1228b 100644 --- a/docs/index.md +++ b/docs/index.md @@ -16,19 +16,41 @@ Slate works with Node version 6.x, the curr The steps below walk through installing Slate globally and configuring your development theme to sync with your store. If you want the theme files without the build tools dependency, get the latest zip here. +### Create a new project + 1. Install Slate with `npm install -g @shopify/slate`. -2. Create a new theme with `slate theme theme-name`, where `theme-name` will be a newly created folder. If you already have a theme locally, you can use the `slate migrate` command and [follow these steps](/slate/commands/#migrate) instead. -3. Create a private app on your development store(s). - * Not sure how to create a private app? [Learn how here](https://help.shopify.com/api/guides/api-credentials#get-credentials-through-the-shopify-admin). - * Set the "Theme templates and theme assets" permission to "Read and write". - Private app permission requirements -4. Rename `config-sample.yml` to `config.yml` and add your store information and private app credentials: +2. Create a new theme with `slate theme theme-name`, where `theme-name` will be a newly created folder. + * If you already have a theme locally, you can use the `slate migrate` command and [follow these steps](/slate/commands/#migrate) instead. + +### Connect your project with your Shopify store + +1. Edit the `config.yml` by adding your store's URL to the `development` environment. * **store:** the Shopify-specific URL for this store/environment (ie. my-store.myshopify.com) + * Note: You can complete the rest of the configuration in later steps. + +2. Run `slate deploy -m` to start a manual deploy to your Shopify store. + * Slate will build a Shopify theme and open your store's admin. + * A zip of your project will be created in the project's `upload` directory. + +3. Upload the theme zip file at Shopify [admin/themes](https://shopify.com/admin/themes). + * Not sure how to upload a theme zip? Learn how at [Upload a theme from your computer](https://help.shopify.com/manual/using-themes/install-themes#upload-a-theme-from-your-computer). + +4. Edit the `config.yml` to include the theme id of your new theme. * **theme_id:** the unique id for the theme you want to write to when deploying to this store. You can find this information in the URL of the theme's online editor at Shopify [admin/themes](https://shopify.com/admin/themes). Alternatively, you can use `"live"` as shorthand for the published theme. Private app credentials + +5. Create a private app from your Shopify admin. + * Not sure how to create a private app? Learn how at [Generate credentials in the Shopify admin](https://help.shopify.com/api/getting-started/api-credentials#generate-credentials-in-the-shopify-admin). + * Set the "Theme templates and theme assets" permission to "Read and write". + Private app permission requirements + +6. Edit the `config.yml` to include the password of your new private app. * **password:** the password generated via a private app on this store. Access this information on your Shopify [admin/apps/private](https://shopify.com/admin/apps/private) page. Private app credentials -5. From within your new project folder in your command line, use the commands below to build, sync, and watch your local files. + * Note: You can use the same private app password for any `config.yml` environment + as long as it is for the same store. + +7. From within your new project folder in your command line, use the [Slate commands](#slate-commands) below to build, sync, and watch your local files. ## Slate commands @@ -47,8 +69,8 @@ The steps below walk through installing Slate globally and configuring your deve > Learn more about [all commands and descriptions](/slate/commands/) or how to [deploy to multiple environments](/slate/commands/#sync-commands). -## Working with `git` +## Working with Git repositories -A new Slate project comes with a `.gitignore-sample` file. This file is meant to be a starting point for your own `.gitignore` file if you will be using `git` for version control. The sample files contains a list of files and folders to be ignored when committing to a git repository. Ignored files are both Slate project specific files as well as commonly ignored files on any project. +A new Slate project comes with a `.gitignore` file. This file is useful if you plan on using Git for version control as it contains a list of files and folders to be ignored when committing to a git repository. Ignored files are both Slate project specific files as well as commonly ignored files on any project. For more information on `.gitignore` files, see GitHub's documentation: https://help.github.com/articles/ignoring-files/