レシピサービスのフロントエンドを Next.js と GraphQL のシステムに置き換えている話 - クックパッド開発者ブログ
技術部の外村（@hokaccha）です。今回はクックパッドのウェブサイトのフロントエンドを Next.js などを使って作り直している話を書きます。 この記事で紹介する新システムは、スマートフォン向けのレシピページで確認することができます。もし興味があるかたはレシピページをスマートフォンのユーザーエージェントで開いて DevTools などで確認してみてください。 Next.js と GraphQL で動いているのがわかると思います。 ご存じの方も多いかもしれませんが、クックパッドのウェブサイトはモノリシックな Rails で作られていて、10年以上 Rails で開発を続けてきました。10 年以上同じシステムで開発を重ねれば当然レガシーな部分が大量に生まれてきますが、特にフロントエンドはその影響が顕著でした。 どこから使われているかわからない CSS が大量にある、JS のコードは昔なが
AWS Elemental MediaLive を使用したライブ動画配信アプリの基盤開発 - クックパッド開発者ブログ
技術部開発基盤グループの @ganmacs です。 クッキング LIVE アプリ cookpadTV のライブ動画配信基盤(以下配信基盤)を AWS Elemental MediaLive を使用して開発した話を紹介します。 cookpadTV 上のライブ動画配信基盤の役割と機能 cookpadTV では配信基盤を使ってライブ動画機能を実現しています。 cookpadTV とは料理家や料理上手な有名人による料理番組のライブ配信を視聴できるアプリです。 Cookpad Tech Kitchen #15 や、すでにクックパッド開発者ブログに書かれた記事 1, 2 を見るとどのようなアプリかをイメージがしやすいと思うのであわせてご覧ください。 配信基盤は cookpadTV 用というよりも様々なサービスで使える共通基盤になっています。 cookpadTV と配信基盤との関係は以下の図のようになっ
React Nativeで作った新アプリについて(5日間連載) - クックパッド開発者ブログ
こんにちは投稿開発部の丸山@h13i32maruです。 今日から5日間、本ブログに投稿開発部メンバーで連載記事を書かせていただきます！ いきなり「投稿開発部で連載記事」と言われても何のことかわからないと思うので、まず投稿開発部について簡単に紹介させてもらいます。 投稿開発部は「クックパッドに投稿されるコンテンツ全般」について責任をもっている部署なのですが、中でもレシピ事業の根幹であるレシピ投稿者向けのサービス改善に力を入れています。レシピ投稿者向けのサービス改善は「どうすれば継続的に投稿したくなるのか？」「どうすれば投稿をはじめてみたくなるのか？」の2点に答えを出すことを目標に日々サービス開発に励んでいます。 そこで、本連載では投稿開発部が今年メインで取り組んでいる「クックパッド MYキッチン」という新しいアプリについて5人のメンバーで紹介させていただきます。 1日目(vol1)では「クッ
Sisimaiを使ったバウンスメールの管理 - クックパッド開発者ブログ
最近、Ninja650に乗り換えたSREチームの菅原です。今までマルチばかり乗ってきたんですが、ツインもなかなか面白いですね。シフトペダルをガチャコンいわせながら方々に出かける毎日です。 この記事では、サービスが配信しようとして何らかの理由で差し戻されたメール—バウンスメールの管理をどのように行っているかという話しを書きます。 バウンスメール サービスがユーザに向けてメールを配信しようとすると、多かれ少なかれバウンスメールは発生します。メールアドレスが間違っている・携帯電話の設定で受信を拒否している・メールボックスが一杯にになっている・IPアドレスがブラックリストに載ってしまったためサーバにメールの受信を拒否されている…etc。完全になくすことは難しいですが、バウンスメールを放置するとメールの到達率を下げたり、送信先から一時的にメールの受信を拒否されたりすることがあるため、差し戻されてしま
nginx で omniauth を利用してアクセス制御を行う - クックパッド開発者ブログ
インフラストラクチャー部 id:sora_h です。クックパッドでは、社内向けの Web アプリ (以降 “社内ツール”) を社外のネットワークから利用する際、アプリケーションレベルでのアクセス制御とは別に、リバースプロキシでもアクセス制御を実施しています。*1 これまで BASIC 認証あるいは VPN による社内ネットワークを経由した接続という形で許可していました。しかし、iOS の Safari などでは BASIC 認証時のパスワードを保存できない上、頻繁に入力を求められてしまいますし、VPN はリンクを開く前に接続をしておく必要があります。これにより、社内ツールを社外で開く時に手間がかかってしまう問題がありました。 これに対し、一部では typester/gate などを導入し Google Apps での認証を行なっていました。しかしいくつか問題があり、非アドホックな対応では
Elasticsearch を使った位置情報検索 - クックパッド開発者ブログ
ホリデー事業室の内藤です。 ホリデー事業室は昨年の4月に発足した部署で、Holiday（https://haveagood.holiday）という新規サービスの開発を行っています。 Holiday とは、クックパッドが長年取り組んでいる「毎日の料理を楽しみにする」分野からは少しだけ離れ、「いつもの休日を楽しくすることで人生を豊かにする」ことを目指したサービスです。 例えばこちらのおでかけプランのように、「〇〇に行くならここも行ったほうがいいよ」や「〇〇を散策するならこのコースだよね」など、おでかけのレシピを投稿したり探すことができるようになっています。 今回は、全文検索エンジン Elasticsearch を使って、全文検索と位置情報を絡めた検索についてお話したいと思います。 本稿で説明する内容は、実際に Holiday の中でも応用を加えた形で使われています。 Holiday では、複数
料理動画を支える技術 - クックパッド開発者ブログ
インフラストラクチャー部 星野(@con_mame)です。 少し前から、一部レシピページに料理動画を掲載していました。当初はYoutubeを使用していましたが、本日から自社配信に切り替わりました。現在はまだ掲載数は少ないですが、今後掲載数を増やしていきたいと考えております。 そこで、今回は、動画配信プラットフォームの裏側がどうなっているかという点を簡単にですがご紹介したいと思います。 構成図 構成図を見ていただくのが一番わかり易いと思うので、最初に掲載します。 見て分かる通り、今回は全てAWSのサービスを使用して構築しています。 今回使用したサービスは エンコード: Elastic Transcoder データストア: DynamoDB + DynamicDynamoDB ストレージ・配信: S3 + CloudFront エンコード通知など: SNS 今回、構築までの期間とエンコードや動
Ruby を利用した大規模ウェブサービスの開発・運用 - RubyKaigi 2011 発表資料 - クックパッド開発者ブログ
技術部開発基盤グループの id:secondlife こと @hotchpotch こと舘野です。 先日の RubyKaigi 2011 で、「Ruby を利用した大規模ウェブサービスの開発・運用」という内容で発表させていただきました。 前半はクックパッドのサーバアーキテクチャ、各種サーバのアプリがどんな風に動いているのかの紹介を、後半では「開発」→「デプロイ」→「フィードバック」→「開発」…という、サービス開発で行われているサイクルを30人以上エンジニアが居るクックパッドでどう高速に回し続けているかのお話しです。 Ruby を利用した大規模ウェブサービスの開発・運用 [slideshare id=8630511&w=425&h=355&sc=no] View more presentations from hotchpotch 当日のRubyKaigi 2011 での発表の動画は、以下を
AWKのススメ - クックパッド開発者ブログ
はじめまして。インフラチームの菅原といいます。 今年の7月に入社してから、コンソールとにらめっこする毎日を過ごしています。クックパッドのようにアクセスの多いサイトのサーバを扱うことが今まで無かったので、いろいろと勉強になることが多いです。 さて、インフラチームではサーバの状況をモニタリングして、サーバに問題がないかを常に把握するようにしています。そのため日常的にtailでログを追いかけているのですが、そんなときはAWKが非常に便利なことに気付き、最近はかなりAWKにハマっています。 今回は絶賛マイブーム中のAWKの活用例をご紹介したいと思います。 なぜAWKなのか？ 残念ながらAWKの知名度はあまり高くないようで、社内でも「なぜRubyでやらないのか？」と聞かれることがありました。僕も入社するまではcutの代わりぐらいにしか使っていなかったのですが、あるときログ出力の整形に使って以来、AW
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
