この記事では、Shopify Theme Kitを使ったローカル環境構築のやり方を解説しています。
手順に従ってShopifyストアの設定をしたり、Shopify Theme Kitのコマンドを叩くだけで簡単にローカル環境が構築できます。
Shopifyストア作成とプライベートアプリの作成
Shopify Theme KitとShopifyストアを接続するためにAPIキーやパスワードを取得します。
取得するには Shopifyストアでプライベートアプリを作成します。以下ではその手順を紹介します。
Shopifyストア作成
まずは、ストアがなければShopify Theme Kitとの接続先がありませんからストアを作りましょう。
それでは、Shopify partnersの管理画面にログインしてください。
登録がお済でない方はココから登録してください。
さて、Shopify partnersの管理画面にログインしますと以下の画面になります。
次に、ストア管理をクリックして下さい。
ストア管理をクリックすると以下の画面になります。
次に、「ストアを追加する」ボタンをクリックします。
次に、「開発ストア」を選択してください。
「開発ストア」を選択すると「ログイン情報」設定画面が現れます。
ここで、各情報を入力して「保存」ボタンをクリックします。
保存をクリックすると「ストアを作成中です」の表示が出ますので少し待ちます。
ストアの作成が完了すると以下の画面になります。
これでストアの作成は完了です！
プライベートアプリを作成
続いてプライベートアプリを作成します。
ストアの管理画面から「アプリ管理」をクリックして下さい。
クリックすると、以下のような表示になります。
そして、「プライベートアプリを管理する」のリンクをクリックして下さい。
はじめは、以下のような画面になるかもしれませんが、「プライベートアプリの開発を有効にする」ボタンをクリックして下さい。
すると、以下の画面になります。
赤枠部のセレクトボックスを選択して、「プライベートアプリの開発を有効にする」ボタンをクリックして下さい。
続いて、以下の画面になります。
この画面では「プライベートアプリを作成する」ボタンをクリックして下さい。
次は、以下の画面になります。
「非アクティブなAdmin API権限を表示する」リンクをクリックして下さい。
表示されるリストの中から以下（テーマ）を見つけて、「読み取り及び書き込み」を選択して、「 保存する 」をクリックして下さい
「保存する」をクリックすると以下のようなポップアップが出ますので「アプリを作成する」をクリックして下さい。
ここまで来ましたら、アプリが完成しています。
一旦ここでブラウザを閉じてください。
閉じましたら Shopify partners から再度ログインしてください。
ログインしようとすると、アカウントの選択などが表示されると思いますので、今回の開発に利用するアカウントを選んでください。
次に、ストア管理をクリックします。
次は、開発ストアのログインボタンをクリックして下さい。
ログインしましたら、「アプリ管理」をクリックします。
すると、「アプリ」画面になりますので、下の「プライベートアプリを管理する」のリンクをクリックして下さい。
「プライベートアプリを管理する」リンクをクリックすると、以下のような画面になります。
ご自分で作られたストア名をクリックします。
ストア名をクリックすると、以下のような画面になります。
赤枠部の情報は必ずメモして大切に保管してください。後ほど使います。
ここまでで、プライベートアプリを作成することができました！
少し長くなりましたので、続きは次の記事「アプリと Shopify Theme Kitを接続する 」でお送りいたします。
