toneについて 最近、「tone（トーン）」というタスク管理サービスを開発しました。toneは人とAIのためのシンプルで軽量なタスク管理サービスです。GitHub issueやJIRAでは、エンジニアにフォーカスされすぎて職種横断で使いづらかったり、機能が多すぎてハードルを感じたりします。toneは職種横断で使えるようなわかりやすいUIや機能をメインとしつつ、AIユーザーやMCPサーバの提供といった、人とAIの協働を目指して開発を続けています。 無料で使えるのでぜひ登録してみてください。 今回はtoneの技術スタックや工夫点を紹介します。 バックエンド インフラ構成 インフラ構成はざっくり以下のような感じです。 Cloudflare ドメイン管理とWAF（セキュリティルール）を使用しています Cloud Run WebAPIやイベント駆動のバッチ処理、Webhook受信などサービスに関わ

最近「microCMS Document MCPサーバー」を作って公開しました。 以前作ったmicroCMS MCPサーバーとは違い、これは公式ドキュメントをLLMに参照してもらうためのMCPサーバーです。 この記事ではDocument MCPサーバーの必要性や実装方法についてまとめてみます。 Document MCP Serverってなに？ みなさんMastraは使っているでしょうか？ TypeScriptでAIエージェントを作れるフレームワークなんですが、面白いのがセットアップ時に自動でMastra MCPサーバーがCursorやClaude Codeに追加されます。 このMCPサーバーはMastraのドキュメントやブログなどの公式情報を参照するもので、Mastraを使って開発していく際にはとても有用です。この体験がとても良いなと思い、真似して作ってみたというのが今回の背景です。 ドキ

ということで作った。 サイト Podcast URL ソースコード Overcastでも普通に聴けてて便利。 動機 最近の情報収集方法はもっぱら、はてブのお気に入りフィードとXのおすすめフィードだ。特にXのおすすめフィードはうまく調教出来ていると日英問わず興味深い記事ばかり大量に流れてくる。 今まではそれらの記事をはてブしてとりあえず"あとで読む"に入れておくという運用にしていた。ところがご存じの通りほとんどの人間は"あとで読む"に入れてしまうとあとで読まないことがわかっており、ご多分に漏れず自分も"あとで読む記事"がどんどん溜まっていき消化できなくなっていた。 最近NotebookLMを使っていて、WebページでもPDFでもとにかくコンテンツはなんでも突っ込んでおけば、いい感じにPodcastが作成されるという体験がうらやまし〜と思っていたところだったので、じゃあこれの自分のはてブ版作る

はじめに 昨年、AWS のインフラを運用・監視する上で使いやすいと思ったサービスを組み合わせて構成図を紹介した記事、「【AWS】ぼくのかんがえたさいきょうの運用・監視構成」が投稿したその日の Qiita のトレンド 1 位になり、はてなブックマークのテクノロジー分野でトップを飾りました。（たくさんの方に見ていただき感謝してます！） 本記事では「ぼくのかんがえたさいきょうの運用・監視構成」の続編として「ぼくのかんがえたさいきょうの DevOps 実現構成」を紹介させていただきます。あくまでも「ぼくのかんがえた」なので私個人の意見として受け入れていただけると助かります。 前回の記事でもお伝えいたしましたが、各個人・企業によって環境は違うと思いますし、使いやすいサービスは人それぞれだと思うので、これが正解という訳ではありません。一個人の意見として参考にしてただければ幸いです。 また、こちらの記事

ヘッドレスCMSという言葉をご存知でしょうか？ まず、CMSとはContent Management Systemの略でありウェブサイトのニュースや記事などを管理することの多いシステムです。代表的な製品としてWordPressがあげられます。 次に「ヘッドレス」ですがこれは「見た目を有していない」という意味です。 まとめるとヘッドレスCMSとは、WordPressなどの従来のCMSとは異なり、表示部分をなくしてAPIベースでコンテンツを取得することが特徴のコンテンツ管理システムです。 ヘッドレスCMSに関する詳しい解説は下記記事をご覧ください。 参考：今話題の「ヘッドレスCMS」とは？ Jamstack、マルチデバイスにも対応したCMSの新潮流 ※弊社COOの寄稿記事です このヘッドレスCMSは従来とは異なる仕組みであるため、向いているケース・向いていないケースが顕著に存在しています。 我

