Jamstackサイト開発
WHAT IS JAMSTACK?
WHAT IS JAMSTACK?
WHAT IS JAMSTACK?
Jamstackとは、高いパフォーマンス・セキュリティ・スケーラビリティに優れた、比較的新しいWebサイト開発のアーキテクチャです。JavaScript・API・Markupの頭文字をとって作られた言葉であり、それぞれ以下のような意味があります。
JavaScript
JavaScriptというプログラミング言語のことを指します。ReactやVueなどのフレームワークがよく使用されます。
API
データをやり取りするための仕組みです。データの取得や更新など、バックエンドとフロントエンドを連携させる役割があります。
Markup
マークアップ言語のことで、ブラウザにページを表示する役割があります。簡単に言えばHTMLのことです。
Jamstackは、WordPressをはじめとした従来のCMSと比べると比較的新しいシステム構成で、2018年ごろから注目され始めています。 高いセキュリティ性、ページの表示速度の向上、開発効率の高さ といったメリットがあり、現在では多くの企業サイトに採用されつつあります。
デザイン会社・制作会社様へ
コードハイブは、デザイン会社・Web制作会社様に向けたJamstackサイト制作代行を行なっております。以下のようなお悩みがある場合は、ぜひコードハイブにご相談ください！
従来のCMSでは、ユーザーからのリクエストに応じてサーバー上でHTMLを生成し、ブラウザに表示するという流れでした。Jamstackでは、事前に全ページを静的HTMLに変換しCDNで配信するので、サーバーサイドでの処理を必要としません。そのため、表示速度が爆速になります。
Jamstackではフロントエンドとバックエンドが分離しており、表示されるコンテンツはAPI経由で取得した静的なファイルのみです。そのため、サーバーサイドの脆弱性を悪用する攻撃のリスクが激減し、高いセキュリティ性を保つことができます。
WordPressなどの動的なサイトでは、ユーザーからのアクセスが発生するたびにサーバーとの通信を行う必要がありますが、Jamstackでは静的ファイルをCDNから配信するだけなので、アクセスに対する負荷がほとんど発生しません。
サイトの読み込み速度は、Googleのサイト評価の指標の一つであるCore Web Vitalsに直接影響します。パフォーマンスの向上は検索エンジン最適化にも効果があるので、結果的に高いSEO効果を得ることができます。
Jamstackでは、コンテンツの管理（バックエンド）とコンテンツの表示（フロントエンド）がそれぞれ分離しています。デザインの変更や機能の拡張などをシステムやサーバー等に影響せず対応できるので、メンテナンス性が高いです。
Jamstackではフロントエンドの制約がないため、ReactやVue.jsなどのモダンなフロントエンド技術を使用できます。これらには開発ツールやエコシステムが充実しており、効率的にサイトの開発をすることができます。
コードハイブでは、Jamstackサイト開発には以下のサービス・技術を使用します。
※上記以外をご希望の場合は、相談も可能です。
ホスティングサービスは、サイトの公開・配信に特化したサービスです。完成した静的ファイルをアップロードすると、自動的にネット上に公開されます。さらに、CDNでページを配信するので、表示速度の高速化を実現可能です。
ヘッドレスCMSは、フロントエンド機能を持たないコンテンツ管理システムです。主にバックエンド機能（コンテンツの管理・データベース・コンテンツ配信）担当で、管理画面からコンテンツの入稿などの操作を行うことができます。作成したコンテンツは、APIを通してフロントエンドと連携し、ページ上に表示することが可能になります。
SSGは、静的なサイトを生成するためのツールやフレームワークのことです。コードハイブでは、フロントエンド開発にReactベースのフレームワーク「Next.js」、もしくはAstroを使用します。
まずはお問い合わせフォーム からお気軽にご相談ください。内容を確認したのち、2営業日以内に返信いたします。
ZoomまたはGoogle Meet等のツールでオンラインミーティングを実施し、詳しいご依頼内容をお伺いします。ヒアリングは無料ですので、ご安心ください。
可能であれば、以下の2点をご用意ください。
・デザインデータ
・サイトマップ
以下の形式で、デザインデータのご提出をお願いします。
無料: Adobe XD, Figma
有料: Adobe Illustrator, Photoshop
Adobe Illustrator / Photoshopに関しては、追加費用（全体費用の20%）をいただいております。
ヒアリングの内容をもとに、最適なホスティングサービス、ヘッドレスCMS、その他開発面の仕様を選定し、提案いたします。
いただいたデザインデータと仕様を確認し、お見積もりと納期を提案いたします。
お見積と納期に同意いただけましたら、作業開始となります。
※初めて取引させていただく場合・長期にわたる案件の場合に限り、料金の50%を着手金としてお支払いいただいております。
お見積もりの金額と納期にご同意いただけましたら、サイトの実装を開始いたします。
コーディング対応中は、進捗管理シートにてプロジェクトの進捗状況を常にご確認いただけます。
作業が完了しましたら、データをテスト環境にてご確認いただきます。
制作物が仕様と異なる場合・バグが発生した場合は、修正対応を行います。
※デザインの大幅な変更、仕様変更は有料となる場合があります。
サイトのデプロイまたはファイル送付をもって納品といたします。
納品が完了したら、請求書を送付いたしますのでお支払いをお願いいたします。
既に着手金をお支払いいただいている場合は、残りの費用のお支払いをお願いいたします。
納品後1ヶ月以内の修正依頼は無料で対応いたします。
※デザインの大幅な変更、仕様変更は有料です。
CONTACT US! CONTACT US! CONTACT US!
CONTACT US! CONTACT US! CONTACT US!
CONTACT US! CONTACT US! CONTACT US!
