2日でできる! JavaScript トレーニング - mixi engineer blog
こんにちは。SNS mixi の JavaScripter、kuniwak です。 新しい仲間たちが入社する季節になりましたね。 さて、ミクシィを支えるエンジニアが作成した JavaScript 研修の資料を Github にて公開しました。 ミクシィは 2013年から研修資料を公開していましたが、今年は JavaScript の進化に合わせて内容を刷新しています！ 2015年度の JavaScript 研修は、Web アプリケーションの部品（モジュール）をつくれるようにすることを目標とした、実践的な研修として計画されました。 JavaScript 研修のために与えられた期間は2日ということもあり、MVC や Flux といった設計方面の話題には踏み込めていませんが、Promise、Fetch API、Bower など、現在・未来のフロントエンド開発に必須の要素を盛り込んだ最新のJavaS
OpenStackとLXCを導入した話 - mixi engineer blog
こんにちは、運用部 アプリ運用グループの清水です。Golang鋭意勉強中です。 今回は、SNS「mixi」に限った話ではなく、ミクシィ社全体として利用している仮想環境について紹介したいと思います。パブリッククラウドも一部のサービスで利用していますが、今回は、自社で運用している仮想環境にフォーカスして書いてみようと思います。 今まで利用してきた仮想環境 今まで利用してきた仮想環境というと、手作業で構築したKVM（Kernel-based Virtual Machine）環境が中心でした。手作業といってもある程度手軽に構築できるように、シェルスクリプトとCobblerでVMを構築できるようになっています。構築の流れは以下のとおりです。 CobblerにVMのIPやホスト名などをスクリプトで登録する。 KVMのホスト上でスクリプトを実行（koanコマンドでCobblerと連携してVMをセットアッ
LSH (Locality Sensitive Hashing) を用いた類似インスタンスペアの抽出 - mixi engineer blog
GW 中の長距離移動のために体調が優れない takahi-i です. 今回は巨大なデータをマイニングする一つの技術として LSH (Localtiy Sensitive Hashing) を紹介させていただきます. LSH とは LSH は大量なデータから類似度が高いインスタンスのペアを高速に抽出してくれるアルゴリズムです. ここでインスタンスはデータ集合の一つの要素を表します. たとえば扱うデータが E-コマースサイトの購買ログであれば, インスタンスは各ユーザですし, 画像データ集合であれば, インスタンスは個々の画像データです. LSH の詳しい解説については以下のサイトがあります. Wikipedia のエントリ LSH に関する論文がまとめられているページ 本稿ではE-コマースサイトの購買履歴データを基に LSH の機能について述べてゆきます. 以下のような E-コマースサイトの
なぜ @kotarok さんは mixin より extend を推すのか - mixi engineer blog
こんにちは。最近、実は JavaScript よりも Perl が好きなたんぽぽグループの大形です。 Perl の、仕様書など無いところがたまりません。勉強しても勉強しても...。いえ、今回は Perl の話ではありませんでした。 一昨日の土曜日ですが、会社にお金を出して貰って、 SwapSkills さんの『CSSを便利に使うための LESS入門』にお邪魔してきました。 何を隠そう、いや、隠すことは何も無いのですが、私は今「クライアントサイドのバックエンド担当」として働かせていただいてます。つまるところ、デザイナさんやコーダさんが日々目の前の案件と戦い続けている中で、一歩引いたところからお助けユーティリティを作ったり、俯瞰して工程を見直してみたり、デザインにおける継続テストの仕組みを考えたり、新しく何かの役に立ちそうなものをどこからか引っ張ってきたりするお仕事です。 そんなお仕事の一環と
Buildbot で継続的インテグレーション - mixi engineer blog
こんにちは。パートナーサービス部の加藤和良です。 前回、mixi における開発者テスト について説明しました。だいぶ間があいてしまいましたが、今回は、そのテストを定期的に実行する 継続的インテグレーション の仕組みを紹介したいと思います。 テストが遅い 実は、mixi のテストは「遅い」という大きな問題を抱えています。 Micheal Feathers は『レガシーコード改善ガイド』のなかで、単体テストが高速に実行できることの重要性を解き「単体テスト」を厳しく定義します。 次に当てはまるものは単体テストではない。 データベースとやり取りする ネットワークを介した通信をする ファイルシステムにアクセスする 実行するために特別な環境設定を必要とする (環境設定ファイルの編集など) 上記に該当するテストが悪いというわけではない。多くの場合において、そのようなテストを書く価値はあり、しばしばテスト
スマホアプリの品質ガイドラインを公開しました - mixi engineer blog
UP by Jawbone を衝動買いした挙句、眠りが異常に浅いことが判明し、 金銭サイクルも睡眠サイクルも崩壊しつつある柿崎です。 現在、ミクシィではスマホアプリの開発に力を入れています。 もちろんQA部門でもスマホアプリの品質ってなんだろな？と、考える機会が増えたわけですが、その機会の中で、スタッフが普遍的なチェックリストを作成してくれたので、GitHub Pagesにて公開してもらいました。 スマホアプリ品質ガイドライン リンク先の概要にも記載していますが、スマホアプリ自体の動作よりも、ハードウェアやOS設定を中心とした非機能要件を中心に項目をまとめています。 項目はスマートフォンの進化にあわせて、随時更新していく予定です。 そして、このチェックリストの使い道ですが、全ての項目のクリアを必須にするとデスマ確定になるので、あくまでもスマホアプリの品質を高めるための一助と捉えていただけれ
スマートフォン開発研修教材の公開について - mixi engineer blog
クラフトワークの来日公演3-D CONCERTS 1 2 3 4 5 6 7 8を観にいったら、顔が大きいのか、3Dメガネがきつくて切なかったもりもとです。 株式会社ミクシィでは、新卒入社スタッフをはじめ、これからスマートフォンアプリ開発を行っていく全スタッフを対象に、社内で「スマートフォン開発研修」を始めています。その研修資料をこのたびgithubで公開させていただきました。 mixi-inc/iOSTraining · GitHub https://github.com/mixi-inc/iOSTraining mixi-inc/AndroidTraining · GitHub https://github.com/mixi-inc/AndroidTraining これら文書は、それぞれCC BY-SA 3.0およびApache License 2.0とCC 2.5 Attributi
mixiのアプリの設計がよく分かるブログ - スマートフォン開発研修教材の補足 - mixi Engineers' Blog
こんにちは。Android の横幕です。Android が好きすぎて、来る日も来る日もアプリの実装が頭から離れず、毎日7〜8時間ほど睡眠をとっていますが全く疲れがとれた気がしない今日このごろです。はやく iOS のアプリ開発を覚えたいですが、まだ NSLog の使い方を覚えたばかりです。 さて、先日スマートフォン開発研修教材の公開についてでも触れましたが、Android・iOS のアプリ開発を始める人向けのトレーニング資料を公開しましたところ、以下のブログのような反響をいただきましたので、この場でもって回答をさせていただきたいと思います。 mixiのアプリの設計がよくわからない http://yamitzky.hatenablog.com/entry/2013/06/19/173713 に遷移します 設計思想の基本は MVC iOS も Android も、フレームワークとしては MVC
Pure JavaScript Template Engine その弐 - mixi engineer blog
どうも、こんにちは。hirokiです。前回は、HTML::Template::ProのJavaScript実装を紹介させていただきました。今回はその実装部においてのちょっとした工夫についてと、Webフロントエンドのパフォーマンスチューニングについて簡単にまとめさせていただきます。 正規表現の話 通常、テキストベースのDSL評価系を作成する際にはyacc/lexなどで文法記述を行うのが定石なんですが、 シンプルな文法であること 構文木の評価からコードジェネレートに方向性を転換した テキストマッチングの回数や高速化のための制御がしやすい などの理由から、HTML Template(JavaScript)では正規表現ベースの文法解釈を行っています。（ HTML::Template::Proのyacc文法ファイルをそのまま使えば記述は楽だったのですが...）以下に実際に利用している正規表現を示しま
Pure JavaScript Template Engine - mixi engineer blog
はじめましてhirokiです。こんにちは。新卒で弊社に入って一年が経過しようとしているので、そろそろエンジニアブロガーの仲間入りをしてみようかと思っています。 今回はJavaScriptのお話です。ハードボイルドなバックエンド側技術のご紹介が多い当ブログですが、スイーツ（笑）なフロントエンド技術もおもしろいんだよ！ということをアピってやろうという魂胆です＞＜。 HTML.Template(JavaScript) 弊社では、サーバサイドによるHTMLの出力テンプレートエンジンにCPANモジュールであるHTML::Template::Proを使用しています。今回はそのJavaScript実装をオープンソースとして開発しましたので、紹介をさせていただきます。 HTML::Templateは貧弱で、冗長で、洗練されていないシンタックスでお馴染みのテンプレートエンジンですが、高速で必要以上のロジック
Titanium? いいえ、Triainaです。 - mixi engineer blog
どうも、5ヶ月ぶりのブログ投稿です、佐野です。僕は2012年8月よりメッセージユニットに加わり、主にiPhone公式クライアントにおけるメッセージ機能の改修に携わっておりました。 mixi Touch(スマートフォンブラウザ版)では2012年10月より一部のユーザに向けてmixiメッセージにおけるリアルタイムコミュニケーションを実現するための新UIを提供しておりました。この機能が近いうちに mixi の iPhone版、Android 版 公式クライアントでも利用できるようになります。 (画面は開発中のイメージです) この新機能は Triaina という自社製のフレームワークによって、iPhone版・Android版共に、WEB版と共通の HTML+JS コードを利用して作られています。 こういうと「Triaina? PhoneGap や Titanium と何が違うの?」とか「Faceb
「インタレストターゲティング」リニューアルの裏側 - mixi engineer blog
こんにちは。下田@研究開発グループです。 前回は、かなりライトな「行って来ました」記事でしたので、今回はデータマイニング技術の活用事例の一つとして「インタレストターゲティング」という広告商品と、そのリニューアル案件についてご紹介します。 あらまし mixiには「インタレストターゲティング」という広告商品があります。まだ僕が入社する前の2009年に研究開発グループが広告の部署と協力して作成したプロダクトになります。 リリース当初は効果が高く、人気の広告商品の一つだったそうですが、メンテナンス性やオペレーション部分に問題等を抱えており、つい最近、再度広告関係の部署と協力して、バックエンドを作り直し、新しい仕組みをリリースするに至りました。 2012年12月現在、販売している広告商品としては、2009年作のプロダクトが動いていますが、間もなく切り替わる予定となっています。 以下、2009年製の今
技術的負債を減らす - mixi engineer blog
こんにちは、システム本部長の松岡です。 はじめに 今回はミクシィの物作りの中で、技術的な負債を返済する取り組みの一つについてご紹介します。 ミクシィは2012年8月にユニット制に移行しました。これはユーザーファーストな開発を促進するための挑戦です。 裁量権が各ユニット長に落ちることで早い判断と実施が可能になります。 反面、ソースコードがユニットごとに完全に疎結合しているわけではありませんので、早い判断と実施の結果、他のユニットに迷惑がかかるかもしれません。 いつまでも、どの開発者も困らないような開発を進めていければ、問題ないことですが、これまでの開発で負債として溜まってきた事、今後の進め方次第でいずれ行き詰まる事があるとも考えています。 そこで、負債を解消するため or 未来に積まないための対応が必要となります。 ミクシィはとても技術に理解のある会社です。 私含め経営陣から積極的に負債を返
mixi の解析基盤とApache Hive での JSON パーサの活用の紹介 - mixi engineer blog
こんにちは．最近ピクルス作りで精神統一をしている，たんぽぽグループ解析チームの石川有です． このブログではお馴染みのたんぽぽグループですが，"No More 「刺身の上にタンポポをのせる仕事」 - 単純作業の繰り返しで開発者の時間を浪費しないために。"というミッションを持っています．その中で解析チームは，データ解析基盤の構築，データマイニング，データ解析の社内コンサルティングを行ない技術からの改善を担当しています． 今回の記事では，mixi における解析基盤について簡単に触れたあと，その基盤における「刺身の上にタンポポをのせる仕事」をどう減らすかの２点について書きます． mixi の解析基盤 まずは解析環境について，簡単にお話します．2012-08 現在 mixi では，主な解析用のツールとしては，Apache Hadoop, Hive を利用しています．またあわせて，自分など一部の人は，
Delight.ioでテストアプリの画面録画！(Webも) - mixi engineer blog
どうも、佐野です。先日こちらの記事でDelight.ioというフレームワークを知りました： デベロッパは自分のiOSアプリに1行書き加えるだけで、ユーザのアプリ使用セッションをビデオで記録し、彼らがアプリを操作するときのタッチスクリーンの使い方、などをチェックできる。 おー、こりゃすげぇ！ということで早速試してみたのでレポートします。 インストールはとても簡単。Quick Start Guideに従って、 Delight.ioでアカウント登録 (GitHubかTwitterアカウントが必要) 続けてアプリを登録して、AppTokenを取得 Delight.frameworkをgithubからcloneし、対象のXcodeプロジェクトに追加 その他6つのframeworkを追加し、 "Other Linker Flags" に -ObjC を指定 プロジェクト内のコードに [Delight
ミクシィのアプリケーションセキュリティの代表的な取り組みについて - mixi engineer blog
こんにちは、opera 大好き 松岡 剛志 です。今日は部長職ではなくて、セキュリティチームリーダー立場でブログを書いています。 今回は弊社の様々なアプリケーションセキュリティの取り組みのうち、以下の4つのコンテンツについて書きます。この内容はほとんどが弊社のセキュリティイベントである Scrap Challenge で使われたスライドの焼き直しです。 トレーニング セキュリティレビュー コードレビュー セキュリティチェック トレーニング 現在ミクシィでは新卒エンジニアに対して1カ月程度の缶詰の教育を行っています。そのコンセプトは以下です。 関係各所、チーム、チーム横断でのタスクに関して 迷惑をかけずに自分で判断できる/あるいは正しく判断を仰げる状態までの成長。 現状の技術的問題点や課題を把握し、改善策や改善のためのプランニングができる。 各項目への知識体系の羅針盤を提供して、自学自習によ
ミクシィの技術研修について - mixi engineer blog
こんにちは。道路に飛び出した猫に向かって危ないって叫ぼうとしたら思わず「ニャーッ！！」って叫んでしまった技術部技術支援グループのtakaiです。 ちなみに猫は無事でした。よかったですね。 さて、今回はミクシィで実施している技術研修について紹介しようと思います。 大事なこと ミクシィの技術研修は主に新卒のエンジニア職向けに実施しています。 肝心なコンセプトは既に部長が書いてしまいましたが大事なことなのでもう1度言います。 現在ミクシィでは以下のコンセプトのもと、技術研修を行なっています。 関係各所、チーム、チーム横断でのタスクに関して 迷惑をかけずに自分で判断できる/あるいは正しく判断を仰げる状態までの成長現状の技術的問題点や課題を把握し、改善策や改善のためのプランニングができる各項目への知識体系の羅針盤を提供して、自学自習によってより高度な領域まで発展することができる 「ミクシィでしか使え
Blocksを使ったHTTPリクエスト - mixi engineer blog
聖闘士星矢Ωが、思ったより面白くて小宇宙が軽く爆発しそうなk_kinukawaです。 今回は、iOSアプリでHTTP通信を行うときの話です。 2012年4月27日 「メインスレッド上で処理している」について一部修正 従来のNSURLConnectionは、レスポンスをdelegateでハンドリングしていました。 そのため、リクエストを投げる箇所とレスポンスを受ける箇所がコード上で離れてしまい、可読性がよくありませんでした。 また、レスポンスを受け取ったあとの処理についても、delegate内で条件分けをして処理をしているうちに分岐/ネスト地獄になりがちでした。 一方、iOS5からNSURLConnectionにsendAsynchronousRequest:queue:completionHandler:というメソッドが誕生しました。 引数を見る限り、GCDを使って非同期リクエストをする系
新社会人のためのバグレポートの基本 - mixi engineer blog
はじめまして、品質管理部門の柿崎です。 最近、Skyrim にハマってしまい、人生一回休みになりかけています。 季節は春ということで、新社会人になられる方も多いと存じます。 新社会人が会社勤めをするようになって、初めて書くビジネス文書といえば...... そうですね！「バグレポート」ですね。 今回はバグレポートの基本について書きたいと思います。 近年、開発現場ではバグトラッキングシステムが定着し、ドッグフーディングのような社内テストを行う現場も増え、テスト担当者以外の方でもバグレポートを提出する機会が増えています。そして前衛的なバグレポートによって、プログラマ達が理不尽かつ不可解なバグ地獄に叩き込まれる機会も増えています。 バグレポートは諸刃の剣です。 良いバグレポートはアプリケーションの問題を速やかに解決まで導きますが、反対にダメなレポートは現場に混乱をもたらします。 良いバグレポートを
iOSのMobile Safari上でのfocus()が妙な件を調べてみた - mixi engineer blog
こんにちは。ミクシィUX統括部にて、mixi Touchの開発を担当しております戸高です。 JavaScriptでの開発を行う事が多いのですが、iOSのブラウザ（Mobile Safari）のfocusの挙動について少しクセがあり、 調べてみましたので、お知らせいたします。 通常、<textarea>や<input type=”text”>等のフォーム要素に対して、フォーカスを与えたい場合、focus()メソッドを使用します。 iOSのブラウザ（以下、Mobile Safari）にて、以下のコードを実行してみます。 （分かりやすい様にjQueryを使用させて頂きました） なお、検証端末にはiPhone4S iOS5.0(9A334)を使用しています。 HTML <!DOCTYPE html> <html> <head> <meta http-equiv=”Content-Type” con
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
