Hatena::ブログ(Diary)

techlog RSSフィード

理解というものは、つねに誤解の総体に過ぎない
 「スプートニクの恋人」とか「かえるくん、東京を救う 」より

こちらになりました → http://sadah.hatenablog.com/

2013-04-30

[][]福島でHTML5について話してきた

html5jの遠征で福島に行ってきた。「HTML5ではないサイトをHTML5へ」というタイトルでお話させていただいた。


HTML5ではないサイトをHTML5

僕の資料はこちら。九州やHTML5とか勉強会で話した内容を最新化したもの。


仕事でやってるサービスは、ちょっと前まではHTML5じゃなかったけど、いろいろやってHTML5化しているところ。それについていろいろ話させてもらった。

試行錯誤中で、まだまだ道半ばだけど、とにかく一歩は踏み出している。


写真とか

一眼持って行かなかったから画質が悪いけど、雰囲気は伝わるかなと。


f:id:j7400157:20130420101838j:image:w640

みんなで記念撮影。


f:id:j7400157:20130420154344j:image:w640

自分のセッションが終わって、パネルディスカッションが残っているにも関わらず飲み始める。


f:id:j7400157:20130420190010j:image:w640

懇親会!美味しかった。


f:id:j7400157:20130430004251j:image:w640

懇親会からのラーメン。味噌にんにく!背景にカエルさんが。


f:id:j7400157:20130430004244j:image:w640

どうしてこうなった。行きの新幹線では桜が見えたけど、帰りは一面雪景色でびっくりした。


まとめ

参加者全員が自己紹介をする時間があって、ちょっとびっくりした。でも、これすごくよかった。マイクが回ってきて、みんなその場で立って簡単な自己紹介をする。

初参加が4割くらいいるって聞いていたけど、みんな乗りがよくて自己紹介が楽しかった。

おやつタイムでは美味しい豆大福をいただいた。お弁当でお腹いっぱいだったけど、食べてしまった。


僕のセッションは1月に作った資料をベースに、その都度ブラッシュアップしたり、最新化したり、内容を削ったり、増やしたりしてる。今回はけっこう削ったつもりだったけど、30分の持ち時間を7分もオーバーして、それに気付きつつ平然と話してしまった。ごめんなさい。けっこう反省しています。


自分が話したいことではなく、相手が聞きたいと思うようなことを意識して、なるべく伝えることを最大化したいと思って話した。

うまくいったかわからないけど、終わったあとにかわいい女の子がとても参考になりましたと言ってくれたので、すべてオーケー :)


やっぱり遠征は楽しい。また機会があれば、いろいろなところに行きたい。

2013-04-29

[][]2ヶ月まえに、九州と第36回HTML5とか勉強会で話したこと

あまりにも、時間が経ってしまったけど、いちおう記録として。

九州

2013/2/9 - 2013/2/10に九州に行ってきた。

HTML5 Carnival FukuokaHTML5カンファレンス 宮崎 に、html5j スタッフ & スピーカーとして参加した。


僕の資料はこちら。


こっちにも書かせていただきました。

この遠征に同行できて、発表できたのは、ほんとうによかった。いろいろ大きな意味を持つ出来事だった。

東京では何度か発表していたけど、それとは全然違う場だった。アウェーってこんなにも違うのか、ということを実感できた。もっと具体的に書きたいけど、書き始めると終わらないくらい長くなってしまって終わらないので割愛。

関係ないけど、iBooks Authorのプレゼンや、githubのエントリを通じて、僕のことを知っている人がいて感動した。

なにかしらのアウトプットしてると、いいことあるね。


第36回 HTML5とか勉強会

2013/2/18の第36回 HTML5とか勉強会で話してきた。

資料はこちら。九州での資料にいろいろ手を加えたもの。基本的な構成は同じだけど、中身はけっこう変えたつもり。

HTML5とか勉強会で話すのは久しぶりだった。1年ぶりくらい。

さっくるが素敵な記事にまとめてくれてる。


まとめ

もっと早くエントリを書きたかったけど、燃え尽きてたり、疲れ果ててたりして無理だった。

やっぱり泊まりで一緒に行動すると、仲良くなれる気がする。あるいは一緒に空港のベンチで切羽詰まってスライドを作っていると、仲良くなれる気がする。たぶん。他の講演者の方々ともいろいろな話ができてよかった。

2013-02-02

[][][]JavaHTML5 Night で話してきた

f:id:j7400157:20130131205540j:image

JavaHTML5 Nigtht で「JavaHTML5のこれまで」と「WebSocket概要」について話してきた。


Java & HTML5 History

