Jamstackへの移行：Mambuのケーススタディ

Gatsby、Sanity、およびNetlifyこそが唯一のSaaSクラウドバンキングのプラットフォームです。

著者：Michal Zielinski 2020年9月8日
原文：https://bejamas.io/blog/saas-banking-platform-jamstack/
補足：Bejamas社に許可を取った上で、掲載しております

目次

1. 顧客
2. JamstackとGatsbyは大規模な組織にどのように役立ちますか？
3. Sanityでコンテンツを管理する
4. Netlifyによって処理されるCI / CD
5. いくつかの技術
6. 大企業での作業は、中小企業での作業とどのように異なりますか？

以下全文、元記事の翻訳です。

2019年の初めに、クラウドベースの勘定系プラットフォームでfintech、銀行、および貸付ビジネスを強化するテクノロジー企業であるMambuが、マーケティングウェブサイトをJamstackに移行したいと私たちに連絡をくれました。彼らは最新のスタックを望んでおり、パフォーマンスとセキュリティに妥協はありませんでした。

大規模な組織向けのウェブサイトを構築するのは難しい場合があります。技術スタックの選択の問題もありますが、さまざまな利害関係者と協力し、彼らの期待に応えるという別の問題もあります。

世界中で300人の従業員と9つのオフィスがあり、Mambuの事業規模は真にグローバルです。私たちは、彼らの要求に別の方法でアプローチしなければならないことを知っていました。

1. 顧客

Mambuは会社のウェブサイトをHubSpotCMSから移動していました。彼らは、視覚的な側面を改善するだけでなく、マーケティングの一貫性を確保しながらグローバルなスケーリングを可能にする、よりパフォーマンスが高く信頼性の高いスタックを使用したいと考えていました。金融機関にサービスを提供する会社にとって、新しいウェブサイトができるだけ安全で高速であることを確認することは非常に重要なことでした。

MambuチームはすでにJamstackに精通していたため、Gatsby、Sanity、およびNetlifyのスタックを使用することをすぐに決めました。それにはいくつかの理由があります。

プロジェクトに選択されたツールは、信頼性が高く、安全で、将来性があることでよく知られています。その上、以前に他のクライアントと仕事をする際にも使用したツールだったため性能を保証することができました。

クラス最高のツールを使用する開発者である私たちにとって、これらのツールが本番環境ではるかに高速に移動できることはすでに知っています。敏捷性はMambuのコア哲学の1つであり、迅速に開始できることは私たちにとっても大きなメリットになります。

Mambuのレガシーウェブサイトは遅く、過度に複雑で、構造化されたデータが不足していたため、操作が困難でした。彼らはそれを変更し、新しいデザインを導入し、さまざまなチームのワークフローを簡素化する一方で、ベストプラクティスを維持したいと考えていました。

2. JamstackとGatsbyは大規模な組織にどのように役立ちますか？

JamstackとGatsbyは、高性能を超えた優れたアーキテクチャの選択肢です。ReactはGatsbyの基盤であるため、さまざまなソースからデータを取得して結合し、サイトのより動的な部分を簡単に作成することができます。

Mambuはすでに構造を確立していました。会社のさまざまなチームが、さまざまなツールを使用して運用していたため、ウェブサイトでこれらのサービスを統合する必要がありました。たとえば、HRチームは引き続きLeverを求人情報に使用でき、マーケティングチームは引き続きHubSpotを介してリードを受け取り、カスタマーサクセスチームはポータルアプリを介して顧客データにアクセスできるようにする必要がありました。

ありがたいことに、Gatsbyには豊富なプラグインエコシステムがあり、統合が簡単になり、チームは好みのサービスを引き続き使用することができます。

最も重要なことは、Jamstackは、物事を迅速に立ち上げて実行するのに役立ち、新しいアイデアを実装するための多くの余地を与えてくれました。スタック内のGatsbyやその他の確立されたツールを使用することで、再開発に時間を費やすことなく、可能な限り最高の結果を得ることができました。

