はてなブックマーク

NewsPicks Mobile App Unitでインターンをしているりゅう(@ryu_hu03)です。 NewsPicksのiOSおよびAndroidアプリは基本的に週一で新しいバージョンがリリースされています。 リリース作業の多くは自動化されており、重要な機能についてはUIテストによって品質が担保されるようになっているのですが、見た目上のデザイン崩れが起きていないかの確認はこれまで手動で行っていました。 デザイン崩れがないかどうかの確認は目視でやるしかなく、確認項目もそれなりに多いので、デザイン崩れの見落としがあったりリリース作業自体の負荷が大きいといった課題がありました。 そこで、デザイン崩れが起きていないかどうかの確認を自動化すべく、Visual Regression Testingを実装しました。 本記事では、その実装や効果についての話をしたいと思います。 使用したツールと流れ

こんにちは、Product Teamのあやぴーです。 今回はここ1年くらい私のいるチームで使っているF#とASP.NET Coreを使ったAPI開発について簡単にまとめていきます。 目次 目次 F#ってなんだ？ なぜ、今F#を採用したのか Minimal APIを使って、APIをつくる アプリケーションの雛形をつくる 任意のHTTPステータスとJSONレスポンスを返却する ルートパラメータやJSONボディの受け取り方 最後にF#を採用してみた雑感 F#ってなんだ？ F#はMicrosoft(MSFT)が開発した、いわゆる関数型言語の特徴(第一級関数,イミュータブルデータなど)を持つ言語です。.NET VM上で動き、OCaml(ML系)に近いシンタックスを持っているというのがユニークなところです。また.NET VM上で動作するため、C#などのライブラリを使うことができるのもメリットです。JV

はじめに はじめまして、Androidエンジニアのa7therです。 Androidエンジニアとはいっても、まだまだAndroid開発に従事して8ヶ月の駆け出しのため、 自分なりの技術キャッチアップ方法と参画前後でどのようなことをしてきたかを書きたいと思います。 経歴 前提情報として自分の経歴を軽く.. 業務系Webアプリケーション開発と組込み系Java開発に約6年従事していました。 そのため、エンジニア初心者というわけではなく、また、以下の本に影響を受けています。 リーダブルコード Java言語で学ぶデザインパターン入門 Java言語で学ぶデザインパターン入門 マルチスレッド編 Effective Java 特にデザインパターンはどちらもおすすめです。 Android開発では使わなくなってしまったパターンもありますが、コードを読む際に役立つことが多いです。 キャッチアップ方法の結論 先に

NewsPicks SREチームのEdwin Wilsonです。 NewsPicksでは開発環境のテストデータのプロビジョニングを行うツールとしてDatarefreshというものがあります。 このツールは本番環境のデータストアから開発環境のデータストアに対してデータを同期するアプリケーションです。 対象のデータストアは以下となります。 Amazon RDS Amazon DynamoDB Amazon S3 Amazon ElastiCache 個人情報はRDSにのみに存在しており、マスク処理を行った後、同期しています。 DynamoDB ,S3, ElastiCacheには個人情報を存在しないため、開発に必要なデータをそのまま同期しています。 Datarefreshの実行は開発者がいつでもChatopsで行えます。 ChatopsでDatarefreshの実行の仕方 Chatopsで呼び

概要 NewsPicksは「最高の開発体験の追求」をしている会社です。エンジニア向けのサイトの1ページでも謳っており、そこから弊社高山の記事に辿れるので、こちらも読んで頂けると幸いです。 そして、これはサーバーサイドだけの話しではなく、モバイルチームでも同じように開発者体験向上を目指し、Four Keysを追っています。 Four Keys とは、ソフトウェア開発チームのパフォーマンスを計測する4つの指標です。Four Keys 指標を用いることで、ソフトウェアデリバリの「スピード」と「安定性」を測定できます。 いわゆる組織の開発生産性が可視化できるということですね。 私が所属するモバイルチームもさまざまな改善をすることで、Four Keysの指標が少しづつ改善しており、「エリートDevOps チーム」に近づいてきました。 ちなみにNewsPicksのモバイルチームは、モバイルのDevOp

