サイボウズ技術者説明会 for students

学生ではないけど、 サイボウズ技術説明会 for students に参加してきた。

『Webアプリケーションをもっと楽しく！ ～フロントエンドのお仕事～』（フロントエンドエンジニア天野祐介）

Kintone

  • ビジネスアプリを簡単に作れるWebアプリ
  • コンセプトはファストシステム
    • D&Dで簡単に作れる
    • 貯めたデータをグラフ表示できたりする

フロントエンジニアって?

  • サイボウズにそういう肩書きはない
  • kintoneの時にフロントエンジニアに注力しだした

Kintoneとフロントエンジニアの歴史

  • JavaScriptをフルに使った開発
  • UI実装はamachangと@yo_wakaが担当
  • 2ヶ月後にamachangが退職したので、2人でUI実装
2011年
  • パラダイムシフト
  • モダンフロントエンド開発時代へ

問題点1

  • 300ファイルぐらいロードしてたのをClosure Compilerを使って圧縮するようになった
  • 3段階の圧縮レベルがあって、advancedに対応したコードにしてる。

問題点2

  • JavaScriptのユニットテストをどうするのか問題に
  • PhantomJSをつかってテストの仕組みを実装して動かせるようにした。

問題点3

  • 何かIEで重い
  • メモリリークが発生してたので、コーディングルール的にそれを潰すせるようになった

問題点4

  • コードの凡ミスを減らすようにしたい
  • JSLintではなく、Closure Linterを使ってLintをかけるようにした。

問題点5

  • それらをCI
  • Jenkinsでjs周りをLintやPhantomJSでテストするようになった。

問題点6

…

問題点7

  • CSSのファイルが1000行超えると崩壊したので、Sassを使ってメンテするようになった
  • Sass/Compassを利用

2012年

  • 設計も洗練されて、継続的に進化してる
  • モバイル対応などもして行ってる
  • Kintoneは10万行ぐらい

Q&A

新しい知識をどうやって付けていくか?

  • 書籍から学んでいって、世界の流行はWeb上のリソースを探していく

JavaScriptが壊れやすい言語なのはどうして?

  • JavaScriptは型がない言語なので、やりたい放題できてしまう
  • チームで書くと、自分の意図通り動かない場合が出てきてしまうので、大規模でやるほど思い通りにできない

『iPhone/Android アプリをまとめて省エネ開発する技術』（サイボウズLiveエンジニア柴田一帆）

サイボウズLive – コラボレーションツール

サイボウズLiveのiPhone/Androidアプリ

  • iOS 25000人
  • Android 15000人

iPhoneとAndroidは五分五分のシェア

  • iPhoneアプリの33%はAndroidアプリとしても利用できる

  • iPhone 

    <ul style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 2em; padding: 0px;">
  <li style="margin-top: 0.5em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding: 0px;">
    XCode
  </li>
  <li style="margin-top: 0.5em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding: 0px;">
    iOS SDK
  </li>
</ul>

  • Android 

    <ul style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 2em; padding: 0px;">
  <li style="margin-top: 0.5em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding: 0px;">
    Eclipse
  </li>
  <li style="margin-top: 0.5em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding: 0px;">
    Android　SDK
  </li>
</ul>

  • それぞれでバラバラ、コスト高 

    <ul style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 2em; padding: 0px;">
  <li style="margin-top: 0.5em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding: 0px;">
    学習コスト
  </li>
  <li style="margin-top: 0.5em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding: 0px;">
    開発コスト
  </li>
  <li style="margin-top: 0.5em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding: 0px;">
    メンテナンスコスト
  </li>
</ul>
  • iPhone/Androidでまとめて開発する

まとめて開発するには

  • 大きく分けて2津の方法
    • SDKを使わない方法
      • PhoneGap 
      •   <li style="margin-top: 0.5em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding: 0px;">
    SKDを呼び分ける方法 <ul style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 2em; padding: 0px;">
      <li style="margin-top: 0.5em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding: 0px;">
        Titanium
      </li>
      <li style="margin-top: 0.5em; margin-right: 0px; margin-bottom: 0.5em; margin-left: 0px; padding: 0px;">
        JavaScriptで実装
      </li>
    </ul>
  </li>
</ul>
    • ケースバイケースで使い分ける

    Titanium Mobile

    • iPhoneとAndroid ワンソース
    • でもハードウェアボタンなどの違いからメニューに若干違いある
    • Titaniumで自動的やってくれる部分もある
    • コードによって、違和感無いようにかき分ける場合

    Titaniumの辛い所

    • バットノウハウが多い
    • ドキュメントがあんまり整ってなかった
    • 「Titaniumで開発することはTitaniumをハックすること」

    例

    • XMLをパースする所で落ちまくる

    Q&A

    iPhone/Android で同時開発する時Titanium/PhoneGapを検討する時に、どこらへんまでやって検討したのか?

    • 実際にプロトタイプ的な簡単なアプリを作って確認したか

    • 学習コストについてはそこまで真剣に考えてない

    『プログラマ 35 歳定年説を 38 歳の自称プログラマが徹底検証！』（リードプログラマー山本泰宇）

    小5で捨てられるMSX2さん…

    大学時代

    1. Pascal マージソートで挫折
    2. 周囲とのレベル差
    3. C++を覚えたことにされるOSの授業
    4. スレッドで挫折/Schemeは実用に向かないと思い知る

    大学院時代

    1. 分散GCの研究,1ヶ月デバッグしても動かなかった
    2. C/C++、アセンブリ、Javaなどを覚えていった
    3. 研究…
    4. サイボウズへ

    社会人時代

    1. 組み込みDBを常駐型に変える仕事で挫折/グループウェアを作る
    2. MySQLのOEM契約/外国人との交渉
    3. …
    4. 開発部長 => 忙しい
    5. 開発本部長やめて降格、社内ニート
    6. CTOとしてオンプレミス(社内利用)
    7. サイボウズ全体の設計
    8. CTOを返上してプログラマに復帰

    最近

    • ストレージシステム
    • 社内勉強会
    • PKIを利用した二要素認証
      • Windows XPやiOSに対応

    質問

    • Schemeをやらないと単位が取れない

    学生ライトニングトーク

    今日からあなたもGopher! – 上田拓也

    • Go言語について
    • Googleの開発した言語
    • C/C++と同様にネイティブコードに
    • 最近開発されてる言語なのでモダンな機能がある

    型の省略

    型推論があるので、型を省略できる

    n := 100

    • クロージャー
    • 多値を返す関数
    • チャネル
      • チャネルで他の処理をできる
    • golang-ml

    質問

    AppEngine以外にGo言語の使い所

    • 並列化が得意
    • 研究向け

    Go言語を書いていいと思った所

    • 古臭くもモダンな感じ

    おわり

    • Closure Libraryを使って大規模開発してる企業が少ない気がする(他にどこがやってるんだろ?)
    • CSS以外(Closure Stylesheetsさん…)はClosure Library系を使って開発してるとのこと
    • Compassが便利という話
    • カスタムイベント管理、最初は手動だったけど、Closure Libraryのイベント管理みたいなの使ってる。
      • enumみたいに変数になるのでコード補完もできて便利

    メモ

    • Mou