PLAY DEVELOPERS BLOG

https://developers.play.jp/

HuluやTVerなどの日本最大級の動画配信を支える株式会社PLAYが運営するテックブログです。

フィード

記事のアイキャッチ画像
社内 LT 会「てっくじゃむ」を開催しました!
はてなブックマークアイコン 1
PLAY DEVELOPERS BLOG
こんにちは、テックリードの丸山です。 最近、PLAY 社内で LT 会「てっくじゃむ」を開催しました。「てっくじゃむ」という名前は、ジャムセッション(即興で行われる演奏会)のように、普段はあまり関わりがない人たちが、ふらりと立ち寄って話をするような場であってほしい、また、パンにジャムを塗るようにエンジニアにも知識を塗り足していきたい、といった想いを込めて運営メンバーで考えて決めたものです。 ▼ 社内のデザイナーさんにロゴも用意していただきました! 今回は私を含め 6 名のメンバーが登壇を行いました。 登壇者 発表テーマ 丸山 PLAY CLOUD に Vite を導入して開発効率を改善した話 …
2日前
記事のアイキャッチ画像
Path Hierarchy を活用した Elasticsearch におけるファイルシステム検索の実現
PLAY DEVELOPERS BLOG
こんにちは、メディアサプライチェーン技術部開発第1グループの渕です。 任意に指定したパスの直下にあるフォルダ・ファイルを取得するファイルシステム検索をElasticsearchで実現するために、Path hierarchyというトークナイザーを使用してみました。 Path hierarchyとは Path hierarchyによる検索 インデックスへの設定 Path hierarchyを使用した検索 Path hierarchyを使用しない方法 Path hierarchyと階層数によるファイルシステム検索の実現 階層数の追加 指定したフォルダ直下にあるフォルダ・ファイルの取得 最後に Pat…
13日前
記事のアイキャッチ画像
UI テストツールの XCUITest と Maestro を実際の iOS アプリで比較してみた
PLAY DEVELOPERS BLOG
こんにちは、iOSアプリの開発を担当しているOTTサービス技術部開発第3Gの鈴木です。 皆様、UIテストは実施しておりますでしょうか。 UIテストを実施する場面としては、リグレッションテストが多いかと思います。 そんなUIテストが自動化されているかというと、まだまだ人力で頑張っているような状況が多いかと思います。 自動化できるテストはどんどん自動化していきたいですね。 ということで、今回はiOSアプリ開発におけるUIテスト自動化ツールとして候補に上がりがちな、「XCUITest」と、「Maestro」の二つを比較します。 本記事が皆様のUIテストの導入、及びその自動化の手助けになれば幸いです。…
1ヶ月前
記事のアイキャッチ画像
スプレッドシートと Jira を連携し課題リストを作成する
PLAY DEVELOPERS BLOG
こんにちは、Androidアプリの開発を担当しているソリューション技術部の呉です。 システムやアプリ開発にあたっては、タスクや不具合の管理が非常に重要です。それらを一括管理できるJiraという管理システムがあるおかげで、開発がすごくスムーズに進められるケースもたくさんあります。 自分も現在まさにJiraが使われているプロジェクトに参加しています。しかし私の場合、Jiraプロジェクトがお客様によって管理されているので、自分達の都合では自由にカスタマイズできません。 例えば下記のようなバックログリストがあります。 タスク名、ステータス、担当者が表示されていますが、開発側として対応OS、詳細対応状況…
2ヶ月前
記事のアイキャッチ画像
AWS DMS を使って Aurora MySQL の無停止エンジン更新を試してみた
PLAY DEVELOPERS BLOG
こんにちは、SaaSプロダクト開発部の滝波です。弊社プロダクト「PLAY VIDEO STORES」のエンジニアを担当しています。 昨年末、AWSから重要な通知が届きました。 Amazon Aurora MySQL は、2024 年 1 月 15 日にバージョン 3.01 と 3.02 (MySQL 8.0.23 互換) を廃止する予定です。 お客様の AP-NORTHEAST-1 リージョンでは前述した Aurora MySQL マイナーバージョンで実行されている Aurora MySQL クラスターが 1 つ以上あるため、3 か月前にお知らせします。 多くの場合、DBエンジンの更新にはイン…
2ヶ月前
記事のアイキャッチ画像
初心者必見! AWS の基礎をゲーム感覚で身につけられる AWS Cloud Quest のご紹介
PLAY DEVELOPERS BLOG
初めまして 、ソリューション技術部の中西と申します。 エンジニアになり初めてAWSに触れることになった時、どこから勉強をすれば良いか分からない、実際に参考記事通りに操作をしてみようと思っても、注意として「時間単位でお金がかかります!終わったら消しましょう!」などの文章をよく見かけることになり、初心者にとってはなかなか気軽に手を出すことが難しいですよね。 そんな悩みを解決するのが今回ご紹介する、Cloud Questでした。 AWS Cloud Questとは? 事前準備 Builderアカウントの作成 教材の登録 実際にやってみよう 1. 学習 2. 計画 3. 実践 4. DIY 報告 まと…
3ヶ月前
記事のアイキャッチ画像
初心者が知るべき CORS の基本
PLAY DEVELOPERS BLOG
こんにちは 、ソリューション技術部の木下です。 ベンチプレス100kgは上げられるものの105kgが一向に上げられず、減量中のせいだということにして、やり過ごしている日々です。きっと増量し始めたら上げられると信じています。 さて、CORSはWeb開発を行っている方はほとんどの方が遭遇したことがあるかと思いますが、初見だとなかなか対応方法がわからない、あるいは設定方法だけはわかったけどなぜ必要なのか、何をしているのかわからないという新人の方も多いのではないでしょうか。 そんな方にお送りする「CORS入門:初心者が知るべき基本について」について、お送りします。 CORS (Cross-Origin…
3ヶ月前
記事のアイキャッチ画像
大規模案件におけるReact Nativeでのスタイリング手法
PLAY DEVELOPERS BLOG
最近新しい趣味を始めようと、前々から欲しかった車を買いました。 みなさんこんにちは、ソリューション技術部の隈本(クマモト)です。 今回は弊社でも新しい試みであるReact Nativeのお話です。 React Nativeを触ったことあるみなさんは、その中でもスタイリングについてどのようにされていますか? サンプルコードによくあるようにコンポーネント内にスタイルを記述しますか?それともスタイル用のファイルを用意しますか?それともウルトラCな方法で記述してますか? もしウルトラCをご存知の方がいれば教えてください。 今回私がReact Nativeの案件を進めるにあたり、実際に対応したスタイリン…
3ヶ月前
記事のアイキャッチ画像
YouTube, X, Instagram で OAuth 2.0 を実装してみた
PLAY DEVELOPERS BLOG
こんにちは。プラットフォーム技術部第2グループの冷牟田です。 今回は、自社プロダクト開発を進める中でOAuth 2.0というものに触れました。いくつか実際に処理を実装したため、簡単にご紹介させていただきます。 OAuth 2.0について OAuthとは OAuth 1.0とOAuth 2.0の違い OAuth 2.0の認可フロー プラットフォームによるOAuth 2.0での実装の違い YouTubeのOAuth 2.0 事前準備 実装 動作確認 X(旧Twitter)のOAuth 2.0 事前準備 実装 動作確認 注意点 InstagramのOAuth 2.0 事前準備 実装 動作確認 注意点…
4ヶ月前
記事のアイキャッチ画像
字幕つきの動画配信を行おう
PLAY DEVELOPERS BLOG
こんにちは。クラウド推進技術部の牧田です。 今回は、HLS での VOD 配信において字幕のつけ方をご紹介したいと思います。 はじめに 動画に字幕をつけるには 1. 字幕ファイルを用意する。 2. 字幕のメディアプレイリストに字幕ファイルを記述する。 3. マルチバリアントプレイリストに字幕のメディアプレイリストを記述する。 VTT ファイルの内容 VTT ファイルのサンプル VTT ファイル作成のルール おわりに はじめに 字幕には大きく、オープンキャプションとクローズドキャプションがあります。 オープンキャプションは焼き込み字幕とも呼ばれ、動画自体に字幕を入れる方式であり、常に字幕が動画に…
5ヶ月前
記事のアイキャッチ画像
AndroidTV・FireTV でアクティブ率を高めるために対応したい機能のご紹介
PLAY DEVELOPERS BLOG
こんにちは、Androidアプリの開発を担当しているソリューション技術部の宮本です。 AndroidTV・FireTVのアプリは、スマホに比べると対応している数が少なくどういった機能に対応できるかあまり認知されていないと感じる場面があったので、一部機能を紹介させていただきます。 AndroidTV Recommendations チャンネルの作成 プログラムの追加 Watch Next プログラムの追加 FireTV リニアTV ホームでのコンテンツ表示 番組表への連携 リニアTV上での再生 VSK(Video Skills Kit) AndroidTV Recommendations チャン…
5ヶ月前
記事のアイキャッチ画像
多言語翻訳サービスの WOVN について調べてみた
PLAY DEVELOPERS BLOG
こんにちは、SaaSプロダクト開発部第1開発グループの平原です。 最近テイルズオブヴェスペリアをプレイしましたが、なんと開始時に日本語/英語が選べるんです。そんな15年以上前のゲームに思いを馳せつつ、今回は多言語翻訳について話します。 今回は開発の一環で調査した多言語翻訳サービス、中でも個人的に一番公式ドキュメントが丁寧で良かったWOVNについて紹介します。 多言語翻訳サービスとは WOVNの基本情報 対応言語 対応ブラウザ 利用上限について 言語の切り替え方法 WOVNでの翻訳導入形式 スクリプト方式 ライブラリ方式 プロキシ方式 終わりに 多言語翻訳サービスとは サイト上のテキストやコンテ…
5ヶ月前
記事のアイキャッチ画像
AWS CDK を使ってみよう
PLAY DEVELOPERS BLOG
こんにちは、SaaSプロダクト開発部の村山です。 業務でAWS CDKを使って環境構築を行う機会がありましたので 、今回はAWS CDKの紹介をしていきます。 AWS CDKとは? AWS CDKの構造 アプリケーション スタック コンストラクト やってみる 準備 VPCの作成 Lambdaの作成 最後に AWS CDKとは? TypeScript、JavaScript、Python、Java、C#/.Net、Goのいずれかのプログラミング言語を使用してAWSのインフラストラクチャを定義し、AWSにプロビジョニングできるフレームワークです。 記述したコードはCloudFormationのリソー…
5ヶ月前
記事のアイキャッチ画像
ユーザーフレンドリーなシェル「fish」に乗り換えてみた
PLAY DEVELOPERS BLOG
こんにちは、プラットフォーム技術部第一グループのワンです。 コマンドラインの世界って、ちょっと取っ付きにくいって思っていませんか?黒い画面にずらっと並ぶ白い文字… なんだか難しそうに見えますよね。でも、fishは、そんなコマンドラインに対するイメージを変えてくれるかもしれません。 fishは、「friendly interactive shell」の略です。つまり、他のシェルと比較すると、使いやすくて、対話的に操作できるのが特徴なんです。 例えば、コマンドを入力していくと、候補を予測して表示してくれたり、過去の履歴を参考に見せてくれたりします。これなら、タイピングが減るし、コマンドを覚えるのも…
6ヶ月前
記事のアイキャッチ画像
Lambdaから外部サービスにリクエストする際のIPアドレスを固定した話
PLAY DEVELOPERS BLOG
みなさまはじめまして。ソリューション技術部の岡田です。 年始に今年やりたいことを100個書き出したのですが、2ヶ月ほど過ぎた現在まだ6つしか達成できていない状況に若干の焦りを感じながら過ごしている今日この頃です。 さて今回はある開発にてAWS LambdaでAPIサーバーを構築したのですが、APIサーバーから外部サービスにリクエストする際に、IPアドレスの制限がかかっているためIPアドレスを固定化する必要があったので、その対応方法についてとそれをCloudFormationで対応する方法について紹介します。 CloudFormationではなくAWSのコンソール画面から対応したいという方にもど…
6ヶ月前
記事のアイキャッチ画像
ファイアウォール機器のリプレース時に通信断が発生するケースについて
PLAY DEVELOPERS BLOG
こんにちは、ソリューション技術部の平良です。 弊社で利用しているファイアウォール製品(以下、FW)にてEOSL*1の発表があり、機器自体のリプレースを行うべく事前検証を行った際に発生した事象についてご紹介します。 スイッチ*2などネットワーク機器を触る上で昔からよく耳にするARP*3問題ですが、今なお健在でしたので簡単に発生状況や原因、対応方法などご紹介していきます。 機器切替の流れ 切替直後に通信断が発生 原因の切り分け 判明した原因 対策 機器切替の流れ 新FWの設定は現行踏襲とし、同一IP、同一設定で構築し並列に配置しておきます。 切替作業は旧FWから新FWへLANケーブルの物理的な差替…
6ヶ月前
記事のアイキャッチ画像
Rubocop のコーディング規約をもとに読みやすいコードについて考えた
PLAY DEVELOPERS BLOG
こんにちは。ソリューション技術部OTTサービスソリューション統括部LOGICAプロダクトグループの田上です。 最近、チームリーダー的な立場でソースコードレビューすることも多く、また不具合発生などにより過去の処理を読み解くことがよくあります。 その際、複雑でわかりにくいコードなどがあると処理を追うのに時間がかかり、また複雑なコードほどバグが発生する確率が高いです。 現在、私が使用しているRubyにはRubocopというコーディング規約を設定してチェックするツールがあります。 github.com Rubocopを導入するとコーディング規約で制限するので、全体的に書き方が統一され第三者が見たとき読…
6ヶ月前
記事のアイキャッチ画像
Rails 4 から Rails 7 にバージョンアップした話
PLAY DEVELOPERS BLOG
こんにちは。ソリューション技術部プロフェッショナルサービス第2グループの渡邉です。今回はRuby, Railsのバージョンアップにあたり実施したことをまとめて紹介します。 実はこの会社に入る前に独学でRailsのWebアプリを作ったことがあり(6年以上前です)、もう一度開発し直してみようと思ったことがありました。その時のRailsのバージョンが4.2.8ですが、一方で、現在使用している端末がAppleシリコンのMacだったため当時のRails 4に適合したgemがインストールできず、結果起動できなかったため思い切ってRailsのバージョンを7に上げることにしました。その過程が結構な手間だったこ…
7ヶ月前
記事のアイキャッチ画像
署名付きURLを使用したAmazon S3へのマルチパートアップロードを実装してみた
PLAY DEVELOPERS BLOG
初めまして、弊社のプロダクト「KRONOS DRIVE」開発メンバーの大野です。 2024年に突入しましたが、年末年始はどのように過ごされましたでしょうか? 私はというと、カリフォルニアのディズニーランドで年越しをしてきました。初めての年越しディズニーでとても楽しかったのですが、夜寒すぎたのと疲労でニューイヤーのイベントが終わったらすぐにホテルへ戻りました笑 さて、以前「KRONOS DRIVE」の機能開発において、AWS SDKをフロント側で使用せず、APIで発行した署名付きURLでブラウザからS3へ直接アップロードする機能を実装したため、その方法を紹介させていただきます。 Amazon S…
7ヶ月前
記事のアイキャッチ画像
Snowflake のクラスタリングキーを設定したらデータの集計が爆速になった話
PLAY DEVELOPERS BLOG
こんにちは、SaaS プロダクト開発部の池田です。 主に視聴動向データの分析を行うサービスの開発・運用を担当しております。 視聴動向データの分析基盤で採用している Snowflake において、クラスタリングキーの設定をすることで、クエリの応答速度が爆速になった話を紹介したいと思います。 もし、Snowflake をご利用中で、クラスタリングキーの設定をした覚えがない人は必見です!この記事を読んだ後は、クラスタリングキーを設定したくてウズウズしていると思います(笑) そもそも Snowflake の導入をご検討中の方は、以前丸山が紹介した記事がとても役立つと思うので参考にしてください。 dev…
7ヶ月前
記事のアイキャッチ画像
VS Code のおすすめの拡張機能をご紹介 & 拡張機能を自作してみた
PLAY DEVELOPERS BLOG
こんにちは、SaaSプロダクト開発部第1開発グループの陳です。 今回は開発でよく使うコードエディターVS Codeの拡張機能&便利な使い方について、紹介していきます。 おすすめの拡張機能 Turbo Console Log Pretty TypeScript Errors Search In Browser Error Lens CodeSnap 拡張機能を作成してみます プロジェクト作成 デバッグ スニペットを作成してみます スニペットファイルの作成 スニペットを作成 最後に おすすめの拡張機能 Turbo Console Log 開発中にconsole.log()をよく使う人におすすめです…
8ヶ月前
記事のアイキャッチ画像
Apple シリコンの macOS で “Docker Desktop vs OrbStack” を検証してみた
PLAY DEVELOPERS BLOG
こんにちは。今年の4月に入社したプラットフォーム技術部の杉森です。データ分析基盤の構築を行っております。 弊社のとあるアプリケーションの開発環境として Docker を使用しているのですが、 Apple シリコンの macOS での開発環境の立ち上げに多くの時間がかかっており、その問題を改善できないか調査したのでご紹介します。 問題 原因 解決策 “Rosetta 2 の使用” Docker Desktop “Rosetta for Linux” OrbStack 試してみる Docker Desktop “Rosetta for Linux” OrbStack 結論 “Docker Desk…
8ヶ月前
記事のアイキャッチ画像
映像と音響の魅力を高める Dolby Vision・Dolby Atmos の基礎と動画配信での活用
PLAY DEVELOPERS BLOG
こんにちは、プラットフォーム技術部第1グループの川端です。 突然ですが、みなさん、高画質な映像と迫力のある立体音響に魅了されますよね?これらを実現する技術に、ドルビー・ラボラトリーズ(以降Dolby社)が開発したDolby Vision・Dolby Atmosがあります。昨今Netflixといった大手ストリーミングサイトのオリジナルコンテンツにおいてデファクトに近い形で採用されております。*1 配信を支える当社から、今回はDolby Vision・Dolby Atmosについてご紹介したいと思います。Dolby VisionはHDR技術に準拠した技術になりますので、HDRについてもご紹介します…
9ヶ月前
記事のアイキャッチ画像
Figmaでスライド資料を作成して良かった話
PLAY DEVELOPERS BLOG
ソリューション技術部デザイングループの池田です。 強火の犬派 兼 中火の猫派です。現在は猫を飼ってます。 みなさん、スライド資料を作成した経験はありますか? 使うツールはPowerPointですかね。 便利ですよねパワポ。 残念ながら今回はパワポの話ではないです。 弊社の採用ピッチ資料を作りたいな〜、という依頼が人事部から舞い込んできたのですが、普段使い慣れているFigmaでスライド資料作りたいな〜〜と思って作ったらFigmaで良かったなぁ〜〜!と思った話をします。 どうしてFigma? ローカル作業だと複数人でのやりとりが億劫だった Figmaはリアルタイムで同じ画面を閲覧・編集できる! コ…
9ヶ月前
記事のアイキャッチ画像
読みやすいコード、メンテナンス性の良いコードを書こう
PLAY DEVELOPERS BLOG
エンジニアの松永と申します。 私は開発リーダー的な役回りが多いので、コードレビューをする機会が多いです。いろんなプロジェクトを経験して実体験として感じるのは、煩雑で分かりにくい設計・コードはやっぱりバグが多いです。ですので、分かりやすいコード、メンテナンスしやすいコードとはどんなものかについて関心があります。 私の好みの要素もありますが、私が心がけていることを書き連ねます。 なお、インデントをTabにするかSpaceにするかや、{} の位置はどこにすべきかなどの狭義のコーディングスタイルには触れません。 似た処理のコピペはできるだけ避ける 概要から書く ひとつのことをちゃんとやるようにパーツ化…
9ヶ月前
記事のアイキャッチ画像
fastlaneを用いたAndroidアプリビルド〜配布までの自動化
PLAY DEVELOPERS BLOG
はじめまして、ソリューション技術部でAndroidアプリ開発をしている古川です。 Android開発歴2年とまだまだ若輩者ではありますがよろしくお願いします。 アプリ開発をしているとお客様先でアプリのリリースがしたいという理由やテスターへの配布などで作成したAPKファイルをどこかに格納してお渡しする機会がよくあります。 前回はiOSでfastlaneというツールを用いたアプリビルドの自動化をご紹介しましたが developers.play.jp 今回はAndroidアプリのビルドからAPKファイルの配布までをコマンド一つで行う方法を紹介します。 また、今回もAPKの配布はFirebaseのAp…
9ヶ月前
記事のアイキャッチ画像
Mockoonを使ってローカル環境で手軽にMock APIサーバを立ち上げる
PLAY DEVELOPERS BLOG
こんにちは、ソリューション技術部 OTTサービスソリューション統括部 LOGICAプロダクトグループの小川です。 今回はローカル環境で簡単にMock APIサーバを立ち上げることができるアプリケーションをご紹介します。 外部システムと連携する機能を開発する際に検証環境のAPIが叩けない場合にローカル環境でモックサーバを簡単に構築できるツールがないかと探していた際にMockoonと出会いました。 Mockoonを使用するとリクエストとレスポンスの詳細な設定を行うことができます。リクエストヘッダー、クエリパラメータ、BodyデータなどをGUI上で簡単に設定することができ、APIの振る舞いをカスタマ…
10ヶ月前
記事のアイキャッチ画像
ESLintを導入して独自ルールを作成してみた
PLAY DEVELOPERS BLOG
こんにちは。ソリューション事業部の樋口です。 最近私が担当している案件に、ESLintを導入する機会があったのでその際の手順を記載します。 同じ様な境遇の方の助けになれば幸いです。 ESLintとは何か? なぜESLintを導入したのか? 導入手順 インストール 設定ファイルの作成 ルールの選定 独自ルール ルールの作成 テストの作成 まとめ 参考 ESLintとは何か? JavaScript/TypeScriptのための静的検証ツールです。 プラグインで設定したルールに従って、ソースコードの問題点を指摘、場合によっては修正まで行ってくれます。 バグの発見と共に、プロジェクト内のコーディングル…
10ヶ月前
記事のアイキャッチ画像
GitHub Actionsをオートスケールするself-hosted runnersで動かしたくて
PLAY DEVELOPERS BLOG
こんにちは、SaaSプロダクト開発部の松本です。 弊社プロダクト「PLAY VIDEO STORES」のエンジニアを担当しています。 最近は朝の布団との格闘が始まり、冬の幕開けを沸々と感じています。 寒い冬はMacBook Proで暖を取りましょう(?) さて、本題に入ります。 GitHub Actionsを導入してプロダクトの開発運用を負荷軽減、効率化したい!! と考えてから数ヶ月が経ち...ついに今年に入って実現することができました。 そこで今回は、GitHub Actionsの導入にあたり構築したself-hosted runnersについてご紹介します。 背景(もっと詳しく) GitH…
10ヶ月前
記事のアイキャッチ画像
AWS Amplify で Next.js 14 アプリを SSG(静的サイト)としてホスティングする [2023年11月版]
PLAY DEVELOPERS BLOG
こんにちは、SaaS プロダクト開発部テックリードの丸山です。 2023 年 10 月 26 日に、Next.js の最新バージョンである Next.js 14 がリリースされました。 nextjs.org そこで早速、Next.js 14 で作ったウェブサイトを AWS Amplify でホスティングしようとしたところ、想定外に苦戦しましたので、備忘録がてらブログの記事に残しておこうと思います。 なお、本記事は 2023 年 11 月 2 日時点での AWS Amplify の仕様に基づいて執筆しております。今後の AWS Amplify のアップデート等により、状況は変わる可能性が十分にあ…
10ヶ月前