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」プランでなければできません。 プランによってできることとできないことがあるので注意しましょう。 外部アプリを利用するとLiquidファイルが増える カスタマイズ時、外部アプリをインストールすると、Liquidファイルが自動で作成されます。そのまま使う分には問題ありませんが、必要なくなった外部アプリをアンインストールする際には注意が必要です。 アンインストール時、作成されたLiquidファイルは自動で削除されません。余計なファイルの存在は、エラーの原因になりかねないため、アンインストール時はインストール時に作成されたファイルを削除するようにしたほうが良いでしょう。 対策として、外部アプリをインストールする前に、元のテーマのバックアップを作っておくことをおすすめします。バックアップは、Shopify管理画面の”オンラインストア>テーマ>現在のテーマ>アクション>複製する”で行えます。 Shopifyのカスタマイズならdehaにご相談ください 以上、Shopifyのテンプレート言語であるLiquidについてまとめました。 Liquidを使えば、独自性の高いオリジナルデザインのECサイトを作ることができる Liquidは、View側のカスタマイズに用いられるテンプレート言語 プログラミング言語に似ているが、Liquid独特の記述もあるので、開発には注意が必要 ただ単にShopifyを使う分には、特別な知識は必要ありませんが、独自性の高いサイトを構築するには、ウェブ開発の知識に加えてLiquidの知識が必要になります。 dehaは、Shopifyの公式パートナーとして、Shopifyの開発案件を受けてきました。ベトナムオフショアですので、国内での開発より低いコストで、高品質な開発を行うことができます。 自社ブランドをShopifyで展開したい企業様や、Shopify案件を受けたものの開発リソースが足りないITベンダー様など、Shopify開発でお困りの場合はぜひ一度dehaにお問い合わせください。

