PR TIMES開発本部2023年振り返り

  • URLをコピーしました!

PR TIMESでCTOをやっている金子 (@catatsuy) です。

私がCTOとして入社してからもうすぐ3年になります。過去2年で開発が進むようになり、組織として大きめのリリースもできるようになってきました。

年末にはエディター・プレスリリースページのリニューアルという会社にとって重要な一歩を踏み出すことができています。

まだ通過点ではありますが、年末なので今年やったことを振り返ってみようと思います。ちなみに過去の振り返りは以下の記事です。

PR TIMES開発本部2022年振り返り

挑戦する組織にするためにCTOになってからやったこと

目次

Findy Team+振り返り

早速今年の移動平均推移のグラフを貼ります。

プルリク作成数が増えて、マージにかかる時間も前後はあるものの、減少傾向にあります。

去年もFindy Team+ Award 2022を受賞しましたが、今年もMedium Divisionで受賞することができました。今後も開発生産性を高めていき、更に様々な機能を提供できるようにしていこうと考えています。

エディター・プレスリリースページリニューアルプロジェクト

エディターのreplaceが完了し、旧エディターの廃止が完了したことでエディターの機能変更が可能になりました。

プレスリリース・ニュースリリース...
PR TIMES、プレスリリース入稿システム基盤を刷新 株式会社PR TIMESのプレスリリース(2023年2月20日 18時00分)PR TIMES、プレスリリース入稿システム基盤を刷新

しかしこれだけではエディターの機能変更は不可能でした。理由はエディターが生成したHTMLはプレスリリースページで表示されています。プレスリリースページはまだreplace前であり、以前のプレスリリースページではエディターの機能変更に対応できませんでした。

PR TIMESのプレスリリースページはアクセス数が多く、またSEO上、SSRが必須です。そこで以下の方針を決めました。

  • Next.jsを使ってSSRをすることを前提にプレスリリースページのreplaceを行う
  • SSRした結果を柔軟な設定が行えるCDNのFastly上でキャッシュして配信する構成で配信する
  • プレスリリースページをCDN上でキャッシュして問題がないようなシステムに変更する

詳しくは後ほど紹介しますが、元々CDNはFastlyではなかったため、Fastly移行プロジェクト行ったり、CDN上でキャッシュして問題がないようにアクセスログ改善プロジェクトもプレスリリースページreplaceプロジェクトとほぼ同時並行で進めていました。すべてのプロジェクトが噛み合った結果、最終的なリリースに繋がっています。

Next.jsを利用したプレスリリースページリプレイスの技術的な詳細についてこちらで発信しています。

あわせて読みたい
【月間9000万PVのPR TIMES】プレスリリース掲載ページの Next.js 移行でやったこと こんにちは!PR TIMES 開発本部フロントエンドエンジニアの岩元 (@yoiwamoto) です。 先日、月間9000万 PV のプレスリリース配信サイト PR TIMES で、もっともアクセス...

この後紹介する検索ページが、プレスリリースページよりも先にNext.jsにreplaceを完了させていました。こちらのプロジェクトと協力しながらプレスリリースページreplaceを進めて、リニューアルをリリースできています。

ここまでフロントエンド中心でしたが、リニューアルプロジェクトではバックエンドでもHTMLの構造を変更しないことを前提にしたコードが非常に多く、それらの改修も同時並行に行っています。それについても近いうちに発信できればと思います。

検索ページreplaceプロジェクト

去年の記事の通り、PR TIMESの検索はOpenSearchを利用した仕組みに移行が完了していました。それによりバックエンドに変更を入れることが可能になり、replaceプロジェクトが開始しました。

結果的に、検索ページは社内第一号のNext.js事例になりました。そしてBFCacheを利用したUX改善も行うことで、UX改善も同時に達成できました。

あわせて読みたい
BFCacheを利用してNext.jsで実装した無限スクロールのUX改善をした話 こんにちは、フロントエンドエンジニアのやなぎ( @apple_yagi )です。 先日、【月間9000万PV】プレスリリース掲載ページの Next.js 移行でやったこと、という記事が公...

またOpenSearchに移行したことで、PR TIMESの主要機能のデータセンター撤退が完了しました。このことが後で紹介するデータセンター撤退に繋がります。

Fastly移行