HTMLのスライドはこちら。

1993年からの20年を振り返ってみた。資料作りながら、感慨深い思いだった。JavaHTML5を合わせてみてみると、なかなか楽しかった。

Javaの歴史については、こんなサイトがあった。英語だけど。HTML5でパララックスなサイト。ソースを覗くとbodyにはdivとimgしかなかったw

Java 5 が2004年で、ジェネリクスや拡張forループが入ったのはもう9年前かと。同年WHATWGが発足している。

2011年には、Java SE7がリリースされ、HTML5がLast Working Draftになった。いろいろ動いた年だった。

Java も HTML も停滞していた時期があったけど、いまはどんどん変わっていくので、これからが楽しみ。


WebSocket on Glassfish

HTMLのスライドはこちら。

Glassfishを使ったWebSocketのサンプルをライブコーディングしてきた。あとはnode.jsでのWebSocketのサンプルも紹介した。

/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
package websocket.sample;

import javax.websocket.Session;
import javax.websocket.WebSocketEndpoint;
import javax.websocket.WebSocketMessage;

/**
 *
 * @author sada
 */
@WebSocketEndpoint("/echo")
public class NewClass {
    @WebSocketMessage
    public String echo(String message, Session session){
        return session + " "  + message;
    }
}

これはほぼ最小限のサンプルだと思う。受け取った文字列を返すだけのechoサーバ。

Javaでこれだけ短いコードでWebSocketが使えるって、なかなかすごい。


<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
        <script>
            $(function(){
                var host = "ws://localhost:8080/WebApplication3/echo";
                var socket = new WebSocket(host);
            
                socket.onmessage = function(message){
                    console.log(message.data);
                }
                $("#sendBtn").on("click",function(){
                    message = $("#message").val()
                    socket.send(message);
                });
            });
        </script> 
    </head>
    <body>
        <h1>Hello World!</h1>
        <input type="text" id="message" />
        <button id="sendBtn">send</button>
    </body>
</html>

細かいことはこっちに書いた。

これまでもTomcatやJettyでWebSocketを仕えたけど、こうやってアノテーションベースで書けるとすごく便利。そもそもこのコードはServletでさえないし。

JavaでWebSocketのクライアントも書けるから、いろいろ活用できるところは多いと思う。なかなか楽しい。


いろいろ

Node.jsの環境構築とサンプルを動かすまで。(Macのみ)


資料は reveal.js を使って作った。PDF出力もできるので、PDFにしたものをSlideShareに上げている。HTMLの資料もあげたいけど、バギー過ぎるのでとりあえず、PDFで。


まとめ

僕が初めてプログラムを書いたのはJavaだった。大学に入ってから、授業で書いた。それから10年以上ずっとJavaを使っていた。仕事だけじゃなく、趣味としてもJavaを書いていた。

Java Hot Topicには何回も参加したし、ここでもJavaのことをいろいろ書いていた。

いまはJavaを書いてないけど、今回の勉強会のために書いてみて、Javaも変わっていってるんだ、ということを感じた。

Javaを使わなくなってから、まさかこんなふうに話をする機会があるとは思わなかった。嬉しかったし、とても光栄なことだった。エンジニアをやっていると、いろいろなところで繋がるな、と。


自分より詳しい人がたくさんいて緊張した。でも懇親会で楽しそうに話してましたねって言われて、それが嬉しかった。話している技術の楽しさが伝わるといいなと思ってやっていたので。

2013-01-30

[][]GitHub創設者が語る"立ち上げから利用者300万人までの軌跡" に行ってきた。

f:id:j7400157:20130131001925p:image:w640


GitHub創設者が語る"立ち上げから利用者300万人までの軌跡" に行ってきた。

togetterはこちら。


印象に残ったことだけピックアップして書く。


f:id:j7400157:20130130213357j:image


立ち上げから利用者300万人までの軌跡

  • PJ Hyett(Github, Inc. COO)
  • Scott Chacon (Github, Inc. CIO)

Err the blog

クリスと一緒に立ち上げたブログ。これを通じてRubyコミュニティのなかでは有名になった。


大企業が嫌で Err Free というRubyのコンサルをやる会社を起こした。でもコンサルはクライントが上司になるようなものだった。

dogtimeという犬向けのソーシャル・ネットワークを作った。クライアントはよかったが、あまり犬向けのSNSを作る気になれなかった。


f:id:j7400157:20130130213845j:image


自分たちで初めて作ったプロダクトは famspam。家族向けのMLみたいなもの。楽しかったけどお金にならなかった。


