つくったもの
kula (ウェブアプリ)
サイボウズ株式会社の提供している業務改善プラットフォーム「kintone」との連携を想定したウェブアプリを運営しています。
kintone とは、業務で使用する様々な情報をアプリ単位で管理するプラットフォームです。類似するアプリとしては Microsoft の Power Apps や Google の AppSheet が近いと思いますが、SFA や CRM として活用されることも多く、SalesForce や Zoho CRM と比較されることもあります。
kula ではこの 1 アプリを CMS のように捉え、API を介してデータを取得し、ブログやオウンドメディアを作成することができるサービスです。
システム構成図
トップ画面
技術スタック
-
言語: TypeScript, Node.js
-
フレームワーク: React, Next.js
-
ツール・サービス: Firebase(認証機能・データベース・ストレージ), Sentry(エラーログ)
kintone プラグイン
kintone に用意されているエコシステムの 1 つとして、プラグインがあります。プラグインの構成は Chrome の拡張機能に似ており、HTML、CSS、JavaScript で構成され、導入することで、kintone の機能を拡張することができます。
このプラグインをオープンソースで公開しており、多くの法人に導入いただいています。
開発とリリースフロー
ポートフォリオ(このサイト)
Next.js を用いて作成し、Cloudflare Pages にデプロイしています。
API Routes のみ Edge ランタイムで動作させ、それ以外のページは SSG で生成しています。
また、現在値を取得する必要のあるページについては、 Cloudflare Workers を使用して、Vercel の ISR(Incremental Static Regeneration)を部分的に再現しています。
kintone プラグインの利用者数は sqlite(Cloudflare d1)を使って収集・管理していますが、訪問者がこのサイトにアクセスする度、データを集計し表示するのはリソースを多く消費してしまいます。
これを解決するアプローチはいくつかありますが、このサイトでは各エンドポイントに ttl を設定し、sqlite から取得・集計した情報を Cloudflare KV へキャッシュし、ウェブサイトに表示するようにしています。
バージョンについて
何度か作り直しています。
学習を兼ねて作ることが多かったですが、現在は自分の目標を人の目に触れる場所に置き、目標を達成するためのアウトプットの場として利用しています。
技術スタック
技術スタックの変遷は以下の通りです。
バージョン | フレームワーク | ホスティング |
---|---|---|
v1 | Gatsby.js | Netlify |
v2 | Next.js | Vercel |
v3 | Next.js | Cloudflare Pages |
v4 | Next.js | Cloudflare Pages(Edge ランタイム) |
ブログ
何度か作り直しているブログです。2024 年 5 月に 10 万 PV/月を達成しました。
技術スタック
作り直す度に、その時関心のあるフレームワークを採用して作りました。
変遷は以下の通りです。
バージョン | フレームワーク | ホスティング | コンテンツ管理システム |
---|---|---|---|
v1 | Gatsby.js | Netlify | Contentful |
v2 | Next.js | Vercel | Contentful |
v3 | Next.js | Cloudflare Pages | CDN |
v4 | Astro.js | Cloudflare Pages | CDN |
その他のブログ
発信のコアとなるブログに加えて、いくつかのブログを運営しています。