Next.js Conf 2022で最も感動したライブラリ、vercel/satoriについて紹介させてください。

はじめまして。コミューンでサーバーサイドエンジニアとして働いています、あのちっくと申します。

突然ですが皆様は昨年 10 月に開催されたNext.js Conf 2022はご覧になられましたでしょうか。

Next.js Conf は Next.js の開発・メンテナンスを行っている Vercel 社が主催する、Next.js とその周辺技術に関するカンファレンスです。

コミューンでもメインプロダクト commmune の Web フロントフレームワークとして Next.js を採用しており、私個人としてもとても興味深くオンラインから視聴をしていました。

特に話題になったのは、React Server Components をサポートしたルーティング・レイアウトシステム"app directory"などの新機能を新たに追加したNext.js 13と、"Webpack の後継"を謳う Rust ベースの高速バンドルツールTurbopackなどでしょうか。

その中で私が最も興味を唆られたリリースは、HTML/CSS から SVG 画像を生成する機能、Vercel OG Image Generationでした。

今回は、この"Vercel OG Image Generation"を実現するために Vercel が新たに開発した技術、vercel/satori について紹介したいと思います。

ぜひ最後までお読みいただければ幸いです。 どうぞよろしくお願いします。

続きを読む

月間数百万通のメール送信サービスをIPウォームアップしつつ切り替えたら到達率が向上した話

月間数百万通のメール送信サービスをIPウォームアップしつつ切り替えたら到達率が向上した話

はじめに

こんにちは。コミューンでスクラムマスターをしているまつむらと申します。

今回はコミューンで私が取り組んだ技術課題のなかから「メール送信システムのリプレース」について記載させていただこうと思います。

続きを読む

社内向けテスト設計プロセスを作ってみた

QAの須賀(@kawabeaver)です。 先日QA Test Talk Vol.2で「自分たちのテスト設計プロセスを作ろう」というタイトルで、テスト設計プロセスを作る思考過程について発表させていただきました。(発表資料はこちら) 外部イベントで発表するのは初だったので緊張して「出社推奨日」がうまく言えませんでしたが、楽しい時間を過ごせました。

さて、本記事では、上記発表で少し紹介したテスト設計プロセスについて説明したいと思います。

テスト設計のやり方に悩んでいる方、他の人のテスト設計を教える立場の方などのお役になれば幸いです。

続きを読む

プロダクトスペシャリストに転向して半年が経ちました

初めに

こんにちは。コミューンプロダクトサポートチームにおいてプロダクトスペシャリストとして活動している栗山と申します。

元々EMとしてコミューン開発に携わっていましたが、紆余曲折を経て現在のポジションに転向しまして、既に半年ほど経ちました(ここら辺の経緯は機会があればどこかで)。 そこで本エントリでは過去のプロダクトスペシャリストとしての活動を振り返りつつ、「そもそもコミューンのプロダクトスペシャリストって何をやってる人なの?」という皆さんの疑問を解消できればと思います。

  • 初めに
  • What is プロダクトスペシャリスト?
  • プロダクトスペシャリストが必要になった背景
  • どんなことをしているか
    • 問い合わせ対応
    • SSO導入におけるサポート
    • アプリケーションレイヤ以外の機能に関するフィジビリティ調査
    • プロダクトへのFB
  • ぶっちゃけプロダクトスペシャリスト楽しい?
  • どういう人にオススメ?
  • まとめ
  • おわりに
続きを読む

問題を早期発見して開発体験を上げる試み

はじめに

こんにちは。2022 年 7 月に入社したエンジニアの浅見(@astatsuya1)です。
今回は 20%ルールで実施した問題の早期発見をして開発体験を上げるために行ったことを紹介します。

  • はじめに
  • コミューンの 20%ルールとは
  • 何をやるか考えた
    • commmune の開発における問題と課題
      • 問題:問題の発覚が遅くなると多くの人を巻き込んでしまう
      • 課題:出来るだけローカル環境で問題を検知したい
  • 施策 ①:検知する項目を増やす
    • リントでチェックする項目を増やす
      • ローカル開発のみでしか使用しないconsole.logに警告を出す
      • ローカル開発でのみしか使用しないtest.only, test.skipに警告を出す
    • 英語のスペルチェックをする
  • 施策 ②:ローカルでも出来るだけ早く検知出来るようにする
    • コードを書く時のチェック
      • Visual Studio Code の拡張を共有
    • 書いたコードを保存する時のチェック
      • 差分があったファイルに関連するテストを実行
    • コミットをする時のチェック
      • リント、スペルチェックを実行
    • push するときのチェック
      • 型チェック、テストを実行
    • 問題があってもコミットやプッシュしたいときはどうする?
  • 導入後の変化と今後の展望
  • まとめ
  • おわりに
続きを読む