Laravelは、PHPのWebフレームワークの中では、現在一番人気があります。2011年に公開されてからアップデートを繰り返しており、2020年9月にはLaravelバージョン8が公開されました。 今回は、Laravelバージョン8の機能についてまとめます。 Laravelバージョン8で追加変更された機能一覧 Laravelは、symfonyをベースに作られたWebフレームワークで、「コードが読みやすい」「MVCモデルを採用している」「拡張性と自由度が高い」と言った特徴があります。 バージョン8では、以下のような機能が追加・変更されました。 Laravel Jetstream モデルファイルの場所変更 ダミーデータ作成がより便利に 不要なマイグレーションファイルの処理 ジョブのバッチ機能追加 Rate Limitingの改善 メンテナンスモード改良 Closure Dispatch / Chain Dynamic Blade Components イベントリスナー処理の改良 新たな時間変更の関数が利用可能に Artisan Serveコマンドの改良 ページネーションビュー変更 ルートファイルの名前空間の変更 Laravelバージョン8の主要な変更点 一部の変更点について抜粋して解説します。 Laravel Jetstream Laravel Jetstreamは、ログイン・認証機能です。使うことで、以下のような機能が簡単に実装できます。 ログイン ユーザー登録 メール認証（本人確認、本登録メール） ２段階認証 セッション管理 API（Laravel Sanctum） チーム管理 ログイン機能自体はlaravel/uiという別パッケージとして、以前から存在していましたが、Laravel Jetstreamから「チーム管理」が追加されています。 これにより、マイグレーションの変更なしに、各ユーザーのカテゴリ分けが可能です。 またLaravel Jetstreamでは、以下のような内部的な変更もありました。 利用しているCSSフレームワークがbootstrapからTailwind CSSになった JavaScriptのシステムとして、LivewireまたはInertiaのどちらかのライブラリを選択できるようになった モデルファイルの場所変更 従来のLaravelでは、モデルファイルがappディレクトリ直下に存在していましたが、バージョン8からはapp/Modelsディレクトリ下に変更となりました。 ファイルをモデル（データベースの操作などを行う部分）、ビュー（画面を操作する部分）、コントローラー（データの処理を行う部分）の３つに分ける考え方を、MVCモデルと言います。 MVCモデルを採用するメリットは、ソースコードの管理や拡張がしやすくなり開発効率が良くなるという点です。 これまでのLaravelでは、コントローラーファイルは「Controller」ディレクト、ビューファイルは「View」ディレクトリに入っているのに、モデルファイルだけ変な場所にあるという状態でした。 ディレクトリ構成が変わったことで、よりソース管理しやすくなると思われます。 […]

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とGoogleを活用するメリットとデメリット Shopifyは、ECサイトを製造管理するためのプラットフォームです。他のECサイトプラットフォームと比べて、自由度が高い点、SNS連携を含めたマーケティング機能が充実している点、越境EC（海外向けに多言語化・外国通貨での決済が可能なECサイト）を構築しやすい点などを高く評価されています。 Amazonへの出品と比較した場合のメリットは、非常に自由度が高く、オリジナリティの高いサイトを作ることができる点でしょう。実は、NetflixのECサイト「netflix.shop」も、Shopifyで構築されています。 一方でデメリットは、多機能すぎるがゆえに、扱いが難しい点です。ただECサイトを作るだけなら、調べればできるかもしれませんが、高度なカスタマイズをするためにはプログラミングなどの専門知識が必須となります。 Shopifyの開発ならdehaにご相談ください dehaでは、国内開発よりも人件費を抑えることができる、ベトナムオフショア開発を行ってきました。 Shopifyの開発実績も多数あります。 Shopifyで作成したECサイトのカスタマイズを検討中の企業様、またShopifyでの開発案件を受注したものの開発リソースが足りていない開発会社様などは、ぜひ一度dehaにご相談ください。

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 SNS連携とは少し異なりますが、2021年6月には、サブスクリプション動画サービスのNetflixが、Shopifyを利用したオリジナルストアである「netflix.shop」を立ち上げました。 こちらのサイト、調べてみていただくとわかると思うのですが、非常に完成度が高いECサイトとなっています。「映画館の帰りにパンフレットなどを買うような気持ちで利用できるように」と、デザインなど細部に拘ったECサイトです。 Shopifyでは、「Liquid」という独自のテンプレート言語が存在しており、やろうと思えば無限にカスタマイズすることが可能です。ブランドイメージを崩さないECサイトを作りたい場合でも、問題なくハイクオリティなサイトを構築することができるでしょう。 以前から連携できたSNS Shopifyでは、今回紹介したTikTokやGoogleだけでなく、いくつもの大規模SNSと連携することが可能です。以下に、以前から連携できたSNSをまとめておきます。 Instagram Facebook Twitter Pinterest いずれのSNSでも、Shopifyで作ったECサイトと連携したショップ用アカウントを作成することができたり、SNS内部での広告と連携したりすることができます。 以前から、SNSを介してものを購入するユーザーが増えていることが指摘されていましたが現代社会での広告宣伝では、SNSの活用は必須といえます。せっかくSNSと連携しやすいShopifyを使っているのであれば、上記のような機能を活用しない手はないでしょう。 Shopify開発なら、dehaにご相談ください dehaでは、5年間に渡り、ベトナムオフショア開発を行ってきました。Shopify関連の開発実績も多数あり、Shopifyに公式認定されているShopifyパートナーでもあります。 Shopifyは非常に多機能で便利なECプラットフォームではありますが、その反面、多機能過ぎて使いこなすのにコストがかかりがちです。 ベトナムオフショア開発では、国内開発より、低コストで高品質なエンジニアをアサインすることができます。 「自社ECサイトをShopifyにリプレイスしたい」「Shopifyを導入したものの、複雑すぎて使いこなせていない」という事業会社様や、 「Shopify開発案件を受けたものの、リソース的に不安がある」という開発会社様は、ぜひ一度dehaにご相談くださいませ。

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 Railsには、以下の８つの原則があります。 プログラマの幸福度を最適化 設定より規約（慣習）を重視する メニューは”おまかせ”で パラダイムが1つではない 美しいコードを称える 統合システムを尊重する 安定性より進歩を重視する テントを押し上げる これら原則に加えて、Rubyというプログラミング言語自体の「英語を記述するように、直感的にわかりやすいコーディングが可能」「他のプログラミング言語に比べて、記述するコード量が少なくて済む」といった特徴が合わさります。 Ruby on Railsのメリット これらにより、Ruby on Railsには以下のようなメリットがあると言われます。 短いコードで、たくさんの機能を実装できる 複雑な設定を行うことなく開発ができる 誰が作っても、シンプルでわかりやすい記述になる 作ったシステムが、デザインパターンにそった構造になっている 少人数での開発や、短期間でのプロトタイピングにも向いていますが、記述がわかりやすい点や規約にそった作りになる点から、大規模なチームでの開発にも向いています。 Ruby on Railsのデメリット 一方で、以下のような弱点があります。 使いこなすには規約を覚える必要があり、学習コストがかかる 規約から外れることをするのが難しい 作成したアプリケーションの速度がやや遅い 複雑な機能が求められるアプリケーションには、Ruby on Railsはあまり向いていないと言えます。 Laravel LaravelはPHPを用いたWebフレームワークです。 […]