ここまで紹介してきたように、Next.jsを活用してSSRの結果をCDN上に柔軟にキャッシュさせる必要がありました。そこでFastlyの導入が決定し、移行プロジェクトが立ち上がりました。

Fastly自体はこれまでもサムネイル画像で使ってきました。以下の記事は今年のPR TIMES STORYでFastly Image Optimizerを活用した事例です。

あわせて読みたい
AVIF・WebPでサムネイル画像を配信して、ブラウザでのパフォーマンスを大幅に改善した話 こんにちは、普段PR TIMES STORY(以下STORY)の開発リーダーをしている岩下(@iwashi623)です。 今回はSTORYのサムネイル画像の配信フォーマットを変更することによるパ...

CloudFrontからFastlyへの移行が完了し、以下の記事の発信に繋がりました。

あわせて読みたい
PR TIMESのCDNをCloudFrontからFastlyに移行しました こんにちは、インフラチームテックリードの櫻井です。 今回はプレスリリース配信サービスの prtimes.jp で使用しているCDNをCloudFrontからFastlyに移行したことについ...

この記事の発信により、担当メンバーがFastly Yamagoya 2023での登壇も行えました。

あわせて読みたい
Fastly Yamagoya 2023に登壇しました! #yamagoya2023 こんにちは、インフラチームテックリードの櫻井です。 先日Fastly株式会社の主催するYamagoya 2023に登壇させていただいたので、こちらのイベントについて紹介したいと...

Fastly移行後すぐにFastlyの機能を活用した開発が加速し、Next.js導入も進みました。

メディアリストreplaceプロジェクト

メディアリスト機能は今後リニューアルを予定しているため、現在replaceプロジェクトを進めています。大きめの発信は来年になると思いますが、フロントエンド開発に関する記事を公開しています。

あわせて読みたい
PR TIMESのフロントエンドリプレイスにおけるデザインシステムの活用 PR TIMES 開発本部フロントエンドエンジニアのすずきゆーだい (@szkyudi) です。 今回は、PR TIMESのフロントエンドリプレイスにおいて、どのようにデザインシステムを...

PR TIMES Webクリッピング改善プロジェクト

去年からβ版として提供してきた広報効果測定サービスのPR TIMES Webクリッピングは今年正式版としてリリースすることができました。

プレスリリース・ニュースリリース...
広報発表の効果測定がプレスリリース管理画面で可能に。PR TIMES Webクリッピング正式版の提供を開始 株式会社PR TIMESのプレスリリース(2023年2月21日 17時00分)広報発表の効果測定がプレスリリース管理画面で可能に。PR TIMES Webクリッピング正式版の提供を開始

現在はWebクリッピングの技術的負債の解消を進めています。一部発信済みの記事もあるので紹介します。

PR TIMES 開発者ブログ
MySQLのCharsetをutf8mb3からutf8mb4に移行した話 こんにちは。開発本部の23卒の松浦です。今回は、WebClippingで使用しているテーブルの一部のカラムのC…

プレスキット機能拡充

プレスキット機能は去年リリース済みですが、機能拡張を行っています。プレスキット一括ダウンロード機能開発に関する記事も公開しています。

あわせて読みたい
AWSとGo言語を活用して、プレスキット一括ダウンロードを構築しました こんにちは!開発本部のエンジニアのトゥ(codyzard)です。 今回は数ヶ月前にリリースされたプレスキット一括ダウンロードの機能を話したいと思います。 【背景】 2022年...

セキュリティ向上プロジェクト

開発本部の目標であるセキュリティ向上の一環で、今年セキュリティ診断を行いました。それに伴い複数の修正を行っています。一部の変更については発信を行っています。

あわせて読みたい
プレスリリースのエディタにサニタイザーを導入した話 こんにちは。フロントエンドエンジニアの桐澤(@kiririLee)です。PHPのアプリケーションから配信されるプレスリリースがサニタイザーを通るようにしたため、導入するま...
あわせて読みたい
proc_open()の標準入出力を使ってコンテナ上でコマンドを実行する 新卒1年目、バックエンドを担当している永井です。最近色々学ぶことができたのでここに共有したいと思います。また、このブログで少しでも誰かの役に立てたら嬉しいです...
あわせて読みたい
Docker+firewalldを使ってSSRF攻撃を防ぐ こんにちは、インフラチームテックリードの櫻井です。 今回はDockerとfirewalldを使って内部ネットワークへのアクセスを制限し、SSRF攻撃を防ぐ方法について紹介します...