こんにちは。昨年の11月にエンジニアとしてコミューンに入社したざびえる（仮名）です。 コミューンは、CEOのブログ「進出して分かった日本とアメリカのSaaSプロダクトニーズの違い｜高田優哉/commmune｜note」にもある通り、アメリカ進出をしており、私はその開発担当をしています。 この記事では、海外展開に関わるようになった経緯や、プロダクトのグローバル化をどのように進めているか、そして今後のグローバル化の課題などをお話しようと思います。 GlobalPJ参加の経緯 新卒でWebエンジニアとして働き始めてから常々「日本初のソフトウェアプロダクトで世界的に使われるものってないな。いつかそういうプロダクトが出て来れば日本のソフトウェア業界ももっと盛り上がって、優秀な人がソフトウェアエンジニアとして集まってくるだろうに」と思っていました。 一つ思い当たるのはプログラミング言語のRubyですが

はじめにこれは何？ 数カ月間マーケット調査、商談をして見えてきた日本とグローバルでSaaSプロダクトに求められることの違いを紹介する 誰向けの記事？ グローバルで利用されるプロダクト開発に興味のあるPdM, エンジニアの方 まとめると？ 競合がエグい。日本はプロ野球で、グローバルはメジャーリーグみたいなイメージ。プロダクトは広く浅く→狭く深くに要件が変わる。 エコシステム、SaaS市場の成熟度の違いから、インテグレーションファーストになる 時差や人件費の違いがプロダクトに影響を与え、セルフサービス前提の設計になる 伝えたいこと グローバルで使われるSaaSプロダクトづくり（＝メジャーで野球する）、そしてそこで勝つためのプロダクト・開発組織づくりに経営者として本気で取り組みます。 メジャーで勝利するために、優秀なメンバーが集まり、切磋琢磨し、成長できる環境。勝ち筋も見えています。他ではできな

ヤフーという大手企業を退職し、なぜ次にコミューンを選んだのか、そして、すでに動き出しているコミューンの海外展開へ向けての開発の現状をお伝えします。 東京工業大学大学院博士課程を単位取得退学し、新卒でヤフー株式会社にWebエンジニアとして入社。複数のサービスの開発に従事した後、広告部門で社外API連携や広告閲覧履歴DBの移行やSRE導入、新人教育などを経験。2021年11月にコミューンへ入社し、グローバル化プロジェクトの開発を担当している。 ※記事の内容は執筆時点の内容です。前職ではエンジニアとして幅広い経験をした後、新人の教育担当として試行錯誤していました。ヤフーの広告部門はGoogleやMetaといったグローバル企業が競合なので、淘汰されないためには世界レベルの開発の速度と品質が必要です。一方で、巨大で安定した組織が持つ長所や限界についても考えるようになりました。そんな意識の変化が社外に

はじめに こんにちは、フロントエンドエンジニアの多田です。 フロントエンド領域の勉強をはじめて 1 年が経ち、今回個人でゼロからアニプラさん(バルーンショップを経営してる会社)のバルーンサイトの検索システムを作らせていただく機会に恵まれました。 開発にかけられる総時間が 200 時間(つまり工数 1 人月ちょいぐらい、、)というだいぶヤバめなチャレンジングな時間的制約の中、要件定義・デザイン・フロントエンド・バックエンド・インフラ周りまで通して全て 1 人で開発し、完成させることができました。 はじめてfigmaでデザインしてみた アニプラさんより記事を書く許可をいただいたので、開発の裏側の話を記事にまとめます。 開発したサイトはこちら ↓ (今回の記事のメインとなる Next.js で作ったバルーンプラン一覧検索画面) 本記事の内容 (ほぼ)個人開発においての、要件定義 → デザイン →