WEBアプリ開発にはRubyのフレームワークであるRuby on Railsをおすすめします。 Ruby on Railsは短いコードで作ることができ、シンプルなのも魅力です。 本日はそんなRuby on Railsをおすすめする理由について徹底解説していきます。 Ruby on Railsが気になる方 WEBアプリ開発をしたい方 効率よく開発する方法を知りたい方 これらに当てはまる方におすすめの記事となっています。これを読めば、Ruby on Railsにどんな特徴があるのか、どう言ったところが魅力なのかが丸わかりですよ。 Ruby on Railsをおすすめする4つの理由 早速、Ruby on Railsのメリットを、Ruby on Railsの特徴を踏まえてまとめます。 短いコードで、Webアプリケーションのベースを作れる Ruby on Railsは、非常に短いコマンドで、多くの処理を作成することができることで有名です。 たとえば、Ruby on Railsを使えば、５行ほどのコマンドでブログサービスを立ち上げることができます。 もちろん基本的な機能しか入っていないため、実際に使うには幾つかカスタマイズすべきですが、ブログやSNSといった良くあるウェブサービスの基本機能は、非常に少ないコマンドで作成可能です。 Ruby on Railsを用いれば、短いコードで骨格を組み上げることができるため、差別化となる機能の開発に集中できたり、少ない人数でも大規模サービスを製造できたりします。 規約に基づいた綺麗な設計ができる Ruby on Railsの設計理念には、CoC（Convention over Configuration）＝「設定より規約」というものが含まれています。 これは普通のフレームワークで要求されがちな、たくさんの設定を省略し、あらかじめ決まっている規約に則ってアプリケーションを構築してくれます。 簡単に言うと、ルールさえまもっていれば、深く考えずに作ってもある程度綺麗な設計（MVCモデルなどのデザインパターンに沿った）アプリケーションを作ることができるという意味です。 デザインパターンに沿ったアプリケーションは、機能追加や仕様変更にも対応しやすく、中長期的な運用にも耐えます。 シンプルでわかりやすいコードになる Ruby on Railsは、Rubyをベースにしています。 Rubyは、日本人プログラマーのまつもとゆきひろ氏によって作られた言語ですが、「英語を記述するように、直感的にわかりやすいコーディングが可能」「他のプログラミング言語に比べて、記述するコード量が少なくて済む」といった特徴があります。 結果として、Ruby on Railsのコードも、シンプルでわかりやすいものになります。 シンプルなコードで作られたシステムは、バグも少なくなりがちですし、複数人で開発するときに、メンテナンスしやすいというメリットにも繋がります。 情報が豊富で開発しやすい […]

