サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
衆院選
tech.recruit-sumai.co.jp
こんにちは!2016年に新卒で入社した、SUUMOのフロント開発グループでエンジニアをしているやなぎさわです。 入社早々SUUMOのCSSを再設計をする機会があり、CSS/SASSのスタイルガイドを研究していたのですが、JavaScriptのスタイルガイドで有名なAirbnbがCSSのスタイルガイドを公開しているのを見つけました。 一人で開発していたり、CSS/SASSを書く人が少人数である場合は意外とその重要性に気付きにくいのがこのCSS/SASSのコーディング規約です。CSSは単純な言語であり単にスタイリングを当てるだけであればわりと簡単にできてしまうのですが、大規模開発や修正が頻繁に必要となる運用フェーズになるとその単純さがゆえにバグを作り出しやすくなってしまいます。 特にCSSでは全てのセレクタのスコープがグローバルであり、気を抜くとすぐにクラス名などが被ってしまいます。BEMとO
はじめに 今回はWebアプリケーションの検証環境構築をDockerコンテナで省力化した事例を紹介します。 困っている事 特に新規事業系のWebサービス開発によくある課題として、動作検証環境の運用、構築に時間がかかり、地味にスケジュールの足を引っ張るという問題点があります。大抵のWebサービスの開発は以はじめに 今回はWebアプリケーションの検証環境構築をDockerコンテナで省力化した事例を紹介します。 困っている事 特に新規事業系のWebサービス開発によくある課題として、動作検証環境の運用、構築に時間がかかり、地味にスケジュールの足を引っ張るという問題点があります。大抵のWebサービスの開発は以下のような複数個の環境(Webサーバ、DBサーバなどのサービス稼働に必要なインフラ一式)から構成されています。 例えば、デザイン変更、機能追加などの開発の流れを考えてみると、まずローカル環境で開発
概要 先日リクルート住まいカンパニーのフロントエンジニアとしてJSConf in概要 先日リクルート住まいカンパニーのフロントエンジニアとしてJSConf in Icelandへ参加してきました。 JSConfで発表されたセッション,世界で使われているJSの最新事情や動向についてまとめたのでどうぞ! ※一番お伝えしたい部分は「カンファレンスの動向」の部分です。時間がない方はここだけでも読んでいただけるとためになるかもしれません! 目次 JSConfとは? セッション一覧 カンファレンスの動向 React.js マイクロサービス JSの新しい可能性 まとめ JSConf in Icelandとは リクルート住まいカンパニーのフロント企画開発グループで先日アイスランドで開催されたJSConf 2016 in Icelandに行ってきました! JSConfとは毎年世界各地で開かれている世界的
はじめに AMP(Accelerated Mobileはじめに AMP(Accelerated Mobile Pages)は、モバイルページの高速化を目的とした仕組みです。 Pinterestの調査 では、通常のモバイルページと比較して、データ通信量が1/8に削減され、表示速度が4倍早くなることがわかっています。また、米国最大級のソーシャルニュースサイトRedditは先日 AMP対応をリリース し、従来のモバイルページと比較して、約7倍から30倍の高速化を実現したと報告しています。 このように、AMPによる高速化の効果は極めて大きいです。ただ、AMPはもともとニュースや記事ページのみを対象とした技術です(AMP対応済みのニュース・記事が、Google検索結果で別枠(トップニュース)として表示されているのを目にしたことがある方も多いかと思います)。なので、高速化というメリットがある一方で、機
こんにちは!今年度4月に入社した、SUUMOスマホサイト開発チームの沼田です。 入社してからはSUUMOスマホサイトで Infrastructure as Codeこんにちは!今年度4月に入社した、SUUMOスマホサイト開発チームの沼田です。 入社してからはSUUMOスマホサイトで Infrastructure as Code を実践したり、DevOpsの基盤を整備しているのですが、最近社内でRxSwiftを布教する機会があったので、その際につくった サンプルプロジェクト を使って、RxSwiftとMVVMアーキテクチャを簡単に解説します。 実際に動くコードあるので、コードベースで解説していきたいと思います。Xcodeで⌘+click や option+clickをつかいながらコードを読むのも良いと思います。 サンプル: https://github.com/takuwan0405/R
こんにちは、SUUMOスマホサイトの開発チームに所属しているエンジニアの上野です。 今回、SUUMOスマホサイトがHTTP/2に対応しました! PCのChromeにてhttp2-and-spdy-indicatorを追加して、SUUMOスマホサイトを開くと「青いイナズママーク()」にて確認できます。こんにちは、SUUMOスマホサイトの開発チームに所属しているエンジニアの上野です。 今回、SUUMOスマホサイトが HTTP/2 に対応しました! PCのChromeにて http2-and-spdy-indicator を追加して、 SUUMOスマホサイト を開くと「青いイナズママーク( )」にて確認できます。 効果 / 結果 まず結果ですが、全体的に100ms〜200ms程度、速度が改善されました。 また、ブラウザ別で結果は大きく異なり、 FirefoxはHTTP/2の優先度制御実装が良いと
はじめに 前回は現代のサービス運用の課題とConsulの基本構造について説明しました。下の図はWebアプリケーションサーバはじめに 前回は現代のサービス運用の課題とConsulの基本構造について説明しました。下の図はWebアプリケーションサーバ 、RDBサーバ、memcachedサーバ、バッチサーバ、 デプロイサーバから構成される小規模なWebサービスのインフラ構成例です。 今回は以下の様なインフラ課題に対してConsulを使った対策を見ていきましょう。 稼働中に負荷に合わせたオートスケール機能を使ってアプリケーションサーバの台数を増減させている キャッシュサーバはピークタイムの負荷を考慮して二台に負荷分散している。また、メンテナンスや障害の発生時にはアプリケーションサーバから停止しているキャッシュサーバにアクセスしないよう切り離す必要がある。 Webアプリケーションやソフトウェアのア
こんにちは! 2016年に新卒で入社した、SUUMOのフロント開発グループでエンジニアをしているやなぎさわです。 入社早々SUUMOのCSSを再設計をする機会があり、CSS/SASSのスタイルガイドを研究していたのですが、JavaScriptのスタイルガイドで有名なAirbnbがCSSのスタイルガイドを公開しているこんにちは! 2016年に新卒で入社した、SUUMOのフロント開発グループでエンジニアをしているやなぎさわです。 入社早々SUUMOのCSSを再設計をする機会があり、CSS/SASSのスタイルガイドを研究していたのですが、JavaScriptのスタイルガイドで有名なAirbnbが CSSのスタイルガイド を公開しているのを見つけました。 一人で開発していたり、CSS/SASSを書く人が少人数である場合は意外とその重要性に気付きにくいのがこのCSS/SASSのコーディング規約で
こんにちは、SUUMOアプリケーション開発チームの有路です。 リクルート住まいカンパニーに入社をして2ヶ月のタイミングで、WWDC2016への派遣任命を受け現地にやってきました。なんと、こんなおじさんの新入社員にもたくさんのチャンスをいただけるすばらしい会社ですね。 現地に行くメリットは?とよく言われるこんにちは、SUUMOアプリケーション開発チームの有路です。 リクルート住まいカンパニーに入社をして2ヶ月のタイミングで、WWDC2016への派遣任命を受け現地にやってきました。なんと、こんなおじさんの新入社員にもたくさんのチャンスをいただけるすばらしい会社ですね。 現地に行くメリットは?とよく言われるので、そう聞かれた時の私の回答は、iOSのテック合宿だと考えて目標設定するととても効率のよい開発合宿になるよ!と答えます。 Appleのテックのみ一週間集中できるし、気合を入れれば一人ハッカ
こんにちは、SUUMOスマホサイトの開発チームに所属しているエンジニアの上野です。 今回は、リアルタイムログ解析基盤を紹介します。 背景 皆様はwebサーバログ監視(アクセスログ・エラーログなど)をどのように行われているでしょうか? スーモスマホサイトでは、アクセス数増加に伴いサーバ台数が増え、csshX地こんにちは、SUUMOスマホサイトの開発チームに所属しているエンジニアの上野です。 今回は、リアルタイムログ解析基盤を紹介します。 背景 皆様はwebサーバログ監視(アクセスログ・エラーログなど)をどのように行われているでしょうか? スーモスマホサイトでは、アクセス数増加に伴いサーバ台数が増え、 csshX 地獄に陥りました。(以下の図のような状態のことです。) ログの確認が必要になった際に、この csshX を使用して秘伝のワンライナーで確認したい部分をtailして抽出していましたが
はじめに みなさん、こんにちは リクルート住まいカンパニー Web/App企画・開発マネージャーの柴山です。 只今、GoogleのDeveloper向けの最大のイベント Google I/O 2016に参加中でして、アメリカ・サンフランシスコのMountain Viewに来ています。はじめに みなさん、こんにちは リクルート住まいカンパニー Web/App企画・開発マネージャーの柴山です。 只今、GoogleのDeveloper向けの最大のイベント Google I/O 2016に参加中でして、アメリカ・サンフランシスコのMountain Viewに来ています。 今年の会場は屋外のShoreline Amphitheatreで暑さと戦いながらのレポーティング Google I/O 2016 昨日から始まりましたGoogle I/O 2016。今年も様々な大きな発表があり、 Google
こんにちは、スマートデバイス戦略開発グループのこんにちは、スマートデバイス戦略開発グループの shimada です。 普段はモバイルアプリ開発などをメインに行っています。 今回はUnityでCardBoardを使ったVRのDemoをAndroidで動かしたお話をしたいと思います。 Background 住まいカンパニーではsuumoスコープなどVR利用が活発です。 suumoスコープとは9/1発行のSUUMO新築マンション(首都圏版)に付属していたCardBoardを使ったVRのことで、マンションの内観などをVRで見ることができます。 suumoスコープ suumoスコープではthree.jsでVRを実現しています。 今回はアプリでのVRの実現方法として、Unity CardBoard SDKを使って簡単にsuumoスコープのようなVR環境を整える方法を紹介します。 公式ドキュメントをそ
こんにちは。データソリューショングループの李です。 データソリューショングループでは、ウェブリコメンドやターゲティングバナー設置のアルゴリズム実装、賃料の予測、投函チラシの配布エリア最適化など、こんにちは。データソリューショングループの李です。 データソリューショングループでは、ウェブリコメンドやターゲティングバナー設置のアルゴリズム実装、賃料の予測、投函チラシの配布エリア最適化など、 機械学習や統計モデリングをつかってサービスの磨きこみをしています。 今回は、SUUMOが持っている建築物の外観画像と内観画像を使って画像分析を行いました。Deep learningを用いた手法や、得られた結果について紹介します。 Deep Learningとは Computer Vision(CV)やAIなどの難易度が高い学習タスクに対して、深い構造*を使って処理する機械学習アルゴリズムセットです。 表
はじめに Webアプリケーション屋さんの皆様こんにちは、tomitaです。 今日はオーケストレーションツールConsulを紹介します。オーケストレーションツールというと色々な側面がありますが、今回はサーバやサービスの”組織化”を支援することでインフラ業務の省力化に繋がるツールとしてconsulを紹介します。はじめに Webアプリケーション屋さんの皆様こんにちは、tomitaです。 今日はオーケストレーションツールConsulを紹介します。オーケストレーションツールというと色々な側面がありますが、今回はサーバやサービスの”組織化”を支援することでインフラ業務の省力化に繋がるツールとしてconsulを紹介します。 背景 近年の中規模以上のWebサービスはほとんどが対障害性やスケールアウトの観点から複数台のアプリケーションサーバやデータベースサーバから構成されるようになっています。(もちろん
こんにちは、スマートデバイス戦略開発グループの katayama です。 前回は、「three.jsを利用したVR体験の実現 ① 全天球を表示してみる」で、RICHO THETAこんにちは、スマートデバイス戦略開発グループの katayama です。 前回は、「 three.jsを利用したVR体験の実現 ① 全天球を表示してみる 」で、 RICHO THETA S などの360°カメラで撮影した全天球の画像を表示させ、自動で回転するところまでお話しました。 今回はその続きで、デバイスの向きに合わせてカメラを回転させる処理と、 Oculus Rift / Cardboard のように2眼の効果をつける処理についてお話します。 具体的には左図の様なものが、右図のように2眼になるイメージです! デバイスの回転の取得方法 スマホには様々なセンサーが搭載されており、デバイスがどちらの方向を向いて
こんにちは、スマートデバイス戦略開発グループの shimada です。 普段はモバイルアプリ開発などをメインに行っています。 今回は2/18,こんにちは、スマートデバイス戦略開発グループの shimada です。 普段はモバイルアプリ開発などをメインに行っています。 今回は2/18, 19行われたDroidKaigiで発表して感じたこと、学んだことをお話しさせて頂きます。 DroidKaigiとは DroidKaigiとは400人以上のAndroidエンジニアが集まり、お互いのAndroidについての知見を話し合うカンファレンスです。 DroidKaigi 2016 発表することになった経緯 最初は最近勉強していることを発表する場を探していて、丁度いいタイミングでDroidKaigiでSpeakerを募集していたので軽い気持ちで応募したというのがきっかけです。 ですが、いざ発表する
こんにちは、こんにちは、スマートデバイス戦略開発グループの katayama です。 普段はUX Design / UI Design 中心ですが、VRのプログラムに加えて数学的な話をすることになるとは思っていなかったです。笑 さて、「three.jsを利用したVR体験の実現 ②こんにちは、こんにちは、スマートデバイス戦略開発グループの katayama です。 普段はUX Design / UI Design 中心ですが、VRのプログラムに加えて数学的な話をすることになるとは思っていなかったです。笑 さて、「 three.jsを利用したVR体験の実現 ② カメラを回転とCardboard対応 」で、カメラの回転を扱いましたが (ライブラリをつかって)、今回はその回転について詳しく調べてみました。 回転には、「オイラー (Euler) 角」を使ったものと、「クォータニオン (Quater
こんにちは、スマートデバイス戦略開発グループの katayama です。 住まいカンパニーではSUUMOスコープ (SUUMOが提供するCardboardによるバーチャル物件内観のこと)を利用したVR (バーチャルリアリティ) 体験の提供を行っています。 SUUMOでは、アプリ / Webブラウザこんにちは、スマートデバイス戦略開発グループの katayama です。 住まいカンパニーでは SUUMOスコープ (SUUMOが提供するCardboardによるバーチャル物件内観のこと)を利用したVR (バーチャルリアリティ) 体験の提供を行っています。 SUUMOでは、アプリ / Webブラウザ のどちらからでも閲覧できるように、WebGLを利用して開発をしており、今回はこれを事例に、three.js を利用したVR体験の実装方法 (まずは全天球を表示してみるところまで) についてお話します
こんにちは。 UX・制作グループの葛田です。業務では主にサービスのUXデザインやプロダクトの画面設計をおこなっています。 今回は住まいカンパニーのオフィス内に設置されたUXルームについてご紹介させていただきます。 UXルームとは、ユーザーがどのように、なにを考えながらサービスを使っこんにちは。 UX・制作グループの葛田です。業務では主にサービスのUXデザインやプロダクトの画面設計をおこなっています。 今回は住まいカンパニーのオフィス内に設置されたUXルームについてご紹介させていただきます。 UXルームとは、 ユーザーがどのように、なにを考えながらサービスを使っているのかを観察できる部屋 です。 ここ住まいカンパニーでは、UXルームを新たに設置し、自社サービスのユーザー体験をあきらかにするとともに、得られたヒントを日々のサービス開発に活かしています。 きょうはUXルーム設置の背景とそのこ
はじめまして、こんにちは。 2015年10月に入社し、AEプラットフォームチームに配属されました新人エンジニアのLeonです。 来日して3ヶ月も満たない外国人社員に、まさか書き物のお鉢が回ってくるとは思いませんでした。 不束者ですか、どうぞよろしくお願いいたします。 今回は、私が入社早々関わらせていただいたはじめまして、こんにちは。 2015年10月に入社し、AEプラットフォームチームに配属されました新人エンジニアのLeonです。 来日して3ヶ月も満たない外国人社員に、まさか書き物のお鉢が回ってくるとは思いませんでした。 不束者ですか、どうぞよろしくお願いいたします。 今回は、私が入社早々関わらせていただいたこのブログのちょっとした遊び心について書こうと思います。 実際に見ていただく方が早いと思いますので、Google Chromeをお使いの方は F12 (Windows) または
リクルート住まいカンパニーのデザイナー、エンジニア、スクラムマスターたちが発信する Web 開発情報メディアRECRUIT SUMAI COMPANY Tech Blog ITのちからで暮らしをよくしたい、エンジニア・デザイナーが発信するTech情報メディア
このページを最初にブックマークしてみませんか?
『Tech Blog - リクルート住まいカンパニー』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く