3. Sanityでコンテンツを管理する

Mambuが選んだヘッドレスCMSは、彼らのユースケースに最適でした。SanityはGatsbyと非常によく統合することができます。APIからデータをすばやく取得できるだけでなく、コンテンツエディターのリアルタイムプレビューを作成することもできました。

Mambuは柔軟性を望んでおり、Sanityによってそれを可能にする構築を行うことができました。従来のCMSから離れることは、セキュリティとパフォーマンスの向上も期待できます。

しかし、最も重要なことは、Sanityのブロックコンテンツにより、エディターがリッチテキストフィールドにドロップして複雑なページレイアウトを柔軟に構築できる埋め込み可能なブロックを作成できることです。これにより、編集者とデザイナーがSanityで共同作業しやすいようにする設計システムを作成することができます。

4. Netlifyによって処理されるCI / CD

スタックでは、Netlifyはビルドおよびデプロイメントプラットフォームを作成します。

プラットフォームはGatsbyとシームレスに統合され、構成をほとんど必要とせず、完全に管理されます。これにより、深夜にアプリケーションサーバーがクラッシュしても、エンジニアをたたき起こさなくて済みます。

Netlifyの稼働時間は比類のないものです。私たちがMambuと協力してきた一年の間に、Mambuのサイトが利用できなくなったのは一瞬もありませんでした。

開発チームとしての私たちにとって、Netlifyでの作業は、基本的な機能だけでなく、サーバーレス機能などのより高度な機能の両方で継続的に素晴らしい経験をすることができました。

5. いくつかの技術

では、技術的な観点からMambuと仕事をすることは、私たちにとって他と何が違うのでしょうか？

おそらく、私たちにとって最も注目すべき変更は、JavaScriptの代わりにTypeScriptを使用したことです。長期的には、TypeScriptを使用する最大の利点は、古いコンポーネントとロジックに基づいた新しい機能と画面の実装がはるかに簡単になることです。TypeScriptは、コードベースをより適切に維持し、他の開発者をプロジェクトにオンボーディングする時間を短縮するのに本当に役立ったため、追加する価値があります。

品質と一貫性を維持するという観点から、私たちはさまざまなリンター、単体テスト、およびエンドツーエンドのテストを使用してきました。潜在的な問題を迅速に発見できたため、コードベースを維持する際に非常に役立つことがわかりました。

6. 大企業での作業は、中小企業での作業とどのように異なりますか？

大企業と協力するということは、さまざまな利害関係者がプロセスに関わります。開発チームとして、私たちは彼らのユニークな好みや意見を最終製品に組み込む必要がありました。

このことを念頭に置いて、私たちのコミュニケーションプロセスが完璧であることが最も重要でした。彼らのために構築したものが可能な限り優れていることを伝えるために、なるべく明瞭にかつ積極的にコミュニケーションを取りました。

複数のプロジェクトでBejamasと集中的に協力してきた私たちのパートナーシップは、専門的で生産的な経験を積めたため、非常に印象的でした。Bejamasのチームは応答性が高く、アイデアに溢れ、必ずコミットメントしてくれます。Jamstackと>Reactを含む最新のウェブ開発プロジェクトの最良なパートナーとしてBejamasを強くお勧めします。
Eppo Heemstra
Mambuのマーケティングオペレーターマネージャー

Jamstackはかなり新鮮なアプローチのように見えるかもしれませんが、信頼性に関してはずば抜けています。これは、大規模な組織で作業するときに最も重要な期待であると私は信じています。

Jamstackを使用すると、安全になるということは、最終製品が退屈であるという意味ではありません。最も複雑なアイデアでさえ実装するための多くのスペースを提供してくれます。

最後まで読んで下さり、ありがとうございました

Jamstackに関心がある方はこちらまでお問合せください！
株式会社ヒューマンサイエンス
https://www.science.co.jp/document/jamstack.html