新規で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 Railsは、プログラミング言語Rubyを用いた、Webフレームワークです。 Ruby on Railsには、幾つか際立ったメリットがあるため、それを紹介します。 短いコードで開発できる Ruby on Railsは、非常に短いコードで、たくさんの機能を実装できることで有名です。 その背景には、Ruby on Railsの８つの原則があります。 プログラマの幸福度を最適化 設定より規約（慣習）を重視する（Convention over Configuration、CoC） メニューは”おまかせ”で パラダイムが1つではない 美しいコードを称える 統合システムを尊重する 安定性より進歩を重視する テントを押し上げる この中の、「メニューは”おまかせ”で」という思想は、「よく使う機能や設定に関してRailsのおすすめをデフォルトにしてくれているよ」という意味合いがあります。 短いrailsコマンドを書くだけで、おまかせ設定のWebアプリケーションを製造してくれるのです。 これにより、特別な設定や、特定の記述をしなくても、少ない手間でシステム開発を行えます。 少人数で開発できる 上記の「短いコードで開発できる」にも関連しますが、Ruby on Railsは、少人数開発にも向いています。 理由は、短いコードで素早く開発できるため、マンパワーが少なくてもたくさんの機能を実装できるからです。 新規開発にも向いているフレームワークのため、スタートアップ企業のような、少数精鋭チームでの開発に重宝されます。 一方で、大人数での開発でも、実はRuby on Railsは使いやすいです。 […]