皆様こんにちは、NewsPicksエンジニアの米澤です。 先日 2023/03/30は、こちらでアナウンスしていた通り、サービスの停止を伴うシステムメンテナンスを実施させて頂きました。 NewsPicksをご利用頂いている皆様には、ご迷惑おかけいたしました。 今回はこのメンテナンスの中で行われたDBテーブルのmigrationについてお話ししたいと思います。 ことの始まり NewsPicksではバグの検知にBugSnagを利用しています。 ある時、BugSnagにこんなエラーが通知されてきました。 org.springframework.orm.hibernate4.HibernateJdbcException: JDBC exception on Hibernate data access: SQLException for SQL [n/a]; SQL state [HY000]; e

はじめに NewsPicksエンジニアの七五三です。 最近はChatGPTの話題が尽きません。弊社でもChatGPT APIの社内勉強会やブログの執筆が行われ盛り上がりを見せています。 tech.uzabase.com そんな中、ChatGPTを利用したプロダクト改善アイディアの発散や実装事例の作成を目的にNewsPicksプロダクトチームで「ChatGPT開発合宿」が開催されました。 開催から少し日が経ってしまいましたが、本記事で合宿の様子をご紹介します。 スケジュール 3月30日から2日間に渡って開催された開発合宿は以下のスケジュールで進行しました。 1日目 10:00 集合・アイディア出し オフィスに集まり合宿スタートです。 アイスブレイクののち、アイディア出しを行いました。 プロダクトの新機能や社内の業務改善ツールなど、大小様々なアイディアが創出され、開発合宿では2つのアイディアを

こんにちは、NewsPicks サーバーサイドエンジニアの池川です。 こちらのイベントご存知でしょうか？ server-side-kotlin-meetup.connpass.com www.youtube.com 実は先日 4/7 (金) に、東京駅目の前にある、ユーザベースオフィスにて、オフライン会場の提供をさせていただきました。 今回のブログではその裏側について書いていきたいと思います。 きっかけ 開催までの準備 リハーサル・当日の準備 当日 イベント終了後 終わりに (オフライン会場での勉強会に興味がある方々) 宣伝 ー LLM 勉強会 with 朝日新聞さん きっかけ 今年に入って以下のようなツイートをお見かけしました。 久しぶりにオフラインでのMeetupに裏方として参加したけど、オンラインと違って熱気というか人の圧を感じた！笑 オンラインはオンラインで良いところもあるんだけど

あいさつ こんにちは。Product Team の 下川、9sako6、手嶋、藤原です1。 本記事では、我々が開発している Deno 製アプリケーションのパフォーマンス監視を Elastic APM で行った方法を紹介します。 背景 Product Team では、パフォーマンス監視を目的として部分的に Elastic APM の導入を進めています。 本記事で監視対象としたアプリケーションは Deno で書かれており、対応する Agent がありませんでしたが、 必要なものは自分たちで用意すべきと考え、Agent を自作することにしました。 (厳密には、Node.js には対応していましたが、Deno で試したところうまく動きませんでした) Elastic APM と今回実装した Deno 向け Agent の概要 Elastic APM の簡単な説明 Elastic APM とは、Ela

この記事は、NewsPicks Advent Calendar 2022 の 17 日目の記事になります。 qiita.com こんにちは。AlphaDrive で Web アプリケーションエンジニアをしている fmatzy です。普段は主に Go でバックエンドの開発を行なっています。 現在新規開発中のプロダクトにて、パスワードログインの導入に Keycloak を利用しました。社内ではすでに Keycloak の導入事例があり、かなり参考にできる環境が整っていました。一方で Keycloak 自体は近年 WildFly から Quarkus に移行し、公式含め技術情報が outdated なものが多く見受けられました (例えば、公式の docker-compose の example は WildFly 版がアーカイブされた後 Quarkus 版が追加されていない…)。 本記事では、今

こんにちは、NewsPicksの米澤です。 ところで皆様、テストコードって書いてますか...? ネットでテストコードについて検索すると 「テストコードを書きましょう」 「テストコードとはこうあるべし」 「TDD(Test Driven Development)だ」 等々が叫ばれています。 ただ、なんとなく「方法論ありきでとにかくテストを書け」と言われているようで、テストの必要性について納得感に欠けている方もいらっしゃるのではないでしょうか? なぜ テストコードを書くのでしょうか? テストコードを書く理由 諸説ありますが、私が思うテストコードを書く理由は 将来リファクタリングをしやすくする テストコード書く途中で、開発者自身が仕様を理解し、成長できる の2つです。 将来リファクタリングをしやすくする 「昔書かれたこのコードはどういう挙動になるべきなんだ...?さっぱり分からん!」 ある程度コ

