booklista tech blog

https://techblog.booklista.co.jp/

booklista のエンジニアリングに関する情報を公開しています。

フィード

記事のアイキャッチ画像
コミックROLLYアプリ速度改善のためにやったことについて
booklista tech blog
自己紹介 株式会社ブックリスタのプロダクト開発部でエンジニアをしている城と申します。 コミックアプリ「コミック ROLLY(運営:株式会社ソニー・ミュージックエンタテインメント)」のアプリ開発を担当しています。 はじめに コミックROLLYアプリはFlutterを用いて開発され、リリースから1周年を迎えました。 機能やUIの充実が進む一方で、「画面表示がもう少し早ければ...」という声が増えてきました。 幸いにも、エンジニア間でこの課題が議論されており、具体的な改善案があったため迅速に対応できました。 本記事では、コミックROLLYが実施したパフォーマンス改善の具体的な内容を共有します。 アプ…
1ヶ月前
記事のアイキャッチ画像
GitHubで静的コンテンツを公開する仕組みを手軽く構築した話
booklista tech blog
はじめに こんにちは。私は株式会社ブックリスタのプロダクト開発部の姚です。 現在、コミックROLLY(運営:株式会社ソニー・ミュージックエンタテインメント)のバックエンド開発を担当しています。 この記事では、運用チームが管理する静的なLPページ、バナー画像などコンテンツを公開する仕組みの構築方法を紹介します。 背景 運用チームの役割 運用チームは、LPページやバナー画像などの静的コンテンツの公開や更新を担当しています。 これらのコンテンツを管理し、適切なタイミングでエンドユーザーに提供することが求められています。 従来の業務フロー LPページやバナー画像などのコンテンツは、Amazon S3に…
2ヶ月前
記事のアイキャッチ画像
Qdrant を商用のレコメンドシステムで使ってみた
booklista tech blog
こんにちは。株式会社ブックリスタでレコメンドシステムの開発をしている佐伯です。 今回は、電子書籍ストアのレコメンドシステムに Qdrant を導入した事例を紹介します。 ここで得られたレコメンドシステムに向いたポイントや、苦労した点についても共有します。 この記事で伝えたいこと レコメンドシステムを従来のバッチ処理型から、Qdrant を活用したリアルタイム型へ移行したこと バッチ処理でシステム負荷や費用が課題になっており、それが改善できたこと Qdrant はレコメンドに向いた機能があり、開発もしやすく、短期間で商用環境の切り替えが実現したこと Qdrant とは Qdrant(クワドラント…
4ヶ月前
記事のアイキャッチ画像
Laravel Queue を使ってデータ連携を準リアルタイム化した話
booklista tech blog
自己紹介 はじめまして。 株式会社ブックリスタ プロダクト開発部でエンジニアをしている八幡と申します。 現在は、コミックアプリ「コミック ROLLY(運営:株式会社ソニー・ミュージックエンタテインメント)」の開発・運用を担当しています。 はじめに システム間のデータ連携方式は、大きく分けるとオンラインとバッチの 2 種類があります。 方式 連携の起点 即時性 オンライン 連携元 即時 バッチ 連携先 遅延あり コミック ROLLY では、以下の観点からオンライン連携方式を採用することにしました。 今回の案件では連携元側の開発が必要であったので、連携方式は自由に決めることが可能 緊急でデータ状態…
6ヶ月前
記事のアイキャッチ画像
頻出利用パターンで攻略するIAMロール(前編)
booklista tech blog
こんにちは。プロダクト開発部でクラウドインフラエンジニアとして業務を行っている高澤です。 AWS構築・運用にてIAMロールを使用する機会は多くありますが、細かい設定・状況による違いがあり、混乱している方も多いのではないでしょうか。 実は「日常でよく使うIAMロール利用パターン」は限られており、すべての設定・詳細を熟知しなくても問題ありません。 それら「日常でよく使うIAMロール利用パターン」を紹介するにあたり、IAMロールは単体の機能ではなく、関連サービスや前提を抑えたのちに理解するのがスムーズであるため、前編・後編に記事をわけました。 まず前編である本記事では、主に「IAMロールとは何か」に…
8ヶ月前
記事のアイキャッチ画像
多言語展開のためにFigmaプラグインを開発した話
booklista tech blog
はじめに 株式会社ブックリスタのプロダクト開発部/新規事業開発チームでエンジニアをしている城と申します。 iOS向け推し活アプリOshibanaとショートマンガまとめ読みアプリヨムコマをより良くすべく日々奮闘しています。 Oshibanaについては以前の記事で紹介をしていますので、ぜひともご一読ください。 App Storeで3位になったアプリをFlutterでつくっている話 https://techblog.booklista.co.jp/entry/2022/07/11/155531 Oshibanaは日本語表示のみ対応しておりましたが、多言語展開をすべくまずは中国語での表示を実装中です。…
10ヶ月前
記事のアイキャッチ画像
Streamlitでレコメンドの定性評価アプリを作った話
booklista tech blog
はじめに MLエンジニアのmixidota2です。ブックリスタでは主に推薦システムの開発などをしています。 今回は推薦モデルの定性評価にstreamlitを使った話をします。 どのような課題をstreamlitで解決したか、またなぜstreamlitが推薦モデルの評価というユースケースに合っていたのかを紹介します。 想定読者としては、推薦システム(や機械学習システム)に関わるMLエンジニア・データサイエンティストやソフトウェアエンジニアの方々です。 推薦モデルの評価とは 機械学習モデルを本番投入する前にはオフライン評価をするのが一般的です。 推薦モデルの場合も同様で、オフライン評価により本番投…
1年前
記事のアイキャッチ画像
機能リリースに干渉しない定期的なパッケージ更新のやり方
booklista tech blog
目次 機能リリースに干渉しない定期的なパッケージ更新のやり方 目次 はじめに この記事の目的 コミックROLLYのシステムの構成について パッケージ更新の悩み Renovate導入とブランチの分岐運用で解決 Renovateの設定と運用 ①パッケージ更新検知の自動化 ②パッケージ更新用のブランチを用意する ③パッケージ更新と機能改善のリリーススケジュールを分ける パッケージ更新のリリース 機能開発のリリース まとめ はじめに はじめまして、株式会社ブックリスタのプロダクト開発部に所属している伊藤です。 弊社開発のコミックアプリ、「コミックROLLY(運営:株式会社ソニー・ミュージックエンタテイ…
1年前
記事のアイキャッチ画像
DynamoDB を使用した API ページネーションの実現
booklista tech blog
こんにちは。私は株式会社ブックリスタのプロダクト開発部の姚と申します。 現在、コミックROLLY(運営:株式会社ソニー・ミュージックエンタテインメント)のバックエンド開発を担当しています。 この記事では、DynamoDB を使用した API ページネーションの作成方法を紹介します。 はじめに なぜ DynamoDB を使用するのか DynamoDB は大量の非構造化データの処理に適しており、スケーラビリティと柔軟性に優れています。 データの性質や成長の見込みによっては、DynamoDB が最適な選択肢になることがあります。 ページネーション方式 一般的なデータベースのページネーションは、主にオ…
1年前
記事のアイキャッチ画像
iOS17の新機能「スタンバイ」を推し活アプリに導入してみた話
booklista tech blog
株式会社ブックリスタ プロダクト開発部の酒井です。 2023年9月18日にiOS17が正式リリースされました。 メッセージやAirDropが強化されたり、ウィジェット上でボタン操作などができる「インタラクティブウィジェット」が実装されるなど、いくつかの新機能が追加されました。 その中でも「スタンバイ」という新機能に着目し、弊社で開発している推し活アプリ「Oshibana」に実装してみることにしました。 過去にはiOS16の新機能「ロック画面ウィジェット」に関する記事も執筆していますので、そちらもご一読ください。 iOS16の新機能「ロック画面ウィジェット」を推し活アプリに導入してみた話 htt…
1年前
記事のアイキャッチ画像
新規プロジェクトをスクラム開発でローンチまで完了しておもうこと
booklista tech blog
株式会社ブックリスタ プロダクト開発部の藤井です。 現在、2023年8月1日から始まった「コミックROLLY(運営:株式会社ソニー・ミュージックエンタテインメント)」というサービスのスクラムマスターをしております。 今回は新サービスプロジェクトを立ち上げるにあたって、スクラム開発を採用した話をさせていただきます。 近年ソフトウェア開発の現場でスクラムを採用するケースをよく聞きます。 これから採用する方・採用してるけど暗中模索してる方の参考になればと考えています。 あと、このやり方は専門のひとにはスクラムじゃないと言われるものではあるかなと自覚もしているので、その様な場合、改善の意見を私まで指摘…
1年前
記事のアイキャッチ画像
Reader StoreでInfrastructure as Codeしてみた
booklista tech blog
こんにちは。プロダクト開発部でクラウドインフラエンジニアとして業務を行っている饂飩です。 今回は、「Reader Store(運営:株式会社ソニー・ミュージックエンタテインメント)」のOS EOL対応の一環として行った、「Infrastructure as Code(以降IaC)」についてお伝えします。 Reader StoreでInfrastructure as Codeしてみた IaC化検討の背景 IaCとは IaCを何で行うか IaC化までの流れ コード管理 設計 コーディング コードテスト インフラ構築 インフラテスト アプリケーション実装評価 システムテスト 直面した課題・反省点 B…
2年前
記事のアイキャッチ画像
Flutter開発におけるアプリ内課金で注意すべき点
booklista tech blog
自己紹介 はじめまして。株式会社ブックリスタ プロダクト開発部の横山です。 現在はモバイルアプリエンジニアとしてコミックアプリ「コミックROLLY(運営:株式会社ソニー・ミュージックエンタテインメント)」の開発を行なっています。 コミックROLLYとは 2023年8月1日にリリースされたiOS/Android向けのコミックアプリです。 フルカラーの縦読みコミック「webtoon」をはじめ、電子コミックをスマートフォンやタブレットで読むことができます。 https://rolly.jp/ はじめに ここではFlutter開発において、iOS/Androidのアプリ内課金に対応したことについて話し…
2年前
記事のアイキャッチ画像
ショートマンガ創作支援サービスに画像生成 AI(DALL·E 2)を導入した話
booklista tech blog
初めまして。 株式会社ブックリスタで、ショートマンガ創作支援サービス(YOMcoma)のフロントエンド開発を担当している前田と申します。 今回 YOMcoma に、DALL·E 2 を導入しましたので経緯も含めてお話させて頂きます。 最近はYOMComaコミック機能がリリースされました。 YOMcomaコミック機能とは、投稿したマンガを紙のコミックとして販売できる機能です。 アプリからご購入できますので、ぜひ一度見ていただけると嬉しいです。 目次 DALL·E 2 とは 導入経緯 DALL·E 2 の API について prompt について Midjourney Stable Diffusi…
2年前
記事のアイキャッチ画像
JavaのユニットテストにおけるDBテスト環境の改善
booklista tech blog
はじめまして(前回のブログを読んでくださった方は改めまして)。プロダクト開発部アプリケーションエンジニアの中村と申します。 現在、「Reader Store(運営:株式会社ソニー・ミュージックエンタテインメント)」のシステム開発を主な業務として日々取り組んでいます。 今回はReader Storeの開発中に行ったDB関連のユニットテストの改善の話をしていきます。 現状のテスト環境と問題点 Reader Storeではこれまでユニットテストで使用するDBを以下のように構築していました。 MySQLのコンテナを起動 DDLおよびテストデータのDMLが定義されたSQLファイルを読み込む 上記の処理を…
2年前
記事のアイキャッチ画像
Github Copilot を使ってみた感想
booklista tech blog
はじめまして。株式会社ブックリスタ プロダクト開発部でエンジニアをしている姚と申します。 私は一年前から個人で Github Copilot を使っていて、最近会社でも GitHub Copilot for Business を試験導入されました。 今回は、Github Copilot の概要と、会社での導入状況、先行利用者が使ってみた感想や利用時の注意点などを紹介します。 Github Copilot とは Github Copilot は、AI によるコード補完機能を提供するサービスです。 コメントからコードへの変換、コードブロック、重複コード、メソッドや関数全体の自動補完など、プログラマ…
2年前
記事のアイキャッチ画像
Next.jsのブラウザーエラーログを収集するためのNew Relic導入方法
booklista tech blog
株式会社ブックリスタ プロダクト開発部エンジニアの土屋です。 現在、「Reader Store(運営:株式会社ソニー・ミュージックエンタテインメント)」におけるフロントエンド領域の刷新に取り組んでいます。 今回、表題の通りブラウザーエラーログ収集を目的とし、Next.jsにNew Relicを導入したため、その経緯と導入方法についてまとめました。 New Relicについて 公式サイトから引用。 New Relicは、モバイルやブラウザのエンドユーザーモニタリングや、外形監視、バックエンドのアプリケーションとインフラモニタリングなど、オンプレやクラウド、コンテナからサーバレスまであらゆるシステ…
2年前
記事のアイキャッチ画像
Datadog Synthetics Testsによる外形監視の自動化について
booklista tech blog
こんにちは。プロダクト開発部QAエンジニアの岡と申します。 弊社は「auブックパス (運営:KDDI株式会社)」と包括的なパートナーシップを結び、開発を行なっています。 こちらのサイトの監視に、Datadog Synthetics Tests(ブラウザーテスト)を導入して自動化したことについてお伝えします。 サイトの監視を自動化した結果、障害の検知と解決を迅速に行うことができるようになりました。 この記事で伝えたいこと Datadog Synthetics Testsによる外形監視の自動化について この記事で伝えたいこと Datadog Synthetics Tests 導入理由 Datado…
2年前
記事のアイキャッチ画像
NFTを入館証代わりにしてみた話
booklista tech blog
自己紹介 株式会社ブックリスタでエンジニアをしている城、椛澤、尾崎と申します。 私たちは日頃の主業務が異なりますので、それぞれ簡単に紹介させていただきます。 城 :スマートフォンアプリ「YOMcoma」の開発 椛澤:電子書籍ストアのプロジェクトマネージャー 尾崎:電子書籍関連システムのプロジェクトマネージャー 活動概要 プロジェクト発足の経緯 「NFT」というワードについて、近年耳にする機会が増えています。 ブックリスタでは「エンジニアラボ」という取り組みを実施しており、 その中で「NFT」をテーマに1年間研究し、ブックリスタでの「NFT」の活用可能性を模索しました。 エンジニアラボとは 業務…
2年前
記事のアイキャッチ画像
auブックパスのストア開発におけるスクラム
booklista tech blog
株式会社ブックリスタ プロダクト開発部の開発・運用を担当している片山と申します。 今回は、弊社が包括的なパートナーシップを結び開発を行なっている「auブックパス (運営:KDDI株式会社)」のストア開発におけるスクラムについて記載させていただきます。 本記事はauブックパスのストア開発でのスクラムについての説明であり、純粋なスクラムとしては正しくない内容が含まれている可能性がありますので、ご注意ください。 また、本記事は筆者が開発者であるため、開発者が参加するイベントのみに絞り込んで記載しており、開発者が参加しないイベントについては記載しておりません。 開発に集中できる仕組み auブックパスの…
2年前
記事のアイキャッチ画像
DatadogのRUM Session Replay費用削減について
booklista tech blog
こんにちは。プロダクト開発部でクラウドインフラエンジニアとして業務を行っている高澤です。 今回は、Datadogの料金削減の一環として行った、「RUM Session Replay の費用削減」についてお伝えします。 費用削減の効果を先に書くと、RUM Session Replayの料金がほぼ0ドルになりました。 この記事で伝えたいこと DatadogのRUM Session Replay費用削減について この記事で伝えたいこと Datadog の概要 Datadog の具体的な使用例 Datadog費用削減に至る背景と見直しポイントについて RUM Session Replayという機能につ…
2年前
記事のアイキャッチ画像
YouTube Data API の Quota 上限アップ申請で注意すべき 3 つのこと
booklista tech blog
株式会社ブックリスタ プロダクト開発部の酒井です。 去年の秋頃、推し活アプリ「Oshibana」の新機能として「YouTube ウィジェット」を開発しました。 YouTube ウィジェットでは、ユーザーが登録中の YouTube チャンネル一覧から選択したチャンネルの最新動画および配信情報をウィジェット上に表示できます。 自分が推している YouTuber やゲーム実況者、芸能人、アイドルなどの新着動画や Live 配信を見逃さずに視聴できるので、非常に便利です。 ぜひとも使ってみてください。 概要 ユーザーが登録中の YouTube チャンネル一覧は 「YouTube Data API」 の…
2年前
記事のアイキャッチ画像
Reader StoreのPMのお仕事
booklista tech blog
自己紹介 はじめまして。プロダクト開発部の森本です。 現在、「Reader Store(運営:株式会社ソニー・ミュージックエンタテインメント)」のPMを担当しております。 PMと言っても、会社によって業務内容が多岐にわたるのでReader StoreのPMはこんなことしていますというのをイメージしていただければと思い記事にしました。 業務内容 最近実施した新機能開発の案件に沿ってお話しします。 課題抽出 2020年~2021年にかけて有名人気コミックがシリーズ完結を迎えました。 これまでReader Storeで上記シリーズを購入していたお客様は、シリーズの完結をきっかけにストアから離れてしま…
2年前
記事のアイキャッチ画像
コミックの類似性の算出とそのシステム構成について
booklista tech blog
はじめまして。プラットフォームソリューション部の山口です。 今回は、昨年2022年末にReader Store(運営:株式会社ソニー・ミュージックエンタテインメント)にてリリースされた「似た商品を探す」の裏側について紹介します。 (現在は、コミックのみで利用できる機能です。) 機能 まずは、「似た商品を探す」機能について簡単に紹介します。 簡単には、「○□ぽい本」、「□○みたいなテイストの本」 を見つけることができる機能と考えています。 現在は、あるコミックの要素を算出して、その要素と近しい作品たちが一覧となって表示されます。 例えば、幕末を舞台にしたバトルマンガであれば、そのマンガは「幕末」…
2年前
記事のアイキャッチ画像
新規プロダクト開発でOpenAPIを導入した話
booklista tech blog
簡単な自己紹介 株式会社ブックリスタでスマートフォンアプリエンジニアをしている城と申します。 現在YOMcomaというショートマンガアプリを作っています。 投稿者さん、読者さんに向けたサービスを提供予定ですので、リリースまでどうぞ楽しみにお待ちくださいませ。 OpenAPIとは REST APIの定義方法をまとめた仕様のことで、かつてはSwaggerという名称でした。 JSONまたはYAMLでREST API定義が可能ですが、公式のサンプルはほぼYAMLで記述されており、開発現場でもYAMLで記述していることが多い印象を受けます。 参画時の状況 YOMcomaは投稿者さん向けのWEBと読者さん…
2年前
記事のアイキャッチ画像
Aurora1からAurora3へアップグレードするときのアプリケーション対応の注意点について
booklista tech blog
はじめまして。プロダクト開発部に所属しているエンジニアの姚です。 今回は「Reader Store(運営:株式会社ソニー・ミュージックエンタテインメント)」のDBをAurora1からAurora3へアップグレードしたときにアプリケーション側が対応したことを話していきます。 Aurora3導入の背景 Amazon Aurora MySQL 1 (MySQL 5.6 互換) は 2023 年 2 月 28 日にサポート終了となります。 サポート期間が終了する前にアップグレードしないといけません。 また、Aurora MySQL 2 (MySQL 5.7 互換) は 2024 年 10 月 31 日…
2年前
記事のアイキャッチ画像
Apache JMeterの負荷シナリオ作りで苦労した話
booklista tech blog
はじめまして。プロダクト開発部アプリケーションエンジニアの中村と申します。 現在、「Reader Store(運営:株式会社ソニー・ミュージックエンタテインメント)」のシステム開発を主な業務として日々取り組んでいます。 今回はReader Storeの開発中に行った負荷試験の話をしていきます。 負荷試験実施の背景 Reader StoreではこれまでAmazon Aurora MySQL 1 (MySQL 5.6 互換)を使用しておりました。 しかし、2023 年 2 月 28 日にサポートが終了するため、Amazon Aurora MySQL 3 (MySQL 8.0 互換)へバージョンアッ…
2年前
記事のアイキャッチ画像
auブックパスのフロントエンド技術スタック
booklista tech blog
株式会社ブックリスタ プロダクト開発部の開発・運用を担当している片山と申します。 今回は、弊社が包括的なパートナーシップを結び開発を行なっている「auブックパス (運営:KDDI株式会社)」のフロントエンドの技術スタックについて記載させていただきます。 auブックパスのフロントエンドは、開発の内製化にともない、2022年11月にjQuery/CakePHPの構成から、React/Next.jsの構成にリプレイスしました。リプレイスしてから1年ほど運用を続けているため、リプレイスしてどのような効果があったかも記載させていただきます。 言語 TypeScript TypeScriptは豊富な型に関…
3年前
記事のアイキャッチ画像
Metabaseを使用したデータ民主化に取り組んでいる話
booklista tech blog
自己紹介 はじめまして。デジタルマーケティング部データ分析チームのYZrです。主にデータ分析・活用を業務としています。今回はbooklistaで全社的に実施しているデータ民主化について記していきます。 データ民主化とは 本題に入る前に、データ民主化についてご説明します。 その時々で意味合いが変わることもあるかと思いますが、ここでは「全社員が電子書籍ストアのデータを抽出し、データを基に意思決定する土壌を作って行くこと」を意味します。 まずは、データを見る・使うことが当たり前という状態になることを目指し、更には、業務のために必要なデータの内容や欲しいデータの取得方法まで議論できる組織にしたいと考え…
3年前
記事のアイキャッチ画像
Lighthouse CLI を使った Basic 認証ありの環境での性能検証
booklista tech blog
はじめまして。プロダクト開発部に所属しているエンジニアの伊藤です。 弊社で開発しているKDDIのサービス、「auブックパス(運営:KDDI株式会社)」の保守開発を担当しています。 今回はそのauブックパスでLighthouse CLIを使用した性能検証の話をしていきます。 Lighthouse CLI使用の背景 auブックパスでは、昨年Webページの内部コードを一新し、メンテナンスがしやすくなったこともあり、今年度からSEO改善にも力を入れています。 今回はその中でもFIDの改善についての話をしていきます。 FIDとは FID(First Input Delay)とは、ユーザーが最初にそのペー…
3年前