どうも。 microCMSで分析やCRM構築を担当しているにっしーです。 常にリソースが足りないスタートアップでは、プロダクトをグロースする上で欠かせないデータ分析にはなかなか手が回らないのが実情ではないでしょうか。 弊社も例にもれず、プロダクトは伸びているものの専任のデータエンジニアも不在で本格的な分析ができていませんでしたが、ここ数ヶ月でようやく分析の基盤が整い、よりデータドリブンなアプローチができる状態になってきました。 そこで本記事では、実際に弊社の分析で大活躍しているサービスを3つご紹介します。 「分析基盤ってどう作っていけばいいかわからない・・」 「そんなリソースも時間もない・・メンテも大変そう・・」 という方が分析をはじめるきっかけになれたら幸いです。 それではまいります。 Fivetran まずおすすめしたいのがFivetranです。 https://www.fivetra

はじめに こんにちは、CX事業本部MAD事業部の森茂です。 ブログで記事を書くと欲しくなる機能のひとつにOG画像を自動生成する機能があると思います。今回はRemixを使ってOG画像を自動生成する機能を実装してみました。 RemixでmicroCMSを使ったブログサイトを構築してみた RemixでmicroCMSを使ったブログサイトを構築してみた〜プレビュー画面〜 OG画像を自動生成する方法としては、canvasを利用する方法とヘッドレスブラウザ等でスクリーンショット画像を利用する方法がよく取られますが、今回はPuppeteerを利用してスクリーンショットを撮影しその画像をOG画像として利用する方法を選択しました。 なおデプロイ環境はVercelを想定しています。VercelではRemixはAWS Lambdaの上で動作するためローカルサーバーや他の環境とは少し異なる方法が必要となります。V

Flutterのプロジェクトを新規作成したらする設定(コード自動フォーマット/Lint静的解析/Visual Debugging設定) 筆者は Flutter 歴まだ浅い初心者なのですが、その中で筆者が学んだオススメ設定を紹介します。 筆者は Flutter の Widget を試す度に Android Studio のプロジェクトの新規作成を繰り返すので、プロジェクト新規作成したら真っ先にする設定です。 特にある程度開発をしてから静的解析をするとほぼコードを修正するハメになるので、Lint 設定はマストでいれています。 コード保存時の自動フォーマットや Lint 静的解析、Visual Debugging、画像の設定は最初にしておいた方が良いので順番に解説していきます。 前提として OS は macOS で IDE は Android Studio となります。 環境macOS Big

