はてなブックマーク

hacomono CTOのまこ(@macococo)です 今年最後のテックブログでは、2022年の hacomono の開発組織を振り返りたいと思います。 ちなみに昨年の振り返りはこちら。 開発組織の変化 2021年末の段階では、正社員が15名ほどの組織でした。当時の課題は、私自身が開発も担当しており、CTO という役割以上に開発チームのリーダーとして開発の中心に居たことと、私自身が開発に多くの時間を割けられずにボトルネックになってしまっていたことでした。2022年からはチームを分け、3月のB調達を経て採用が強化されたことで、チームもメンバーも大きく成長する年になりました。 (コードを書ける時間が減ったのは悲しいですが。。) 非常にありがたいことに、今年も多数の優秀かつバリュー体現の高いメンバーにJoinいただき、プロダクト組織全体で48名と約3倍の組織に成長しました。業務委託・アルバイト

最近ポケモンメザスタにハマっている、プロダクト開発チームのまっつん(@pagu_o28)です。 プロダクトの品質向上のために、コードカバレッジもテストコード自体の質も高い状態にしていきたいです。 hacomono のバックエンドは Ruby on Rails で、テストフレームワークは rspec です。今回はバックエンド側のコードカバレッジの測定について書きます。 1. カバレッジレポートを確認できる状態にする まずは現状の確認をしました。 simplecov を導入済みでしたが、何故かちゃんと計測できていない状態でした。 なぜ計測できていないのかを調査するところからはじめました。 SimpleCovのREADME を確認してみる よく読んでみると、下記の記述はアプリケーションのコードを require する前に呼んでおくこと！と書いてありました。 require 'simplecov'

フロントエンドのテックリードのみゅーとん(@_mew_ton)です。 弊社では新しいプロジェクトを立ち上げの際に、Nuxt3を採用しています。 このプロジェクトでは、APIコール部分の実装について、以下のようなルールを設けています。 ブラウザからは、 Nuxt3 の ServerRoutes (BFFサーバ) へアクセスする BFFサーバから、APIサーバへアクセスし必要な情報を取得する BFFサーバにて、ブラウザで表示するためのデータ構造に変換する (不要な情報を削ぎ落とす) このプロジェクトでE2Eテストを導入するためBFFサーバのモックを準備しました。 今回は、Nuxt3 の ServerRoutes 機能を利用してモックサーバを作る方法を紹介します！ TL;DR Nuxt3 は API の実装に server/api 配下にソースを配置する Nuxt3 が利用しているサーバエンジン

フロントエンドのテックリードのみゅーとん(@_mew_ton)です。 弊社では新しいプロジェクトを立ち上げの際に、Nuxt3を採用することにしました。 また、従来までのプロジェクトの反省点として、 Atomic Design を考慮して実装することにしました。 ただ、Atomic Design について調査していくと、Atomic Design の考え方をそのままディレクトリに落とし込んでいくのはどうやら悪手のようで、Google サジェストからも、いくつか失敗のケースが散見されました。 そこで、Nuxt3 のディレクトリ構成にマッチするような Atomic Design の構成を考えてみたので紹介します。 Atomic Design とは Atomic Design とは、パーツ単位でUIデザインを設計する手法です。 Atomic Design 自体は 5年以上前から提唱されている設計方