NewsPicksモバイルチームの森崎（asa）です。 今回はモバイルチームで取り入れているライブラリの自動更新について紹介します。 スピーディーかつ複雑な開発が求められる現場では、ライブラリにお世話になることも多いと思います。しかし、実装時の楽さとは引き換えにライブラリのバージョンアップデートの追従や、ライブラリ自体がメンテナンス停止で移行を余儀なくされたりと、保守コストが上がってしまうという側面に悩まされる経験がある方も多いと思います。 そんな悩みを解消してくれるのがライブラリの更新の自動化です。今回の方法はモバイルだけでなくバックエンドやフロントエンドでも導入可能になっています。参考になれば嬉しいです。 全体の流れ Renovateがライブラリのリリースを検知してバージョンアップのPRを作成する PRの作成を検知してタスクチケットを作成する PRをレビュー・マージしてチケットを閉じる

NewsPicks エンジニアの中村です。普段はデータ基盤や機械学習システムの開発、運用をやっています。 さて皆さん、すでにChatGPTは使っていらっしゃるでしょうか。エンジニア、非エンジニアを問わず世の中を席巻している感のある ChatGPT ですが、今月初めにいよいよ API も公開されて、アプリケーションやサービスに組み込みたいと考えている方も多いのではないでしょうか1。 というわけで、弊社でもこの新しい技術をより多くのエンジニアに使いこなせるようになってもらいたいと考え、ChatGPT API に関する社内勉強会を先日開催しました。本記事ではこの勉強会の内容を再構成してお届けします。 とりあえず使うだけなら簡単な ChatGPT ですが、本記事では、長文を扱ったり、ChatGPT と外部のシステムを連携させたりするテクニックなど、知っている人はすでに知っているが、まだそれほど広く

はじめに こんにちは！NewsPicks の Web Reader Experience Unit で Web フロントエンドを中心にエンジニアをしております、イイダユカコ（ @becyn ）です。 このブログは、3月8日に Findy 社主催の アクセシビリティのイベント、「高まるウェブアクセシビリティの需要ーfreee×ニューズピックスー〜フロントエンド最前線〜」に登壇した内容を紹介するものです。 イベントについて 当日はフロントエンドエンジニア、デザイナーの方を中心に256名（キリが良い）の方々に参加応募していただきました！ありがとうございました！ 正直なところ、現状の NewsPicks は「完璧にアクセシブルな状態である」とは言えません。 そんな中登壇機会をいただき、「今 Unit で行えている共有できることの全てのことを正直に話そう」と気合いを入れるところから始まりました。 （

iOSエンジニアの金子です。 NewsPicks iOSアプリでは2021年7月ごろからThe Composable Architecture（TCA）を採用したアーキテクチャへの移行を進めています。 tech.uzabase.com メインのニュースフィード画面もTCA+SwiftUI/UIKitで全面的に書き換え、TCAを使った実装もだいぶこなれてきたなと思っていた矢先、TCAで大きなアップデートがありました。 tech.uzabase.com このReducerProtocolへのマイグレーション作業を1月から開始し、1ヶ月ちょっとかけてようやく全てのReducerをReducerProtocol化することができました。 本記事では、NewsPicksで取り組んだReducerProtocolへのマイグレーション作業についてご紹介します。 どのようにマイグレーションを進めたか 公式ド

NewsPicksのWeb Reader Experience Unitで学生インターンをしています。西(@yukinissie)です。 弊チームの開発基盤では、reg-suitやstorycapを利用したVisual Regression Test（以降 VRT）を導入しています。本ブログではVRTが誤検知した動画やアニメーション周りの問題に対してどのように解決したかをそれぞれご紹介します。 VRTの誤検知とは？ 弊チームではVRTを以下の6ステップで行なっており、これらはGitHub Actions（CI）上で自動化されています。 Storybookでプレビューできるコンポーネント（以降、story）のソースコードを更新する Storybookをビルドする storyをstorycapでスクリーンショットする reg-suitで3.のスクリーンショットからスナップショットを作成する r