SF Ruby Meetupを楽しみにしていた。Rubyについて語りバーでお酒を飲む。バーでトムに出会った。デザイナもしていた。

ここでgithubのアイディアもでてきた。一番重要なアイディアはforkだった。当時はforkはネガティブなイメージがあった。あまりメンテナンスされないものを、誰かがフォークして続けるといった感じ。forkをポジティブなものにしたかった。


Githubは自分たちが使いたくて作った。最初は Logical Awasome という会社で、githubはプロダクトのひとつのつもりだった。


f:id:j7400157:20130130215156j:image


あるときユーザがお金を払いたいといった。EngineYard。人件費の次にホスティング費用がかかるEngineYardがスポンサーに。ロゴを出すことで、無料でホスティングしてもらった。


最初はサインアップもできなかった。メールをもらってDBに手動でユーザを作る。beta invatesは10人招待できる。招待された人も10人を招待できる。バイラルに広まり、ゆっくりと進められた。

最初はサインアップもできなかった。メールをもらってDBに手動でユーザを作っていた。その後、beta invatesでは10人招待できた。招待された人も10人を招待できる。バイラルに広まり、ゆっくりと進められた。

(thanks id:pullphone)


最初の2年間はオフィスがなかった。onlineでコミュニケーションを密にとる。CampFireとGithubで進めた。自分たちで改善すれば、自分たちの作業効率があがる。


f:id:j7400157:20130130215313j:image


Public launch 2008/04/10。スムーズにいった。Ruby on Rails も当日に GitHub に。リリース後はみんなでバーで乾杯した。


MeetupをしていたがDrinkupになり、Drinkupを通じてスコットを採用した。Gitの知識がものすごい。毎週異なる言語でGitを書き換えたり。


Githubは多少利益をあげていたけど、充分な給料が払えなかった。でも毎月売上目標を立てて進めて、1年くらいでコンサル時代と同じくらいの給与になった。ローンチと同じくらい嬉しかった。


f:id:j7400157:20130131001906j:image


QA

社員を解雇していない。採用するときは何回くらい面接してるの、どんな面接?

辞めてないのは嬉しいことだけど、そこにフォーカスしているわけじゃない。信頼しているひとからの紹介を信じている。いいひとがはいると、そこからまたいいひとが紹介される。採用プロセスは特に決まっていない、そのひとのことを知ることにフォーカスしている。


githubは採用時に社員がその人を採用するか投票する。 +1 -1 +100がある。+100は投票した人がメンターとなって責任をとって育てる。


60-70%がリモートで作業しているとあったが、どうやってるの?

もともとonlineからはじまった。f2fのミーティングがない。出社することも必須じゃない。すべてonlineでやっている。


f:id:j7400157:20130130215911j:image


githubにユーザが集まったきっかけは?

面白いプロジェクトがサービスに載った。YouTubeは面白い動画があると拡散する。YouTubeを見たいのではなく、動画を見たい。それと同じような感じ。


Githubはどんなふうにマネージメントしている?

マネージメントはオープンソースと同じやりかた。好きなときに、どこからでも関わることができる。みんなで決めて進めていく。だれかが一方的にきめたりするわけじゃない。オープンソースのやり方で、githubのマネージメントしている。自分たちが働きたい環境を、自分たちで作る。


f:id:j7400157:20130130214159j:image


まとめ

テクニカルな話はあまりなかったけど、とてもおもしろかった。オープンソースと同じように仕事を進めるって、全然思いつかなかった。成り立つ気がするけど、自分ではなかなかできない。でも世界はそれでけっこう成り立っている。すごい。

多くの+1がもらえるのも嬉しいけど、+100 されるようなひとになりたい、と思った。


thanks @, @, mariko.

2013-01-14

[][]東京Ruby会議10 #tkrk10 #p4d

東京Ruby会議10

東京Ruby会議10に行ってきた。Rubyのイベントや勉強会は初めて参加した。

初日の午後は「Rubyistのためのデザイン講座」にずっと参加していたので、Rubyっぽい話は午前中だけ聞いた。

2日目は眠くて起きれなくて、基調講演は聞かずに11時頃行った。雪で14時終了になってしまったけど。

聞いたセッションはこんな感じ。

タイトルスピーカー
Rubyと過ごした半年間井原正博さん @
やさしいRails勉強会@東京のつづけ方@
趣味とRubyと私 生井智司@
プログラミング未経験なんて怖くない!田垣亜季さん @
周囲の助けを得ながら楽しく開発するためのアレコレ蓮尾高志さん @
RailsエンジニアのためのTwitter Bootstrapカスタマイズ例@
少ない手間と知識で "それなり" に見せる、ズルいデザインテクニック@
ノンデザイナーのための配色理論@
オトナの塗り絵で学ぶデザイン
Ruby、RoRでのオフショア開発をハノイで行ってみたら・・・本間紀史さん @
東京にきて僕が作ったものについてJun Fukayaさん @
Sole Rubyist's Fight@
ブログのススメ前島真一さん @