来年以降もセキュリティ向上を進めていく予定です。

アクセスログ改善プロジェクト

PR TIMESはアプリケーション上でアクセスログを扱っている処理が複数存在しています。アクセスログをDB上で1アクセス1レコードとして扱っており、サービスの成長に耐えられなくなるのが明白でした。

またアクセスログの収集はアプリケーションにリクエストが到達する前提の構成になっており、Next.jsでSSRしたHTMLをCDN上でキャッシュさせる構成を取れないシステムになっていました。

そこでFastlyのアクセスログをS3にputするイベントをtriggerしてLambdaを呼び出す構成で1からシステムを作り直すことでこれらの問題を一気に解決しました。

あわせて読みたい
PR TIMES’s Transformation of Ranking and Analytics Systems with Enhanced Logging Hello, I'm Duc, responsible for the optimization of our press release access logging system. I'm excited to share the transformative journey we embarked on, ...

これらの改修を行うことで、先日カテゴリ別ランキングを表示する新機能をリリースすることができました。負荷になりにくい構成を選択したことで、追加のリソースなしで実現する事ができました。

プレスリリース・ニュースリリース...
人気のプレスリリース|プレスリリース・ニュースリリース配信のPR TIMES PR TIMESが配信する最新プレスリリースの一覧。話題のベンチャー~グローバル企業のニュースリリースが集まる生活者も要注目のサイトです。プレスリリースの受信は無料です...

こちらはシステム的には分かれていますが、同様にLambdaを利用した事例です。

あわせて読みたい
デバイス別アクセスログの集計処理をLambdaに置き換えました こんにちは、PR TIMESでバックエンドエンジニアをしている宮崎(@sucalul)です。 今回はPR TIMESのデバイス別アクセスログの集計処理をLambdaに置き換えた取り組みを紹介...

データセンター撤退プロジェクト

PR TIMESのAWS移行が進み、データセンターを利用しているのは他のプロジェクトのみになってきました。そこでデータセンターを撤退することを決めました。それによりPR TIMES TVのAWS移行も行われ、データセンターの機材も既に撤去済みの状況になっています。

あわせて読みたい
PR TIMESシステムのクラウドジャーニーのもう一ステップ、PR TIMES TVサービスのAWS移行の話 こんにちは、PR TIMESのバックエンドエンジニアのズンです。今回は担当していたPR TIMES TVサービスのAWS移行について話したいと思います。 前回のPR TIMESのAWS移行の...

認証プロバイダー廃止プロジェクト

認証プロバイダーは障害や定期メンテナンスなどの手間、sessionが分かれていることによる機能追加の手間・バグ発生、開発環境構築の難易度の高さ、など様々な問題を抱えており、私が入社してからずっと廃止したいと言ってきたシステムでした。

具体的な問題を言えば、例えばPR TIMESのフロントエンドからWebクリッピングのAPIを呼び出せない(Webクリッピング側のsessionが存在しているか分からないため)などの問題が発生していました。この問題をJWTを利用した新システムに移行することで解決する事ができました。

あわせて読みたい
PR TIMESのログインシステムにJWTを導入しました こんにちは、開発本部でインターンをしている田中 湧大です。 今回は認証機能をPR TIMES上で実装し、企業・事業主ユーザーとメディアユーザーでログインするときにJWTを...
あわせて読みたい
認証プロバイダーのパスワードカラムマイグレーション: MySQLからPostgreSQLへの移行の記録 こんにちは、開発本部でインターンをしている田中です。 今回は企業ユーザーの認証を担っている認証プロバイダーのMySQLから、PR TIMESのPostgreSQLにパスワードカラム...
あわせて読みたい
JWTに用いる署名アルゴリズムは何が適切かPHPで検証してみた こんにちは、PR TIMESで学生インターンをしている田中湧大です。 今回は、PHPでパフォーマンスの観点から署名アルゴリズムについて検証してみたのでその紹介をしたいと...

この変更によりインフラがシンプルになったのはもちろん、フロントエンドは自由にAPIを呼び出すことができるようになり、実装の幅が広がりました。

開発環境のシンプル化も進められるようになり、今後開発環境改善も行っていきたいと考えています。

フロントエンド開発環境改善