プログラミングや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 on Rails」は、Rubyを用いたフレームワークです。 フレームワークとは、プログラミングでよく使われる機能を、短い記述で作成できる便利な開発ツールのことを指します。 なので、Ruby単体で開発を行うことは可能ですが、Rubyを理解せずにRuby on Railsだけ使うということはできません。Ruby on Railsを使うためには、Rubyを理解しておく必要があります。 Ruby on Railsの特徴 Ruby on Railsは、非常に短い記述で、たくさんの機能を実装できるという特徴があります。 他のフレームワークでも、短い記述で処理を作ることが可能ですが、Ruby on Railsはその中でも書いているコードの量に対して作れる処理の量が多いということで、少人数での開発現場で重宝されていました。 Ruby on Railsは、MVCモデルを前提としたWEBアプリの開発に特化しており、人数が少ないスタートアップ企業で採用されることが多いです。 単純なウェブサイトから、SNSサービスや、ECサイトなどの開発も行えます。 ちなみに、MVCモデルは、モデル（データベース）、ビュー（画面）、コントローラーの3つの要素に処理を分割するという設計思想のことで、仕様変更に耐えうるシステムを作るのに適しています。 合わせて読みたい＞＞【Laravel入門者向け】Laravel6系+PHP7.4でMVCの流れをサクッと試す (Mac編) Ruby on Railsで作られているサービス Ruby on Railsは、以下のようなサービスで採用されていました。 クックパッド 日本最大級のレシピサイト「クックパッド」もRuby on Railsで開発されています。 […]

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には、いくつかのデメリットがあります。 パフォーマンスが低い １つ目はパフォーマンスの低さです。 AngularJSには、「スコープ」と呼ばれる機能があります。これは一般にプログラミングで使われるスコープのことではなく、画面を監視・変更する特殊なオブジェクトを指しています。 またAngularJSには、「消化サイクル」（digest cycle）と呼ばれるある種のループ構造があり、むやみにスコープを増やしてしまうと、画面を監視する処理が無駄に呼ばれてしまい、速度に影響が出てしまいます。 いろいろな書き方ができる AngularJSでは、同じ処理を作るのに複数の方法が存在しています。いろいろな書き方ができるのは、一見するとメリットのように感じますが、チーム開発においては、コードの書き方が統一されなくなるリスクを生みます。 コードの書き方が統一されていないとコードの可読性が下がってしまうので、不具合に繋がりかねません。 機能追加されない 上述したように、AngularJSは2021年12月にはサポートを終了してしまいます。現時点でも、新機能の追加は止まっており、今後機能追加のアップデートは行われないでしょう。 それだけでなく、サポート終了後は、それ以降発見されたバグへの対応も遅くなると思われます。新しく立ち上げるプロジェクトにAngularJSを採用するのはおすすめできません。 AngularJSでの開発・改修案件ならdehaにご相談ください ここまで、AngularJSのメリットデメリットについて見てきました。気をつけたい点として、AngularJSは「Angular」という別のフレームワークとしてアップデートされており、今後アップデートされることは無いという点があります。 新規立ち上げのプロジェクトに関しては、AngularJSではなく、AngularやReactなどの別のフレームワークを選択するのが良いでしょう。 dehaでは、過去5年に渡り、ベトナムオフショア開発を行ってきました。ベトナムオフショア開発では、国内開発よりも費用を抑えて、優秀なエンジニアを登用することができます。 AngularJSの開発・改修案件などで、エンジニアのリソースが足りない場合、ぜひdehaにお問い合わせくださいませ。

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は非常に拡張性の高いフレームワークです。 Vue.jsで記述してる箇所に、他のフレームワークの処理を入れ込んだり、画面の一部だけをVue.jsで記述したりすることができるなど、かなり柔軟に使うことが可能です。 コンポーネント志向である Vue.jsの特徴であるコンポーネント志向は、開発者にとって大きなメリットになります。 コンポーネント志向であることにより、コードの一部を再利用することができるため、非常にわかりやすくきれいなコードを書くことが可能です。 コードの再利用性・可読性が高いと、潜在的なバグを減らすことができたり、プログラムの改修や機能追加の際に、余計な工数を発生させずにすみます。 SPA開発に向いている SPA（シングルページアプリケーション）とは、画面側で可能な限りの処理を行うことで、サーバーとの通信量を減らし、高速なウェブアプリを作る技術です。 Vue.jsはSPA開発を比較的簡単に実装できるため、SPA開発の現場で注目されています。 MVVMモデルに適している Vue.jsの特徴である双方向データバインディングは、MVVMモデルのアプリケーションを開発するのに非常に適しています。 MVVMモデルとは、Model（データ）、View（画面）、VM（ビューモデル）という３つの構成要素でアプリを構築する考え方です。 VMは、従来のMVCモデルにおけるControllerの代わりとなる部分ですが、ControllerがViewから受けたデータを処理してModelに反映させていたのに対して、リアルタイムでViewの変更をModelに反映する役割を担います。 Vue.jsの双方向データバインディングは、まさにVMに当たる機能であり、MVVMモデルのアプリ開発に適していると言えます。 Vue.jsのデメリット 一方で、Vue.jsにはデメリットもあります。 大規模開発には向いていない Vue.jsは、シンプルなフレームワークであるため、大規模開発にはあまり向いていません。 大規模開発の場合は、ReactやAngularなどを検討するほうが良いでしょう。 モバイルアプリ開発などには転用できない Vue.jsは、あくまでもウェブアプリの開発に使われる技術であるため、スマホネイティブアプリに使うことはできません。 Reactであれば、React Nativeを用いることで、スマホネイティブアプリも作ることができるので、もしモバイルアプリも検討中であればReactを選択したほうが良いかもしれません。 Vue.jsでの開発ならdehaにおまかせください いかがでしたか。本日はJavaScriptの人気のフレームワーク、Vue.jsについてそのメリット・デメリットなどを紹介していきました。 Vue.jsは学習コストが低く、拡張性が高いなどのメリットがありました。その一方、Vue.jsはウェブアプリの開発に使われるフレームワークのため、スマホアプリ開発にはReact Nativeの利用をおすすめします。 dehaでは、本日紹介したVue.jsなどを利用したシステム開発も行っています。 国内よりも人件費を抑えられるベトナムオフショア開発で5年に渡る開発実績があります。 エンジニアのリソースが足りないとお悩みの場合やフレームワークについてもっと知りたい場合は、ぜひお気軽にdehaにお問い合わせくださいませ。