初日の Togetter はこちら。まとめてくださってありがとうございます。


Rubyと過ごした半年間

井原さんがみんなのカフェを作った時のお話。いいお話だった。

開発するにあたって、Ruby on Rails Guides/ Rails Tutorial / Code School / RailsCasts などで最近の技術を勉強しなおした。そのあと実際に開発して、9/21 に rails new して、10/15 にリリースしたとのこと。

企画開発運用を一人でやっていたので、一人Pivotal、一人Pull Request、一人CIしているそう。

スライドにこの言葉があって、ほんとうにそうだよなと思った。コード書けるなら、いろんなことができる。

What a wonderful world.

「やりたいことをやりましょう」、「life is short.」という言葉も印象的だった。


やさしいRails勉強会@東京のつづけ方

最近のrails勉強会はこんな感じとのこと。

  • 参加者は10-20人
  • テーマはその日に決める
  • 2-3つのテーマについて話し合う

気をつけていることで、「何か話して帰って欲しい」というのがあった。僕もHTML5とか勉強会のスタッフをしていて、いろいろ考える。参加者の交流が増えるといいよね。

長く続けた問題点として、「開催することが目的化してきた」ということが挙げれられていた。そして楽しく続けるために「自分のしたいことをする」ということが挙げられていた。ほかにもいろいろ挙げられていたけど、この2つは共感する。

楽しんで勉強して帰ってもらいたいけど、そもそも自分が楽しめないと続けられないよね。僕も楽しみながら、続けて行きたい。

直近の勉強会は予定が合わないけど、Rails勉強会に行ってみたい。


趣味とRubyと私

趣味での開発手法として、FDD(不満駆動開発)について説明があった。不満に思ったことを解決するために開発、これができなかったら死んじゃく!><くらいの気持ちでやる。いいね。

地域Rubyコミュニティに参加して、Rubyでできた繋がりについても話があった。僕もこれからはRubyコミュニティに参加しようと思った。

参加したときは、よろしくお願いいたします。

資料はこちら。


プログラミング未経験なんて怖くない!

いまの僕に、とっても響いたセッションだった。

プログラミング未経験で、どのようにやってきたかということで、以下の3点を挙げられていた。

  • 真似する
  • 形から入る
  • 途中経過を見せる

「真似する」では「 永和のmasterには変なコードがない」という話があって、正直すごいなと思ったし、うらやましい。別にうちもそこまでひどいわけじゃないけど。

真似してると、自然とソースコードをたくさん読むから、既存のコードの理解に繋がる、いろいろな書き方があることを知る、といった話があって、そうだよな、と頷いた。

「形から入る」では、わからないけどやっていると、そのうち分かる瞬間が来て、わかった時にはやり方に慣れている、という話があって、こちらもとても共感した。

たぶん、こちらの記事のセッションをバージョンアップしたお話だと思う。


周囲の助けを得ながら楽しく開発するためのアレコレ

やっぱり周りを巻き込んでいくのは大事だな、と思った。アレコレは以下の4つにまとめられていた。

  • 作業環境を手軽にシェア
  • 開発環境を手軽に入手
  • メンバーの得意分野を見える化
  • 自分の状況を見える化

最初はちょっと固そうな感じだったけど、最後は「フリスク状のデバイスで脈拍をさりげなく計測し、Caps LockのLEDにさりげなく表示する」という内容で、会場は笑いと拍手に包まれた。

こういったことに、楽しく取り組んでいくって大切だよな、と思った。ちょっと環境が変わるだけで、ほかのメンバーが何をやっているのかわからなくなってしまったりするし。

資料はこちら。


RailsエンジニアのためのTwitter Bootstrapカスタマイズ例

ここからデザイン講座のセッション。このデザイン講座のセッションは、どれも自分の興味があるテーマだったのでとても面白かった。

色は、こんな感じで設定するみたい。でもこれが決められない。

  • ベースカラー(70%) → 地味な色
  • メインカラー(20%) → 好きな色
  • アクセントカラー(5%) → 目立つ色

そこで、好きな色を選んで、Sassの lighten や darken を使って色を決めたり、Sassの機能で補色(complement)を求めたりする方法が紹介されていた。

