[完全攻略]Shopify学習ロードマップ

#はじめに
Shopify全然分からない...。
という状態から、案件を獲得できるようになったので、学習の参考になったものをまとめて学習ロードマップを作成いたしました。

これからShopifyを勉強したいという方の役に立てれば幸いです。

#Level0: Shopify？なにそれ？Spotifyのことかな？
Shopifyの学習を始めるために、前提知識から勉強していきましょう。

話は変わるんですが、ShopifyってSpotifyに凄く似てますよね。結構な人が勘違いすると思います。

Shopifyは簡潔に説明するとネットショッピングサイトを簡単に作成できるプラットフォームであり、BASEの世界版です。

Shopifyはカナダの企業で、ネットショップサイト構築プラットフォームとしては世界一です。

Shopifyはエコシステムがとても充実していて、Shopifyの構築やShopifyのアプリの開発、テーマと呼ばれるストアテンプレート開発、Shopifyのアフィリエイトなどを行ったユーザーに対してインセンティブを付与する仕組みが充実しています。

この辺りの基礎知識の話は、Youtuberの方がとても分かりやすく解説を行っているので、一見しておくことをおすすめします。

**[おすすめ資料]**

・[Shopifyマスターニシカワ](https://www.youtube.com/channel/UCgSBs6u71Ftxj8gGv_blOfg/videos)

上記のYoutuberを見て、ECサイトやShopfyについての基礎知識を入れた後は、以下のブログでさらに細かくShopifyを使ってできることを勉強しておくと良いでしょう。

**[おすすめ資料]**

・[コマースメディア ECブログ](https://commerce-media.info/blogs/ec)


#Level1: ストア構築の学習
基礎知識を入れた後は、Shopifyのストア構築について学習していきましょう。

以下のブログで、Shopify構築ロードマップが無料で公開されています。

非常に細かく分かりやすく書かれているので、Shopifyを0から学習する際は一度目を通しておくことを強くオススメします。



**[おすすめ資料]**

[【Shopifyマスターへの道】](https://unreact.jp/blog/roadmap-before-begin)



正直ストア構築は上記のロードマップで十分なので、その他の資料は割愛します。

#Level2: Liquid編集 初級編
Lebel1まででストア構築の仕方は理解できたと思います。

ここからはさらにShopifyを極めるために、Liquidを編集について学んでいきましょう。

LiquidはShopifyのテーマ作成に用いられる独自言語で、Rubyをベースに作成されています。

極論これはLiquidの公式ドキュメントを熟読すればマスターできるのですが、流石にLiquidについて何も知らない状態から公式ドキュメントを読むのはきついので、簡単にまとめてくれている日本のブログから学習していきましょう。

**[おすすめ資料]**

[ShopifyのLiquidファイルの構造の話①](https://qiita.com/eijiSaito/items/c2ef910bd26ce208a2df)

[ShopifyのLiquidファイルの構造の話②](https://qiita.com/eijiSaito/items/635897aecda877784113)

[Shopifyをカスタマイズ？Liquidの基本構文を解説！](https://qiita.com/eijiSaito/items/5c3fa8e4b7fbfd5fa327)

[Shopifyのセクションを自作！？実装方法を解説！](https://qiita.com/eijiSaito/items/55cd5b877b9ef8b08d6b)

[[Shopify] liquidを記述して、ページテンプレートでセクションを表示させる方法](https://qiita.com/eijiSaito/items/5e890cab19f2e320a0b0)



また、ShopifyのLiquid編集はTheme Kitというソフトを使って行います。このソフトを用いれば、VScodeなどのエディタを用いてコード編集が行なえます。

以下の記事で、環境構築について分かりやすくまとめられていました。

[VScodeでShopifyをコーディング？Theme Kitの使い方を解説！](https://qiita.com/eijiSaito/items/a785e707afd1b4304432)

#Level3: Liquid編集 中級編
ここまで全て無料のコンテンツでしたが、ここから少し有料のコンテンツが入ってきます。

Level2まででLiquidの基礎知識を学習することができたと思うので、ここから少しステップアップしていきましょう。

Udemyの講座を紹介しますが、アフィリエイトリンクではありませんので安心して下さい。

正直、分かりやすい解説とはとても言い難いですが、以下の講座でしか学べない内容があるので一見しておくことをオススメします。

Udemyは普段はかなり高額なので、セールで安くなったときに購入することをオススメします。

**[おすすめ資料]**
Liquidの基礎が網羅的に学べる英語の講座です。
[Intro to Shopify Theme and Store Development with Liquid](https://www.udemy.com/course/master-shopify/)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/878708/a7a3279c-f1ca-3520-bc51-2ab4f56ec625.png)

テーマ開発を0から行う英語の講座です。
[Build a Shopify Theme From Scratch](https://www.udemy.com/course/build-a-shopify-theme-from-scratch/)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/878708/67dd753c-54eb-2258-a9cd-9e42bc0d6d78.png)

以下の英語のドキュメントもとても綺麗にまとめられていました。

[Liquid Introduction](https://shopify.github.io/liquid/basics/introduction/)
#Level4　公式ドキュメント
ここまで来たら、じっくりと公式ドキュメントを熟読することをオススメします。

結構良いことが書いてあります。


[Developing on Shopify](https://shopify.dev/concepts/shopify-introduction)


#補足 Shopifyアプリについて
Shopifyはアプリによって色々な拡張機能が使用できます。

Chromeの拡張機能のようなものですね。

サブスクリプションや予約販売などの機能を実装しようと思ったとき、Shopifyのアプリについて調べることになるわけですが、必ず日本語のブログや日本のYoutuberなどががオススメしているアプリを使用するのではなく、自分でShopifyアプリストアの中に入って調べて下さい。

[Shopifyアプリストア](https://apps.shopify.com/?locale=ja)

というもの、日本で紹介されているアプリは、有料である上に機能も粗悪なものが多いです。

必ず、自分の手でShopifyアプリストアで探してみることを強くオススメします。

# オススメのShopifyアプリ
いくつかおすすめのShopifyアプリを紹介します。

実際にインストールして、色々試して下さい。

## 商品ページ発売予告アプリ | リテリアComing soon

https://apps.shopify.com/shopify-application-314

こちらのアプリは、ShopifyでComing Soon機能を実現出来るアプリです。

Shopifyでは、商品を購入できない状態で公開するには売り切れ状態にするしかないため、こちらの機能は非常に便利です。

ボタンをComing Soonに変更できる以外に、ボタンをLINEへの導入に変更することもできます。

アプリの管理画面からではなく、フロント側からもカスタマイズできるためおすすめです。

https://coming-soon.reterior.jp/

こちらの記事でも紹介されていました。

https://qiita.com/shopify_master_yoshinori/items/5f33be1e97b4502592f5

## G:Variants & Product Options
https://apps.shopify.com/product-options-pro?surface_detail=globo&surface_inter_position=1&surface_intra_position=6&surface_type=search

こちらは海外製のアプリですが、非常におすすめです。

商品に多種多様なオプションを付与することができるアプリで、また選択されたオプションにより商品の値段を変更することも可能です。

商品のオプションを細かくカスタマイズすることは結構な頻度であるため、かなり便利なアプリです。


#終わりに
今回の記事はここまでになります。

少しでも皆さまのお役に立てれば幸いです。

ここまで読んで頂きありがとうございました。