Shopifyについての情報を調べているときに"Liquid"という単語を目にしたことはないでしょうか？ Shopifyのカスタマイズを行う上で、Liquidは必須の知識と言えます。今回は、Shopifyのテンプレート言語であるLiquidについてまとめました。 Liquidとは？ Shopifyは、カナダで開発された越境ＥＣプラットフォームです。 言語・通貨・決済システムの面で海外向けに展開しやすいことに加えて、デザイン面でのカスタマイズの自由度の高さも特徴といえます。Netflixが展開するECサイトnetflix.shopも、Shopifyで作成されたECサイトです。 netflix.shopのような独自性の強いカスタマイズを行うために使われるのが、Shopifyが開発したテンプレート言語Liquidです。 Liquidはテンプレート言語と呼ばれることもあれば、テンプレートエンジンと言う人もいます。（中略）従来のプログラミング言語のように構文があり、アウトプット、ロジック、ループといったコンセプトがあり、変数（データ）を扱います。PHPのようなWeb中心の言語と似ています。しかし類似点はそれくらいです。設計上Liquidでできないこともたくさんあります。（中略）ですがこれは十分に考えられたうえでのことなので、最初は制限と感じられる部分も正当な理由があります。Shopify公式ブログ（https://www.shopify.jp/blog/partner-shopify-template-language-liquid-overview）より テンプレート言語（またはテンプレートエンジン）とは、特定のデータを加工したりアウトプットしたりするのに特化したシステムのことで、プログラミング言語に非常に似ていますが、一部制限が存在します。 LiquidはShopifyの開発を前提に作られたテンプレート言語であり、Shopifyの商品データを受け取り、美しく表示させるのに役立ちます。 Liquidでできること Liquidは、主に表示側のカスタマイズに使われます。MVCモデルで言うところのView側の制御で、HTML/CSS/JavaScriptと一緒に用いられます。 View側の開発では、画一で同じものが表示される静的な画面と商品やユーザーによって表示が変わる動的な画面という考え方がありますが、Liquidは動的な画面を作るのに最適です。 Shopifyのデータに適しており、シンプルな記述でShopifyのデータを扱うことができます。 PHPなどのウェブ開発言語に似ていますが、プログラミング言語に比べて行えることは制限されています。 Liquidの注意点 Liquidはテンプレート言語なので、通常のプログラミング言語とは少し勝手が違います。Liquidをつかって開発する際の注意点をまとめます。 カスタマイズできないプランがある Shopifyにはプランがあり、プランによってはできないカスタマイズがあります。 例えば、チェックアウト画面（カートの次ページから注文完了ページまで）のカスタマイズは、「Shopify Plus」プランでなければできません。…
Laravelは、PHPのWebフレームワークの中では、現在一番人気があります。2011年に公開されてからアップデートを繰り返しており、2020年9月にはLaravelバージョン8が公開されました。 今回は、Laravelバージョン8の機能についてまとめます。 Laravelバージョン8で追加変更された機能一覧 Laravelは、symfonyをベースに作られたWebフレームワークで、「コードが読みやすい」「MVCモデルを採用している」「拡張性と自由度が高い」と言った特徴があります。 バージョン8では、以下のような機能が追加・変更されました。 Laravel Jetstreamモデルファイルの場所変更ダミーデータ作成がより便利に不要なマイグレーションファイルの処理ジョブのバッチ機能追加Rate Limitingの改善メンテナンスモード改良Closure Dispatch / ChainDynamic Blade Componentsイベントリスナー処理の改良新たな時間変更の関数が利用可能にArtisan Serveコマンドの改良ページネーションビュー変更ルートファイルの名前空間の変更 Laravelバージョン8の主要な変更点 一部の変更点について抜粋して解説します。 Laravel Jetstream Laravel Jetstreamは、ログイン・認証機能です。使うことで、以下のような機能が簡単に実装できます。…
2021年5月頃から、GoogleとShopifyの提携が強化されたこともあり、GAFAのうち、GoogleとAmazonの競争が激化していると言われています。 今回は、GoogleとAmazonの競争についてまとめます。 GoogleとAmazonの競争が激化している背景 GAFAなどのビッグテックは、Googleは検索広告、アップルはハードウェア、FacebookはSNS、AmazonはECサイトといったふうに、事業の棲み分けがはっきりとしていました。 ですが、規模の拡大に伴い、各社で他の事業領域への投資が拡大しています。中でも、GoogleとAmazonの競争は、かなり激しくなっていると言えるでしょう。 Amazonが広告に力を入れ始めた 検索結果などに連動した広告を検索広告と呼びます。Googleアドセンスなどが分かりやすいですが、Amazonにも「Amazon広告」と呼ばれる広告キャンペーンが存在します。 2019年の検索広告市場の企業別売上を見ると、73%のシェアという圧倒的な差をつけてGoogleが１位ですが、Amazonがシェア12%で２位に躍り出ています。GoogleからAmazonに乗り換える企業も増えて来ており、2019年時点での予測値では、2021年にはAmazonのシェアが15%を超えると考えられています。Amazonのシェアが広がれば広がるほど、Googleの顧客が減るため、GoogleとしてはAmazonを無視できない状況です。 GoogleがShopifyと連携した 一方でGoogleも、Googleショッピングの展開に加えて、Shopifyと連携するなど、EC事業へ進出しています。Googleショッピングは2010年から展開されており、2021年の5月にはShopifyとの連携が強化されました。 ShopifyとGoogleを連携してできること GoogleとShopifyを連携させると、Shopifyに掲載している商品を、Googleが展開するさまざまなサービスの中で宣伝することができます。ECサイトを運営する側にとっては、Google検索、Googleマップ、youtubeなどのユーザー数の多いサービスに一挙に広告を展開できるというメリットがあります。 また連携が強化されたことにより、Shopifyで構築したECサイトの在庫状況を、リアルタイムで広告に反映することも可能になりました。現在、利用開始から一定期間の間は、無料でGoogle広告の機能を利用できるようですので、Shopifyを使っている方はぜひ一度試してみると良いでしょう。 ECサイトの展開を考えるなら 自社商品をオンラインで販売したいと思った場合、自社でECサイトを作る、ShopifyなどのECプラットフォームを活用する、Amazonや楽天市場などのECモールに出品するなど、いくつかの選択肢があります。 Amazonに出品する場合と、ShopifyとGoogleを活用する場合を考えてみます。 Amazonを活用するメリットとデメリット Amazonへの出品は、非常に簡単です。プログラミングなどの専門知識は不要ですし、サイトデザインなどを考える必要もありません。また、FBAと呼ばれるサービスを活用することで、商品の管理や発送などもAmazonに任せることが可能です。 加えて、既にAmazonというプラットフォームが確立しているため、集客のコストも低いと言えるでしょう。 一方でデメリットは、オリジナルのサイトを作ることができない点です。Amazonで販売すると、他の多くの出品者の商品と同列に商品が並べられるため、他の商品に埋もれてしまうリスクがあります。…
ECプラットフォームのShopifyは、海外展開に強いことで有名ですが、SNS連携でも強みがあります。今回は、Shopifyで新たに連携できるようになったSNSについてまとめます。 Shopifyで新しく連携できるようになったSNS Shopifyでは、様々なSNSと連携することで、より効率よく集客を行うことができるようになっています。 Tiktok Tiktokは、若者に人気のあるモバイル向け動画プラットフォームです。15秒から1分程のショートムービーを簡単に投稿できます。 TikTokの国内ユーザー数は、2019年の時点で既に950万人いると言われていました。2021年時点でのユーザー数は公開されていないため、正確なところはわかりませんが、当時より更に増えていると思われます。 Shopifyでは、2021年の2月から、「TikTok for Business」と連携をはじめました。「TikTok for Business」はTikTokおよびBuzzVideoやPangleといった動画サイトに運用型広告を出稿・管理できる、広告管理のプラットフォームです。TikTok for Businessを活用することで、Shopifyの管理画面から直接動画広告を流すことができるようになります。 TikTokは、もともと中国の企業が運営しているということもあり、海外に対して大きな影響力を持っているアプリです。Shopifyという海外向けECサイトとは非常に相性が良く、TikTokが有する大きな市場に簡単に広告を展開できるのは、非常に魅力的な機能といえるでしょう。 Google ShopifyはGoogleとも連携しています。 Googleは、Google検索だけでなく、Googleマップやyoutubeなど多くのサービスを展開しています。そのいずれもが人々の生活に根ざしており、多くのユーザーを獲得していることは、言うまでも無いことでしょう。 Shopifyは、Googleの持つGoogleショッピングの機能と連携しており、Googleの持つ様々なサービスの中で効率よく広告を展開することが可能です。 Shopifyの在庫状況がGoogleの広告に自動的に反映するように設定できたり、簡単にキャンペーンを展開することができたりします。現在、利用開始から一定期間の間は、無料でGoogle広告の機能を利用できるようですので、Shopifyを使っている方はぜひ一度試してみると良いでしょう。 Netflix…
Webアプリケーションを開発する際、どういった言語・どういったWebフレームワークを採用するかで迷うことはありませんか。 フレームワークにはそれぞれ得意とする分野があり、それを知っておくとウェブ開発がよりスピーディーに、効率よく行うことができます。 今回は、RubyのフレームワークであるRuby on Railsと、PHPのフレームワークであるLaravelについて、それぞれの特徴をご紹介していきます。 どんなフレームワークで開発しようか迷っている方フレームワークについて学びたい方社内のIT人材が不足している方 これらに当てはまる方におすすめの記事となっています。これを読めばRuby on RailsとLaravel、それぞれどのような違いがあるのか、どう言った特徴があるのか丸わかりですよ。 Ruby on Rails Ruby on Railsは、Rubyを用いたWebフレームワークです。2004年に初めてリリースされて以来、多くの人に使われています。 Ruby on Railsの特徴 Ruby on…
WEBアプリ開発にはRubyのフレームワークであるRuby on Railsをおすすめします。 Ruby on Railsは短いコードで作ることができ、シンプルなのも魅力です。 本日はそんなRuby on Railsをおすすめする理由について徹底解説していきます。 Ruby on Railsが気になる方WEBアプリ開発をしたい方効率よく開発する方法を知りたい方 これらに当てはまる方におすすめの記事となっています。これを読めば、Ruby on Railsにどんな特徴があるのか、どう言ったところが魅力なのかが丸わかりですよ。 Ruby on Railsをおすすめする4つの理由 早速、Ruby on…
新規でWebサービスを立ち上げる時、Rubyは優れた選択肢の一つです。 Ruby on Railsを用いることで、少人数で、大規模なWebサービスを立ち上げることができます。 今回は、そんなRuby on Railsを開発に使うメリットと、Ruby on Railsを用いた開発案件の傾向について解説していきます。 Ruby on Railsが気になる方Webサービスを新規開発する予定の方社内のIT人材が不足している方 これらに当てはまる方におすすめの記事となっています。これを読めばRuby on Railsでできることやどういった開発に向いているのかなど丸わかりですよ。 Ruby on Railsを使うメリット Ruby on…
プログラミングやITについて調べてると、RubyとRuby on Railsという単語を見かけることがあるかもしれません。 似ている名前でややこしいなと感じる方もいらっしゃると思います。 今回はそんなRubyとRuby on Railsの違いや、その特徴について解説していきます。 RubyやRuby on Railについて勉強中の方新規システムを開発しようと思っている方 これらに当てはまる方におすすめの記事となっています。これを読めばRubyやRuby on Railsがどう言ったものなのか丸わかりですよ。 RubyとRuby on Railsの違い 「Ruby」はプログラミング言語の一つで、主にサーバーサイドの開発に用いられます。 サーバーサイドのプログラミング言語には、他にもPHPやPython、Javaなどがあります。 日本人開発者が考案したプログラミング言語であり、非常にシンプルで、短く記述できるのが特徴です。 一方で「Ruby…
JavaScriptは、ウェブ開発で必須の言語です。今回は、JavaScriptのフレームワークの１つである、AngularJSについて解説します。類似のフレームワークにAngularもありますが、中身は大きく異なるので、AngularとAngularJSの違いについても触れます。 AngularJSとAngularの違いについて AngularJSは、元々Googleの開発者が、ウェブアプリケーション開発を簡単にするために開発したJavaScriptフレームワークです。 2009年から公開されていましたが、いくつかの問題があったため、2016年に問題点を改善したAngular2（現在Angularと呼ばれています）というフレームワークに変わりました。 Angularは、AngularJSと似た名称ですが、中身が大きく異なります。 たとえば、AngularJSはJavaScriptをメインとしたフレームワークですが、AngularはTypeScriptをメインとしたフレームワークです。 AngularJSとAngularは、基本的に、メジャーリリース後６ヶ月の積極的なサポート＋１２ヶ月の長期サポート期間の合わせて１８ヶ月サポートされます。 AngularJSに関しては、Angularへの移行期間を含めるため、2018年から通常より長い長期サポートに入っていました。コロナの影響もあり、2021年12月までは長期サポートが延長されています。 AngularJSのメリット この記事では、AngularJSの方を見ていきます。 SPA開発に必要な要素がすべて含まれている AngularJSは、ウェブアプリケーション開発を前提としているだけあり、SPA（シングルページアプリケーション）開発に必要なルーティング・Ajax通信・双方向データバインディングといった機能を簡単に呼び出せるようになっています。 また、双方向データバインディングやHTMLテンプレート、スコープ機能など、開発を便利にする機能も多く含まれています。 アプリケーション開発に必要な機能を全て備えたフレームワークと言えるでしょう。 開発工数が少なくてすむ AngularJSは、多機能な割に、動かすために必要な工数がそれほど多くありません。ディレクティブで設定した記述を指定することで、各機能を呼び出すことができます。AngularJSを上手く使えれば、スピード感のある開発を行うことが可能になるでしょう。 AngularJSのデメリット AngularJSには、いくつかのデメリットがあります。 パフォーマンスが低い １つ目はパフォーマンスの低さです。…
JavaScriptはWEB開発を行うにあたって必須の技術です。そんなJavaScriptにはフレームワークというものがあり、普遍的機能をまとめて開発し、効率化していく際に使用することができます。 コーディング規約が決められているため、開発工程が簡素化・効率化され、開発速度が非常に早まるのです。 この記事ではそんなJavaScriptのフレームワークの中でも、特に人気のVue.jsに関してそのメリット・デメリットなどを紹介します。 WEB開発を行う開発者様IT人材を探している方フレームワークについて知りたい方 これらに当てはまる方におすすめの記事となっています。これを読めばVue.jsがどんな人に向いているフレームワークなのかが分かりますよ。 Vue.jsの特徴 Vue.jsには、次のような特徴があります。 UIを作るフレームワークであるドキュメントが充実している日本語の情報が多いコンポーネント志向と双方向データバインディング Vue.jsは、主にUIを作るために用いられており、ドキュメントの充実度や日本語情報の多さから、国内で人気の高いフレームワークとなっています。 コンポーネント志向（パーツごとにプログラミングし、それらを組み合わせることで処理を作る）を採用しているためコードの再利用がしやすく、双方向データバインディング（画面側での変更をスムーズにデータベースに反映する技術）も使えるためウェブアプリのフロント側で活用されています。 国内で有名なウェブアプリとしては、LINE、note、Rettyなども、Vue.jsを採用しています。 Vue.jsのメリット Vue.jsを導入するメリットから見ていきます。 学習コストが比較的低い JavaScriptには、他にもReactやAngularなどのフレームワークも存在しますが、それらと比べてVue.jsのほうが学習コストが低いと言われます。 その理由は先ほども言ったように、シンプルな記述と日本語ドキュメントの多さです。 Vue.jsは、他のライブラリやフレームワークと比べて癖のある記述が少なく、JavaScriptを勉強した人であれば、比較的スムーズに習得可能です。 また、日本語ドキュメントが少ないReactと比べて、日本語の書籍やドキュメントが多いため、学習しやすいという面もあります。 拡張性が高い Vue.jsは非常に拡張性の高いフレームワークです。…