システマティックでいい。あと「色も設定より規約」という言葉が響いた。そのあとのherounitについての内容もわかりやすくて参考になった。

第一回 プログラマ向けデザイン勉強会のものだけど、資料はこちら。


少ない手間と知識で "それなり" に見せる、ズルいデザインテクニック

以前資料は見ていたんだけど、CSS力が低くてよくわからなかった。でもセッションで説明してもらって、半分くらいわかった。でも半分くらいはやっぱりCSS力が足りなかった><

でも、わかんなくても、使ってみれば使えそうな気がした。細かいことは考えずに。

ズルい線、ズルい text-shadow、ズルい背景、ズルい角丸、あたりは使えそう。比較的簡単そうなので。

こうしちゃうと素人っぽくなる、っていうのが分かってよかった。例えば角丸の丸の半径が大きいと野暮ったくなりがち、とか。

第一回 プログラマ向けデザイン勉強会のものだけど、資料はこちら。


ノンデザイナーのための配色理論

配色はさっぱりわからない。セッションを聴いて、なんでわからないのかやっとわかった。自由度が高すぎてわからないんだとわかった。

こちらも以前資料は見ていたけど、背景知識が足りなすぎてよくわからなかった。セッションで説明を聴いて、いろいろ理解できて楽しかった。

理論を説明してもらえたのはよかったけど、それ以上に色を選んでいく過程を生で見れたのがよかった。ある程度は理論だって説明できるけど、やっぱり経験によるものも大きい。僕は色を選ぶという経験自体がほとんどなかったので、ささっと選んでいくところが見れて面白かった。

第一回 プログラマ向けデザイン勉強会のものだけど、資料はこちら。


オトナの塗り絵で学ぶデザイン

すごく楽しかった実習。サンプルはJavaScriptで見出しや背景色や文字色を変えられる。いくつか選べる色があって、それを選んで配色を試してみるという実習だった。

30分くらい配色を試すということで、けっこう長いなと思っていたけど、あっという間だった。

僕は勝手にこんなことを学んだ。

  • 面積の広いところに調和の取れやすい色をいれていくとやりやすい
  • 中間色を背景色にすると、コントラストが出しにくくなるので、きもくなる
  • 色を増やさないって大事。ついつい新しい色を入れようとしてしまう

文章にするのは難しいけど、いろいろなコメントがでてきて、ほんとうに面白かった。デザイナさんがどんなふうに考えているのか、ちょっとだけ知ることができた。

サンプルはこちら。


Ruby、RoRでのオフショア開発をハノイで行ってみたら・・・

Rubyでオフショアって、はじめて聞いた。でもなんだかか楽しそうだった。

ハノイでエンジニアを採用して、教育して、仕事を回していく。ベトナムでは転職は多いみたいだけど、Rubyをやったら楽しくてJavaに戻らないし、他にRubyをやってる企業が少ないので、人材の流出を止められるという話が印象的だった。

僕は仕事でRubyを書いてるけど、日本でもRubyをがりごり書く会社って少ないし。


東京にきて僕が作ったものについて

「PHPで関数を使ってはいけないというコーディング規約で開発」していた会社からフリーランスになったかたのお話。どうやってPHPで開発していたのか気になる。

毎週勉強会を開いているそう。毎週って、すごい。続けるためのポイントとして挙げられていた、「頑張り過ぎない」というのは本当に大切だと思う。さっきも書いたけど、まずは自分が楽しくないと続かない。

勉強会は、行くのもいいけど開くのもいいよね。


Sole Rubyist's Fight

Qiitaを一人で開発されていて、そのお話。僕も一人で開発することが何度かあったけど、ちょっと寂しいし、辛い。

ハッカソンはバックグラウンドがことなるエンジニアと交流できるのでおすすめとあったけど、ハッカソン行ったことないので行ってみたい。でも人見知りでちょっと怖いので頑張って勇気をだして。

資料はこちら。


ブログのススメ

ブログ書くと、いいことあるよね。というお話。もちろんあるし、僕もブログ書きました。

ブログ書いていなかったら、いまこんなところにいなかったと思う。やり方は人それぞれだけど、自分にあった続け方を見つけることが大切だと思う。

資料やエントリはこちら。



まとめ

初めて参加したRuby会議、いろいろあったけどすごく楽しかった。でも知らない人とはあまり話せなかったので、これからはもうちょっと積極的になりたい。と思って早5年って感じだけど。ちょっとずつ。

二日目は豪雪のため14時に終了となったけど、そう判断してくださったスタッフの方々に感謝。ちゃんと帰れました。


Rubyをまともに書き始めて約半年。これからもっと積極的に関わっていきたい。