株式会社ずんだもん技術室AI放送局 podcast 20241029
内容紹介
AIやテクノロジーに関する記事を紹介 ドメインモデリングで全システムの設計をゼロからやり直す。リアーキテクチャに挑む2年間の全貌【モノタロウCTO普川】 レバテックラボ（レバテックLAB）、Flux + Helm における即時ロールバック、【図解ハンズオン】たった60分でReactを使った音楽プレイヤーを作ろう！【TypeScript/Shadcn/TailwindCSS】
出演者
関連リンク
モノタロウ社は、20年以上に渡り運用してきたレガシーシステムの限界を迎え、2022年から大規模なリアーキテクチャに着手しました。 パッケージシステム導入の失敗を経て、ドメインモデリングに基づいた内製開発による抜本的なシステム刷新を選択。マイクロサービス化と業務ドメインの分割統治を目指し、ドメイン駆動設計を参考にしながら、地道な取り組みを2年間継続しています。
リアーキテクチャ開始前には、経営層との丁寧な合意形成が最優先事項でした。 長期的な投資と、新しい開発手法への理解を深めるため、エンジニアへの綿密な説明と「テックプリンシプル」の設定を行いました。 さらに、逆コンウェイ戦略に基づき、理想アーキテクチャに合わせた組織改編を2年かけて実施。CTO直下の「CTOオフィス」と既存業務との兼務チームを編成し、情報共有とスムーズな開発体制構築を目指しました。
リアーキテクチャの具体的なプロセスは、まず「イベントストーミング」による業務フローの明確化から始まりました。関係者全員参加のもと、付箋を用いたワークショップを実施し、業務全体の流れを把握する「ビッグピクチャー」を作成。その後、各業務領域を詳細に分析し、「プロセスモデル」とドメイン境界を可視化する「コンテキストマップ」を作成しました。 このドメインモデリングを経て、ようやくソフトウェア設計に着手。1つのドメインモデルの完成には3～4ヶ月を要します。
ドメインモデリングでは、「在庫ドメイン」のように複雑な領域は徹底的に分析する一方、「受注ドメイン」のように過去の事例が豊富な領域はデータ分析を簡略化するなど、コストと精度のバランスを考慮しながら進めています。 しかし、どのプロセスを簡略化できるかの判断は非常に難しく、経験と状況判断に基づいた柔軟な対応が求められます。
現在もリアーキテクチャは進行中で、終わりは見えていません。 メンバーからは不安の声も上がっていますが、CTOは技術スタック刷新だけでは不十分であり、業務構造の根本的な見直しこそが競争優位性を生むと確信し、取り組みを継続しています。 長期間にわたる困難なプロジェクトですが、モノタロウ社の事業成長に大きく貢献する取り組みとして、関係者全員で取り組んでいる最中です。
引用元: https://levtech.jp/media/article/interview/detail_545/
クックパッドのレシピサービスグローバル版統合に伴い、日本版のECS環境からグローバル版のEKS環境への移行が発生しました。グローバル版ではFluxとHelmを用いたGitOpsによる自動デプロイを採用していますが、従来のリバートによるロールバックでは、CIテストのオーバーヘッドや承認プロセスにより、障害発生時の迅速な復旧が困難でした。具体的には、ロールバックに40分程度要するケースもあったため、即時ロールバックの仕組み構築が急務となりました。
既存のGitOpsフローでは、イメージ更新はFluxのImage Update Automation機能が検知し、マニフェストリポジトリへの更新、KustomizeとHelm Controllerによるクラスタへの反映という流れです。リバートによるロールバックはGitOpsフローに則っていますが、時間がかかりすぎます。そこで、Helm Controllerによるhelm upgradeを待たずにロールバックを実行する独自の方法を導入しました。
即時ロールバックを実現するため、Helmのリビジョン管理機能を利用したhelm rollbackコマンドを採用しました。これは、HelmReleaseの同期を一時的に停止し、helm rollbackコマンドで直接Helmリリースを以前のリビジョンに復元する手法です。これにより、helm upgradeの完了を待たずにロールバックを開始でき、数分以上かかっていた復旧時間を大幅に短縮しました。
しかし、helm rollbackコマンドの実行には特別な権限が必要であり、開発者へ権限を与えるのは適切ではありません。そこで、SlackのChatOpsコマンド/laboty global-web-platform rollback {アプリケーション名} {ロールバック先のコミットハッシュ}を実装しました。このコマンドは、開発者が指定したコミットハッシュから対応するHelmリリースのリビジョンを自動的に特定し、FluxのHelmReleaseとAlertの同期を一時停止した後、helm rollbackを実行します。
さらに、ロールバック後の自動デプロイ再開のため、 /laboty global-web-platform recover-from-rollback {アプリケーション名} {回復したコミットハッシュ}コマンドも実装しました。このコマンドは、回復したコミットハッシュに対応するイメージがHelmReleaseに反映されていることを確認した後、FluxのHelmReleaseとAlertの同期を再開します。
これらのChatOpsコマンドにより、開発者は簡潔なコマンドで即時ロールバックと復旧を実行できるようになり、障害発生時の迅速な対応とサービス継続性が向上しました。 この仕組みは、障害対応の迅速化だけでなく、開発における迅速なイテレーションにも貢献すると期待されます。
引用元: https://techlife.cookpad.com/entry/2024/10/28/204340
この記事は、React、TypeScript、Shadcn、Tailwind CSSを使って、約60分で音楽プレイヤーを作成するハンズオントレーニングの概要を説明しています。React初心者で、HTMLの経験があり、JavaScriptとTypeScriptを学びたいエンジニアを対象としています。
ハンズオンでは、まずNode.jsとViteを用いたReactプロジェクトの構築方法を説明します。Viteは高速な次世代ビルドツールです。 npm create viteコマンドを使い、ReactとTypeScriptを選択してプロジェクトを作成します。その後、npm iで依存パッケージをインストールし、npm run devで開発サーバーを起動します。
次に、UIコンポーネントライブラリであるShadcnと、その基盤となるCSSフレームワークTailwind CSSを導入します。npm installコマンドで必要なパッケージをインストールし、tailwind.config.jsとsrc/index.cssを編集してTailwind CSSを設定します。 src/App.tsxを修正することで、Tailwind CSSが正しく動作することを確認します。
記事では、具体的なコード例と実行結果のスクリーンショットが掲載されており、環境構築からTailwind CSSの導入、動作確認までをステップバイステップで解説しています。 ただし、音楽プレイヤーの具体的な実装方法や機能に関する詳細は、本文からは省略されています。 本ハンズオンは、React環境構築とShadcn、Tailwind CSSの導入を理解することを主眼としています。 音楽プレイヤーの実装方法は、別途動画教材で詳細に解説されているようです。 本記事は、React環境構築と主要ライブラリの導入手順を理解するための入門として最適です。
引用元: https://qiita.com/Sicut_study/items/a27fb53468e14216d6fb
（株式会社ずんだもんは架空の登場組織です）