こんにちはNewsPicks SREチームの美濃部です。 NewsPicksのSREのミッションの1つに「コストを適正化する」というものがあります。サービスの規模拡大に比例してインフラコストが増えないようにし、売上に対するコストの割合を低く維持していくのがミッションになります。 今回はこのミッションに対するアクションとして開発環境のインフラコストを適正化した話をします。 NewsPicksの開発環境について まず、NewsPicksの開発環境について概要を説明します。 インフラ基盤は本番環境と同様にAWSを利用しており開発チームは現在10以上のチームが存在し、それぞれのチーム専用に用意された開発環境を利用しています。 2年程前までは開発環境はIaC化されておらず手動で構築していたのでチーム毎に環境を構築するのは手間と時間がかかりなかなか増やせない状態でした。その課題を解決する為にcdkでI

こんにちは。NewsPicksのWeb Reader Experience Unitで学生インターンをしている西（@yukinissie）です。 昨年の 9 月までSREチームに所属しており、その頃にNewsPicksの全ての常駐バッチサーバーをAWS CDKを用いてAWS FargateとAWS Fragate Spotを併用するようにさせましましたのでコストの変化や工夫した点についてご紹介します。 AWS Fargate Spotとは？ AWS Fargate Spot（以降、Fargate Spot）とは、AWS re:Invent 2019にてAWSが発表したAWS Fargate（以降、Fargate）の新しい機能です。この機能を有効にすると通常のFargateよりもコスト（料金）が最大70%割引で利用することができます。 AWS公式ブログ「AWS Fargate Spotの発表

こんにちはNewsPicks SREチームの飯野です。 今年の1月入社の新入社員です。そろそろお仕事に慣れてきました。今回は研修と研修の合間に地道に行っていたCloudWatchアラームの整理について話していきたいと思います。ちょっと長くなりますがお付き合いください。 よくわからないしアラームを整理しよう まずはスプレッドシートで一覧してみよう 整理の方針を決めよう さまざまな問題をかかえたアラームたち Case#1 AlarmActionが未設定のアラーム（5個） Case#2 ActionのSNSトピックが存在しないアラーム（16個） Actionを差し替えるのはちょっと手間 Case#3 ActionのSNSトピックの通知先が退職した社員のメールアドレス（97個） Case#4 監視先のDynamoDBのテーブルがすでに存在しないアラーム（97個中の85個） Case#5 監視先のE

はじめに こんにちは！Product Teamのデータサイエンティストの堀内です。 私が所属しているProduct Teamは、リーダーがいないフラットな組織として、ほかのエンジニア組織にはない独自のカルチャーを様々持っていると日々感じています。 今回は、そんな「リーダーがいない組織で1on1がどのように行われているか」をご紹介します。 1on1自体・ユーザベースのProduct Teamのカルチャー・フラットな組織のマネジメント、などにご興味がある方には是非読んで頂きたいと思います。 概要 企業の組織の多くは階層構造を持ち、そういった組織の1on1は、一般に、上司と部下で行われます。 しかし、弊社のProduct Teamには、そういった階層構造がなく、リーダーがいません*1。 そのため、1on1はメンバー同士で行われ、一方がコーチ、一方はクライアントとなり、コーチングという形で行われて

こんにちは！ NewsPicksの法人向けサービス開発チームの森です。 私は元営業職でエンジニアとして働くのはNewsPicksが初めてで、入社して3ヶ月の頃に入社エントリーを書かせていただきました。 tech.uzabase.com 前回はなぜエンジニアに？なぜNewsPicksに？といったお話をさせていただきましたが 今回は入社から半年経って、NewsPicksのエンジニア組織が大事にしている「開発者体験向上」に繋がる取り組みに挑戦してみました！といった内容について書いていこうと思います。 お時間がない方はぜひ！採用ページだけでも見てくださると泣いて喜びます！（ここが一番大事） tech.uzabase.com NewsPicksは開発者体験向上を大事にしています 今回やったこと：フロントエンドをslackからリリースできるようにする 前提 変更前 変更後 実装方法 Slackからリリ

自己紹介 初めまして、NewsPicksエンジニアの米澤翔です。 2022年の6月に入社し、そこから初めてKotlinを触り始めました。 私は昔軽くJavaを触ったことがあったり、C#をメインにコードを書いていたりしたのですが... Kotlinはまさに「ちょうど良いパートナー」でした。 kotlinlang.org 今回はそんなKotlinの魅力について、特にWebエンジニアの視点から語らせてください。 Kotlinの魅力 「使い手の心理的安全性が高く保たれ、書いたり読んだりする負担が小さい」 「それでいてJavaの便利なライブラリやフレームワークを利用できる」 これにつきると思っています。 null安全がデフォルトとなっている 一番でかいメリット。 例えばJavaで「安全な」コードを書こうとしたら、こんなコードになるのではないでしょうか? public void save(FreeTr

