はてなシステムの考古学 / History of development at Hatena
by
Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
はてなシステムの考古学 2017-03-04 YAPC::Kansai 2017 OSAKA motemen
Slide 2
Slide 2 text
提供
Slide 3
Slide 3 text
こんにちは ● id:motemen ● 株式会社はてな CTO、 チーフエンジニア ● Perl、Go
Slide 4
Slide 4 text
普段はPerlを書いています ● はてなのトップページ ● はてな匿名ダイアリー
Slide 5
Slide 5 text
No content
Slide 6
Slide 6 text
No content
Slide 7
Slide 7 text
趣味でGoを書いてます ● ghq / gore / go-for-go-book ● はてラボ人間性センター
Slide 8
Slide 8 text
No content
Slide 9
Slide 9 text
No content
Slide 10
Slide 10 text
アジェンダ ● はじめに ● 背景 ● 時代探訪 ● 考察
Slide 11
Slide 11 text
はじめに
Slide 12
Slide 12 text
考古学とは言いましたが ● コードの年代測定をしたいわけではない ● 記録のない遺物がそうそうあるもんでもない
Slide 13
Slide 13 text
むしろ ● ある Perl 企業の15年を追うケース・スタディ ● DISCLAIMER: いち Perl エンジニアの観点から ○ ウェブ開発メイン ○ インフラ、スマートフォンアプリ成分は少なめ
Slide 14
Slide 14 text
歴史学 ● 人間もサービスもコードベースも代替わり ● 飲み話だけでない歴史編纂
Slide 15
Slide 15 text
背景
Slide 16
Slide 16 text
㈱ はてな ● ウェブサービスの会社 ● 「老舗ベンチャー」(2001 〜) ● 2016 年上場 ● 京都本社、東京本店 ● 主な言語: Perl
Slide 17
Slide 17 text
No content
Slide 18
Slide 18 text
はてなのサービス(一部、カッコ内は年齢) ● はてなブログ(5) ● はてなブックマーク(12) ● はてなニュース(8) ● 人力検索はてな(16) ● はてなダイアリー(14) ● はてなハイク(10) ● はてなスター(10) ● はてなアンテナ(15) ● はてなフォトライフ(13) ● はてなグループ(13) ● BrandSafeはてな(3) ● Mackerel(3) サービス一覧 - 株式会社はてな
Slide 19
Slide 19 text
ミッション 「知る」「つながる」「表現する」で 新しい体験を提供し、人の生活を豊かにする
Slide 20
Slide 20 text
「はてな 採用」
Slide 21
Slide 21 text
宣伝おわり
Slide 22
Slide 22 text
時代探訪
Slide 23
Slide 23 text
時代区分 古代 …… 2001〜2004 中世 …… 2004〜2007 近世 …… 2007〜2011 近代 …… 2011〜2014 現代 …… 2014〜
Slide 24
Slide 24 text
古代(創業〜2004)
Slide 25
Slide 25 text
No content
Slide 26
Slide 26 text
先史時代 ● エンジニア 2 人〜 ● テキストによる記録は希少 ● 口承による調査を行った
Slide 27
Slide 27 text
Perl ● ウェブは Perl 企業が多かった ○ イー・マーキュリー ○ オン・ザ・エッヂ ○ ガイアックス
Slide 28
Slide 28 text
No content
Slide 29
Slide 29 text
アプリケーション基盤の進化 ● CGI (2001) ○ グローバル変数 ● Apache::Registry (2001) ○ my をつけないとやばい ○ use strict;
Slide 30
Slide 30 text
OOP, CVS, フレームワーク (2001) ● グローバル変数はやめよう ○ OOP ○ じゃあフレームワークも作ろう ● CVS も同時期に導入 ○ CVS 以前のコードはみあたらず(残念)
Slide 31
Slide 31 text
Hatenaフレームワーク (2001) ● Model-View-Controller ○ ドメインロジック層(Function) ○ Active Record 風 ORM ● mod_perl ● HTML::Template / Template-Toolkit ● はてなサービスに特化
Slide 32
Slide 32 text
人力検索サイトはてな (2001)
Slide 33
Slide 33 text
はてなダイアリー (2002)
Slide 34
Slide 34 text
中世(2004〜2007)
Slide 35
Slide 35 text
開拓の時代 ● エンジニア 約 10 人 ● 「Web 2.0」 ● 『ウェブ進化論』 (2006)
Slide 36
Slide 36 text
Hatena2フレームワーク (2004) ● Hatena後継 ● mod_perl2 ● ヘルパースクリプト、ローカルサーバ ● はてな開発の裏側(Shibuya.pm #5)(2004) ○ “速ければ1日でサービスイン”
Slide 37
Slide 37 text
はてなブックマーク (2005)
Slide 38
Slide 38 text
開発合宿!!! (2014)
Slide 39
Slide 39 text
はてなグループ (2004) ● 日記 + Wiki のグループウェア ● 社内Wikiから移行 ● ドキュメントや日誌だけでなく、日記
Slide 40
Slide 40 text
なんでも書いた結果
Slide 41
Slide 41 text
開発スタイル ● 情報公開 ● 「50%ルール」 ● 1人1プロダクト + サブ ● 立ったまま会議 ● フリーアドレス
Slide 42
Slide 42 text
オープン戦略 ● はてなウェブサービス ○ RSSフィード ○ AtomPub ● はてな技術発表会日記
Slide 43
Slide 43 text
インフラチーム (2007) ● チームらしいチーム ● サーバ管理ツール
Slide 44
Slide 44 text
近世(2007〜2011)
Slide 45
Slide 45 text
繁栄の時代 ● エンジニア 約 20 人
Slide 46
Slide 46 text
はてな、京都に上ル 4月に本社を移転 - @IT (2008)
Slide 47
Slide 47 text
はてなブックマーク リニューアル (2008)
Slide 48
Slide 48 text
B! リニューアル ● 機能強化 ○ ブックマークの検索 ○ ページの分類 ○ コンピュータサイエンス的な手法も ● 負債返却
Slide 49
Slide 49 text
B! リニューアル - 支えたもの ● チーム開発 ● 新フレームワーク
Slide 50
Slide 50 text
チーム開発 ● 組織でものを作る潮流 ● エンジニア 1-4 人 + デザイナ 1-2 人 ○ アルバイト学生も ● 9ヶ月
Slide 51
Slide 51 text
新社内フレームワーク ● Ridge ○ mod_perl2 / POE / Plack ● DBIx::MoCo ● Ten.js ● modules-Hatena
Slide 52
Slide 52 text
新WAFに至る道 ● Hatena → Hatena2(→ Hatena2.5) ● ほかの候補: Ruby on Rails / Catalyst ● 結局 Perl に
Slide 53
Slide 53 text
No content
Slide 54
Slide 54 text
サマーインターン (2008) ● トレーニング ○ 課題をパスしないと 後半に進めない ● 本番開発 ○ リリースする
Slide 55
Slide 55 text
サマーインターン - ねらいと効果 ● ねらい ○ 学生に成功体験を持ち帰ってもらう ○ 京都でのリクルーティングも ● 副次的効果 ○ 社内ドキュメントの整備 ○ 社員教育
Slide 56
Slide 56 text
https://commons.wikimedia.org/wiki/File:Figure_27_04_03.jpg
Slide 57
Slide 57 text
Ridge + DBIx::MoCo ファミリー ● はてなブックマーク ● うごメモはてな ● はてなスター ● はてなモノリス ● はてなハイク ● はてなココ ● はてなランド ● はてなOne ● はてな ポータルサイト ● プロフィールページ ● はてなのお知らせ
Slide 58
Slide 58 text
コードベースを巡る状況 ● 均質化した環境 ○ Ridge + MoCo というベース ○ RPM による CPAN モジュール管理 ● 一方で ○ フレームワーク on 社内フレームワーク ○ 共有モジュールの別ブランチ化
Slide 59
Slide 59 text
近代(2011〜2014)
Slide 60
Slide 60 text
脱伝統の時代 ● エンジニア 約 30 人
Slide 61
Slide 61 text
No content
Slide 62
Slide 62 text
はてなブログ (2011) ● はてなダイアリー(当時8歳)のリニューアル
Slide 63
Slide 63 text
はてなブログ - 技術的背景 ● 社内フレームワークのタコツボ化 ● 非 .hatena.ne.jp ドメイン ○ motemen.hatenablog.com ○ 既存の社内フレームワークの恩恵が薄い
Slide 64
Slide 64 text
ぼくのかんがえたさいきょうのうぇぶあぷりけーしょんふれーむわーく (2011)
Slide 65
Slide 65 text
“薄い”フレームワーク ● フレームワーク = 設計指針 ● 読むべきコードの最小化 ● Plack/PSGI + Router::Simple ● DBI + SQL::NamedPlaceholder ● Text::Xslate, JSON::XS
Slide 66
Slide 66 text
現代の標準的構成 ● Plack, Starlet ● Carton ● daemontools ● nginx ● MySQL, Redis
Slide 67
Slide 67 text
Perlの上にも三年 〜 ずっとイケてるサービスを作り続ける技術 〜 (2015)
Slide 68
Slide 68 text
開発フロー ● 体制としてのチーム開発がさらに洗練 ● 新しいコードベース ● 新しいツール
Slide 69
Slide 69 text
はてなブログの開発フロー (2013)
Slide 70
Slide 70 text
はてなアプリケーションエンジニア座談会 (2013)
Slide 71
Slide 71 text
はてなブログチームの開発フローとGitHub (2014)
Slide 72
Slide 72 text
Workflow at Hatena Mackerel Team (2014)
Slide 73
Slide 73 text
GitHub Enterprise 導入 (2012) ● Pull Request によるコードレビュー ● Issue によるタスク管理 ● Wiki は利用せず、はてなグループ
Slide 74
Slide 74 text
開発フローの伝播 ● IRC/Slack 上の口コミ ● 異動にともなう輸出入
Slide 75
Slide 75 text
git-pr-release (2013) ● ブログチームのスクリプトを輸出
Slide 76
Slide 76 text
prchecklist (2015) ● (社内)ウェブサービス化
Slide 77
Slide 77 text
現代(2014〜)
Slide 78
Slide 78 text
多様化の時代 ● エンジニア 約 50 人
Slide 79
Slide 79 text
No content
Slide 80
Slide 80 text
Mackerel (2014) ● サーバ管理知見をサービス化 ● 当時の CTO 肝いり ● Scala / Go / PostgreSQL
Slide 81
Slide 81 text
Scala In Perl Company (2014)
Slide 82
Slide 82 text
『実践 ドメイン駆動設計』 ● はてな社内で開催したDDD勉強会 の様子をご紹介します (2015) ● DDD的な用語が通じやすく
Slide 83
Slide 83 text
はてなブックマーク 再リニューアル はてなブックマーク in Scala (2015)
Slide 84
Slide 84 text
Perl も健在 ● 開発の高速さ・知見 ● 運用経験 ● BrandSafeはてな (2014) ● 受託サービス複数
Slide 85
Slide 85 text
その他 ● 東京オフィス ● シニアエンジニア制度 ● Slack 導入 ● 社長交代 ● 上場
Slide 86
Slide 86 text
考察
Slide 87
Slide 87 text
フレームワークから見た歴史 ● Hatena ● Hatena2 ● Ridge + DBIx-MoCo ● “薄い”フレームワーク ● Not Only Perl
Slide 88
Slide 88 text
フレームワークは何をしたのか ● サービス開発を加速する ○ スピード ○ 量 ● 技術スタックを規定する ○ Apache ○ Perl
Slide 89
Slide 89 text
近代以降のフレームワーク ● 設計指針 ● サービス開発の枠組みとして共有
Slide 90
Slide 90 text
フレームワークをもたらしたもの ● 明示的 ○ コード(社内・OSS) ○ 日記・プレゼンテーション ● 暗黙的 ○ それまでの経緯 ○ 開発者たちの空気
Slide 91
Slide 91 text
暗黙知と形式知 ● 組織の知識は暗黙知と形式知の 間を行き来しながら発展する ○ 時代の空気とプレゼンテーション
Slide 92
Slide 92 text
歴史とは何か 「歴史とは歴史家と事実との間の 相互作用の不断の過程であり、 現在と過去との間の尽きることを 知らぬ対話なのであります。」
Slide 93
Slide 93 text
歴史を語ること=今を語ること ● 「現在」のもつ文脈は透明 ● 過去から現在を語ることによる相対化 ● 10年後、今を知るための足がかりとして
Slide 94
Slide 94 text
まとめ ● はてなの創業から現在までを回顧 ● 未来に思いを馳せた ● ありがとうYAPC
Slide 95
Slide 95 text
No content