React/Next.jsを利用しているフロントエンドの開発環境改善は随時行っており、行った変更の開発者ブログでの発信も盛んです。今年は以下のような記事が公開されています。

あわせて読みたい
PR TIMES のフロントエンドを支える技術 2023 こんにちは。PR TIMES でエンジニアをしている岩元 (@yoiwamoto) です! プレスリリース配信サイト PR TIMES のフロントエンドは、一昨年ごろまでほぼ全てのページが Sm...
あわせて読みたい
並列で実行していたGitHub ActionsのJobをまとめ、Billable timeを削減した話 こんにちは、フロントエンドエンジニアのやなぎ( @apple_yagi )です。 GitHub ActionsのBillable timeの削減のために、複数に分けて実行していたJobを、ある程度の粒...
あわせて読みたい
Storybookを用いてテストの可視化を進めた話 こんにちは、「PR TIMES Webクリッピング」の開発リーダーをしている小張です。 Storybookをユニットテストで活用している取り組みについて、紹介したいと思います。 【...
あわせて読みたい
CypressからPlaywrightに移行しました こんにちは、フロントエンドエンジニアのやなぎ( @apple_yagi )です。 先日、フロントエンドのIntegration Testで使用されていたCypressをPlaywrightに移行したので、...
あわせて読みたい
Webpack から Vite に段階的に移行しました こんにちは。PR TIMES フロントエンドエンジニアの岩元 (@yoiwamoto) です。 PR TIMES ではいくつかのページが React で実装されており、Webpack でビルドを行っていま...
あわせて読みたい
PR TIMES フロントエンドにおけるプレビュー環境の自動生成 こんにちは。PR TIMES のフロントエンドエンジニアをしています岩元 (@yoiwamoto) です。 今回は、先日改善を行ったフロントエンドのプレビュー環境の自動生成の構成に...
あわせて読みたい
E2EテストのAPIリクエストを全てモックした話 こんにちは。開発本部でインターンをしている桐澤(@kiririLee)です。今回、「PR TIMES Webクリッピングβ版」 というプロジェクトのフロントエンドで実装されていたE2E...

これらの開発環境改善は主にフロントエンドを開発しているメンバーがフロントエンド定例で議論を行い、自主性が高い形で方向性を決めて実装をしています。

監視強化

安定したサービス運用のためにNew Relicを活用してバックエンドの監視強化を行っています。

あわせて読みたい
New Relic CodeStream を使ってエラーを迅速に改修しよう この記事は、New Relic Advent Calendar 2023 シリーズ3の20日目の記事となります。 こんにちは、バックエンドエンジニアで PHPer の江間です。 この記事では、New Reli...
あわせて読みたい
ステージング環境にもNew Relicを入れよう! こんにちは、インフラチームテックリードの櫻井です。 今回はNew Relicを本番環境だけではなくステージング環境にも入れてみるといいことがあるよということを紹介した...
あわせて読みたい
“Logs in Context + Infinite Tracing + カスタム属性”でNew RelicのObservabilityを爆上げする こんにちは、インフラチーム テックリードの櫻井です。 今回はアプリケーションモニタリングのために導入しているNew RelicにLogs in ContextとInfinite Tracingとカス...

バックエンドの改善は進んできましたが、フロントエンドはまだできていない部分も多いです。来年進めて行きたいと思っています。

開発コミュニティ支援

PR TIMESはPHPを始め、様々な言語や仕組みで動いています。そして私達自身も開発コミュニティの一員です。

そこで開発コミュニティに対してスポンサーを行ったり、イベントで登壇を行うことを推奨しています。実際に何人も登壇しています。