「ジャムジャム！！Jamstack_4 [https://jamjamjamstack.connpass.com/event/233633/]」で触れた内容のリンク集です。 スライド リンク集 * 今回作成したデモサイト [https://pentaprogram.cms.am/] * microCMS をPHPで動かすサンプルコード (GitHub) [https://github.com/tr

Strapi is the leading open-source headless CMS. It’s 100% Javascript, fully customizable, support TypeScript and developer-first. It saves API development time through a beautiful admin panel anyone can use.

—— Zoom、Slack、Shopify、Twilio… リモートワーク進展とともに、国境を超えて急速な成長をみせるスタートアップ群。 彼らが実践する最新の成長戦略がある。 —— Product-Led Growth（プロダクト・レッド・グロース、PLG） 「プロダクトでプロダクトを売る」 対極にあるのが、これまで、私たちが当たり前にしてきた、 「セールスがプロダクトを売る」Sales-Led Growth（セールス・レッド・グロース、SLG）です。 近年、日本においてSaaSメトリクス、T2D3、The ModelなどのSaaS実践論が急速に浸透しましたが、そのほとんどはSLGを前提に設計されています。 日本のSaaS熱が高まる最中、北米ではPLGを実践するスタートアップが多くの事例を蓄積し、PLG手法を体系化をしていきました。 蓄積されたノウハウが、今の海外SaaSスタートアップの躍

プロダクトLPをmicroCMSでヘッドレス化しようとした 以下の記事で以前既存のプロダクトLPをヘッドレス化する計画について書きました。 今回はそのヘッドレスCMS化したLPの公開にあたり、Next.js側の設定でどのレンダリング方法を選択するのが最適なのかについての記事になります。 レンダリング方法の選定 レンダリング方法はCSR/SSR/SG/ISRの4種類がありますが、LPという特性上SEOと表示速度に焦点を当てて選定をしました。 CSR 通常のSPAです。クライアント側でデータフェッチおよびレンダリングを行います。 メリット リアルタイムにデータが反映がされる デメリット SEOに弱い(クローラによる) データが反映されていないページが最初に一瞬表示される 結果 特に理由がない限りCSRで基本はいいのかなと思っているのですが、SEOの点で引っかかるので今回は無しとしました。 SS

Next.jsとは React.jsを拡張してサーバー機能やファイルベースルーティングなどが追加されたものです。 詳細は下記URLで確認してください！ microCMSとは そもそもCMSとは microCMSの説明をする前にCMSとはContents Management Systemの頭文字を並べたもので、コンテンツを管理することができるシステムを指します。 大まかに説明すると「View」「コンテンツ管理画面」「DB」の機能を持ったシステムとなります。 「View」は記事の一覧ページなどを表示する機能。 「コンテンツ管理画面」は記事を追加したり、お知らせを追加する機能。 「DB」は記事などの情報を保持する機能。 CMSにはいくつか種類がありますが、大まかにはViewの形によって分類することができます。 View固定型 この記事を書いているZennも「View固定型」となります。他にはQ

イメージ的にはこんな感じ。 自分のサーバーになにもインストールしなくていいので、すぐに始められます。 API大好きなのでTwitterのタイムラインに microCMS を見かけた時はとっても気になりました。 せっかく頭がJavaScriptになってるので、気になってた　#microCMS さわってみよっかなー 「microCMSはJavaScriptだけで導入できるCMSです。」って、なんか便利そう。API大好き！https://t.co/StSmfWSJYl — なかみ (@misato_NN) October 14, 2019 あの、開発するわけじゃないので、仕組みとか全然わからなくても大丈夫です。 「へぇ」て感じで読んでいただければ。 「お知らせ」の更新機能が欲しい。でも自分じゃ作れない。そんな時どうする？ WEBサイトのコンテンツに「お知らせ」を設置しようと思った時、なにを思い浮

企業が自社のコーポレートサイトやオウンドメディア上で定期的な情報発信をする際に、コンテンツの運用・管理をどのような方法にするか悩みますよね。インハウスで、かつマーケターなどビジネス側のメンバーだけで、素早くコンテンツを発信できる運用方法を構築したいと考えている企業も多いのではないでしょうか。 そこで登場するのが、世界中で広く使われているCMS（コンテンツ・マネジメント・システム）です。 CMSと言えば、まずはじめに名前が上がるのが、WordPress（ワードプレス）でしょう。WordPressは2003年に誕生したオープンソース型のCMSで、世界中で圧倒的なシェアを誇っています。しかし、最近ではWordPressや既存のCMSから乗り換えて、2018年頃から注目されはじめたヘッドレスCMS（Headless CMS）を導入する企業が増えています。 そこで、今回の記事では、「ヘッドレスCMS

この記事はmicroCMS Advent Calendar 2021 23日目の記事です。 現在のWeb開発では、JavaScriptではなくTypeScriptを導入することが主流となっています。型安全な開発は、ヒューマンエラーを事前に回避できるなど開発時の負担を減らすことができます。 今回は型安全にフォーカスして、Web APIに型付できるHTTPクライアントライブラリ「Aspida」をご紹介します。microCMSで作成したAPIを例に上げてAspidaを体験してみましょう。 Aspidaのリポジトリはこちらになります。 https://github.com/aspida/aspida Aspidaを使うメリットmicroCMSのAPIを取得する単純なFetch APIのコード例は以下になります。 const response = await fetch(`${BASE_URL}/c