こんにちは。AlphaDrive アプリケーションエンジニアの芥川です。 弊社では選考フローにモブプロ形式のライブコーディング面接を取り入れています（記事内では省略して「コーディング面接」と呼びます）。 私も昨年コーディング面接を受けて AlphaDrive に入社し、この 1 年くらいは面接官を担当するようになりました。 この記事では面接官としてコーディング面接をする上で意識していることを紹介したいと思います。主に「進め方」「フィードバック」「評価観点」について話します。 これから弊社の採用を受けようとしている方はもちろん、採用に携わっていてコーディング面接を導入・検討している方にも参考になればと思います。 本記事は、 NewsPicks Advent Calendar 2022 の 12/24 公開分の記事になります。 qiita.com 前日の記事からの連作です 本記事は前日の CT

はじめに 本記事は、 NewsPicks Advent Calendar 2022 の 12/23 公開分の記事になります。 qiita.com AlphaDrive CTO／NewsPicks 技術フェローのアカザワです。 本記事ではAlphaDriveが2年前にエンジニア組織を立ち上げて以来継続しているモブプロ型のライブコーディング面接が、立ち上げから一貫して内定承諾率を85%以上の水準で継続できていることに大きく寄与している要因の１つだと、入社を決めてくれる仲間が増えるに連れて強く感じるようになったため、この方式の面接を導入した背景や効果について書きたいと思います。 ライブコーディング面接は、昨年度からはNewsPicksのエンジニアチームの採用プロセスにも取り入れられ、ワークショップ面接という呼称で社内で運用しております。そちらに関しては、4日目のNewsPicks CTO／CPO

はじめに 本記事は、NewsPicks Advent Calendar 2022 の 12/22 公開分の記事になります。 こんにちは、Androidチームのアーキテクトのko2icです。 久しぶりの投稿でございます。 なぜ久々なのかというと、ここ数ヶ月Androidの起動時間を爆速にすべく、奮闘していたからです。 そしてなぜ、高速化が必要なのか。これは、ユーザ目線で考えると当たり前でやるべきなのですが、それ以外にもKPIにとてもいい影響が出るからです。 ちなみに以前の会社では起動高速化したことで、広告売上が（インターステシャル広告をなくしても）2倍になりました。全員にとっていいことしかありません。 ちなみにIOS版の途中経過として、以前、iOSエンジニアの森崎が投稿しているので、以下もご覧ください。 tech.uzabase.com 結果から発表 どーん Android起動時間の推移 ど

本記事は、NewsPicks Advent Calendar 2022 の 12/19 公開分の記事になります。 はじめまして、11月からAlphaDriveにJoinし、Webアプリケーションエンジニアをしている畠山(keyamin)です。 今回は、Goで関数のオプション引数を実現するための方法を紹介しようと思います！ お題 コーヒーショップを題材に、コーヒーインスタンスを作成するプログラムを考えます。コーヒーファクトリー関数の呼び出し側は、サイズ、ミルクの有無、角砂糖の数を指定することができます。 ※こちらの題材はO'Reilly Japanより出版されている実用 Go言語を参考にしています。めちゃくちゃいい本なので是非読んでみてください...！ type Portion int const ( Regular Portion = iota Small Large ) type Cof

本記事は、NewsPicks Advent Calendar 2022 の 12/18 公開分の記事になります。 NewsPicks Web Reader Experience Unit でフロントエンドエンジニアをしているじゆんきち(@junkisai)です。 弊チームでは、ここ1年間くらいWeb 版のNewsPicksを新しい基盤に置き換えつつ、見ためも刷新するプロジェクト（以下リニューアルプロジェクト）を進めています。 Web 版 NewsPicks は、jest でロジックの単体テスト、コンポーネントのレンダリングテスト、 a11y テストを Github Actions 上で実行しています。しかし、コードの規模が大きくなるにつれ、テストの実行時間が最大で 10 分程度かかるようになってしまい、開発体験を阻害してしまっていました。 今回は、最大 10 分程度かかっていたテストの実行