あわせて読みたい
PR TIMESはPHPカンファレンス北海道 2024に協賛・登壇します サーバーサイドエンジニアのshun (@shunsock)です。いよいよ、PHPカンファレンス北海道2024まであと二週間となりました。私shunは、本編最後に登壇予定ですので、準備を...
あわせて読みたい
PHPカンファレンス2023に参加しました! こんにちは、 PHPerの江間です。 先日開催されたPHPカンファレンス2023にて、PR TIMESはゴールドスポンサーとして協賛し、スポンサーブースとして出展しました。 https:...
あわせて読みたい
PHPカンファレンス2023のブース企画を初担当しました! こんにちは、開発本部の松浦です。先日開催されたPHPカンファレンス2023にて、PR TIMESはゴールドスポンサーとして協賛し、スポンサーブースとして出展しました。 今回...
あわせて読みたい
PR TIMESはPHPカンファレンス福岡2023にブロンズスポンサーとして参加・登壇しました! こんにちは、バックエンドエンジニアの宮崎(@sucalul)です。6月24日に開催されたPHPカンファレンス福岡2023にブロンズスポンサーとして参加しました。 カンファレンス...
あわせて読みたい
PR TIMESはPHPerKaigi2023にプラチナスポンサーとして参加しました! こんにちは、人事のshiraishiです。3月23〜25日まで開催されたPHPerKaigi 2023にプラチナスポンサー&ブーススポンサーとして参加しました。 カンファレンス最終日の25...
あわせて読みたい
PR TIMESが協賛したYAPC::Kyoto 2023が開催されました PR TIMESでCTOをやっている金子 (@catatsuy) です。 先日開発者ブログで紹介した、弊社も協賛するYAPC::Kyoto 2023に参加してきました。 https://developers.prtimes.jp...
あわせて読みたい
PR TIMES は PHPerKaigi 2023 に協賛・登壇します。 こんにちは、 PHPer の江間です。 PR TIMES は PHPerKaigi 2023 にプラチナスポンサー(&スポンサーブース)として協賛します。 そして、社内から1名のエンジニアが登...

来年以降もこれらの取り組みは続けていく予定です。

インターン活躍

既に紹介したプロジェクトでインターンが活躍していた事例はありますし、インターンが書いた記事もあります。そんなインターンが活躍している弊社らしい記事として、インターンが書いた記事でここまで紹介していない記事を紹介します。

あわせて読みたい
BingのIndexNowAPIを用いて、検索エンジンに即座にインデックスをする。 こんにちは!開発本部でバックエンドエンジニアとしてインターンをしている岩瀬(@gantaso4704)です。今回は、PR TIMESに投稿されたプレスリリースを IndexNowAPIを用い...
あわせて読みたい
PR TIMES初のQAインターン 3ヶ月半の軌跡 こんにちは!開発本部でQAエンジニアとしてインターンをしている嵩原(@BkNkbot)です。PR TIMESで初めてのQAエンジニアインターン生として3ヶ月半の間お世話になったの...
あわせて読みたい
インターン生がSmartyのバージョンアップに取り組んだ話 こんにちは、PR TIMESの開発本部でインターンをしている三宅です。インターンではレガシーなPHPのコードと向き合い続けながらプロダクト開発とそれを支える技術について...
あわせて読みたい
PR TIMESで4ヶ月間インターンに参加しました こんにちは。エンジニアインターンの伊藤です。PR TIMESのインターンに4ヶ月間参加させて頂いたのでその振り返りを本記事にまとめたいと思います。 【選考について】 PR...
あわせて読みたい
日本語機械学習開発環境の作成 PR TIMES開発本部インターンの土屋です。私は現在データ分析インターンとしてプレスリリースデータをはじめとする社内のデータ解析を行なっています。 今回は、機械学習...

インターンはいつも募集しているので、興味のある方はぜひ応募してみてください。

株式会社PR TIMES
エンジニアとして実力をあげたい学生インターンを募集! - 株式会社PR TIMES 株式会社PR TIMESでは現在20-5. 開発本部 学生インターン(バックエンド、フロントエンド)を募集しています。

まとめ

今年を振り返ってみて、Fastly移行が今年であることに気付いて驚きました。プレスリリースページリニューアルに向けて始まったプロジェクトでしたが、結果的にFastly移行・アクセスログ改善・プレスリリースページreplaceの3プロジェクトをほぼ同時並行で進行する事になりました。最終的に全プロジェクトを無事にリリースすることができ、目標であったリニューアルプロジェクトもリリースすることができました。

またアクセスログ改善プロジェクトにより、個人的に楽しみにしていたカテゴリー別ランキングをリリースできましたし、技術的な改善がサービスに影響を与えられるようになってきた実感もあります。

またセキュリティ向上やデータセンター撤退など、会社にとって重要なことも進められた年にすることができました。

今年進めた内容もすべて開発者ブログで発信できていませんし、来年のために準備しているものもあります。なので引き続き楽しみにしてもらえたらうれしいです。よろしくお願いします!

  • URLをコピーしました!

この記事を書いた人

株式会社PR TIMESでCTOをやっています。がんばります。

目次