身近な技術的課題から始めるOSSプロジェクト #ヤフー名古屋

599 Views

November 13, 19

スライド概要

2019年11月12日に開催されたヤフー名古屋Tech Meetup #4の内容です。#4 は「OSSコミッターNight」をテーマに開催しました。

profile-image

2023年10月からSpeaker Deckに移行しました。最新情報はこちらをご覧ください。 https://speakerdeck.com/lycorptech_jp

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

(ダウンロード不可)

関連スライド

各ページのテキスト
1.

身近な技術的課題から 始めるOSSプロジェクト Kazuhiro Hayashi (@kazuhiro494949) ヤフー名古屋 Tech Meetup #4

2.

自己紹介 • 名前 • 林和弘 (@kazuhiro494949) • 仕事 • Yahoo! JAPAN iOSアプリ • iOSアプリ黒帯

3.

社外向けのトーク

4.

ヤフーがOSSの文化を積極的に 取り入れているイメージってありますか?

5.

https://github.com/yahoojapan

6.

iOS関連でいうと https://github.com/yahoojapan

7.

日々の業務において • 中で使っているコードにライセンスをつけ て公開メンテナンス、っていうのを意外と やっている • 例えばアプリのβテストツールなど https://www.slideshare.net/techblogyahoo/ss-153336977/

8.

ヤフーはOSS文化に対して かなり寛容

9.

例えば • 日々の開発自体Github上でプルリクエストベースで行う • 世の中にあるOSSはかなり使っている • 有名なOSSに積極的にコミットしている • 自分たちでOSSを1から作って発信している

10.

例えば • 日々の開発自体Github上でプルリクエストベースで行う • 世の中にあるOSSはかなり使っている • 有名なOSSに積極的にコミットしている • 自分たちでOSSを1から作って発信している

11.

日々のサービス開発からどう OSSを作っているか

12.

自分のやり方 • 仕事で発見した技術的課題からOSSプロジェクトを始める • 日々の実務の中で実際に直面した一般的に通じる課題を見つける

13.

自分のやり方 • 会社のプロダクトに使われている OSSとして切り出し コードで世の中の技術的課題を解決 するものは、OSSとして切り出す 既存プロダクト コード

14.

自分のやり方 • 会社のプロダクトから広く世の中に OSSとして導入 個人で作ったコード 通じる技術的課題を発見し、個人で OSSとして作ってフィードバックす る 既存プロダクト

15.

自分のやり方 OSSとして公開 • 社内勉強会のネタとして作って、ウ ケが良かったらOSSとして公開 https://www.irasutoya.com から コード

16.

自分のやり方 • OSSとして開発したら経緯など含め て勉強会などで仕事として発信

17.

いくつかの事例を通じて、具体的に 業務をどうOSS開発へつなげてきたか ご紹介できればと思います

18.

※事例はすべてiOSアプリ 開発の話になります

19.

紹介するプロダクト 1. SwiftXMLParser - スタンダードライブラリが使いにくい 2. PagingKit - 要件に合うライブラリがなかった 3. SwiftUICatalog - 社内向けの教育用資料を公開

20.

SwiftyXMLParser

21.

SwiftyXMLParser • iOSでXMLをパースする場合、XMLParserという組み込 みのクラスを使う • XMLParserはSAX型のパフォーマンスが良いパーサー

22.

単純なXMLでこのくらいのコード量になる (当時Swift 2.3) https://techblog.yahoo.co.jp/advent-calendar-2017/swift̲oss/

23.

このXMLをパースするために https://techblog.yahoo.co.jp/advent-calendar-2017/swift̲oss/

24.

• パースするためのクラスを作る • 探索イベントをメソッドとして実装 https://techblog.yahoo.co.jp/advent-calendar-2017/swift̲oss/

25.

課題 • 2017年当時のYahoo!ショッピングはAPIに XMLが多用されていた • パースのための膨大なコード量を減らしたい • Swift言語で必要十分なライブラリがなかった https://techblog.yahoo.co.jp/advent-calendar-2017/swift̲oss/ より https://commerceapp.yahoo.co.jp/shoppingappli/

26.

https://github.com/yahoojapan/SwiftyXMLParser

27.

SwiftyXMLParser • DOM型のパーサー • 昔からあるライブラリが取り込めていない、新しい言語機能を積極的に 採用 • 軽量でデバッグがしやすいといった、実務での使い勝手に比重を置く

28.

コード量がこのくらいに減らせる (当時Swift 2.3) https://techblog.yahoo.co.jp/advent-calendar-2017/swift̲oss/

29.

• さっきと同じパース処理部分は こんなもん https://techblog.yahoo.co.jp/advent-calendar-2017/swift̲oss/

30.

OSSとして公開 • 特定のアプリ用だったが意外と使い勝手が良かったため、 しばらく運用した後にOSSとして公開 • 言語のバージョンアップ対応やmacOS対応など面倒なメン テナンスもプルリクでもらえる

31.

PagingKit

32.

あるプロダクトのUI を既存ライブラリで開発 • SmartNewsやmercariなどで採用され ている、ページングと横スクロールメ ニューの組み合わせ ※イメージ (実際に関わったプロダクトとは違います)

33.

そのライブラリでは、タイトル文字列と画面の配列を 渡すと、決まったデザインのページングUIが作られる let ary = [ { title: “Page1", view: UIViewController() }, { title: “Page2", view: UIViewController() }, { title: “Page3”, view: UIViewController() }, ] ※イメージ (実際に関わったプロダクトとは違います)

34.

そのライブラリでは、タイトル文字列と画面の配列を 渡すと、決まったデザインのページングUIが作られる let ary = [ { title: “Page1", view: UIViewController() }, { title: “Page2", view: UIViewController() }, { title: “Page3”, view: UIViewController() }, ] メニューがある ※イメージ (実際に関わったプロダクトとは違います)

35.

そのライブラリでは、タイトル文字列と画面の配列を 渡すと、決まったデザインのページングUIが作られる let ary = [ { title: “Page1", view: UIViewController() }, { title: “Page2", view: UIViewController() }, { title: “Page3”, view: UIViewController() }, ] ページング可能な コンテンツ領域がある ※イメージ (実際に関わったプロダクトとは違います)

36.

スタイルもパラメータで渡すことが可能 ※イメージ (実際に関わったプロダクトとは違います)

37.

初期プロダクトの シンプルな要件は満たしていた

38.

しかし要件が少しずつ複雑化していき、 採用したライブラリでは対応しきれなくなる

39.

プロダクトの成長に伴ってUIが細分化され、 こういったことを求められるようになってきた • 例えば • ある画面ではメニューの特定の要素 の上にサブタイトルを付けたい • ある画面ではコンテンツとメニュー の領域間へボタンを並べたい ※イメージ (実際に関わったプロダクトとは違います)

40.

プロダクトの成長に伴ってUIが細分化され、 こういったことを求められるようになってきた • 例えば • ある画面ではメニューの特定の要素 の上にサブタイトルを付けたい • ある画面ではコンテンツとメニュー の領域間へボタンを並べたい ※イメージ (実際に関わったプロダクトとは違います)

41.

UIライブラリに ありがちな課題 • デザインに柔軟性がなく、UIの最適化ができない • この再利用性に関する課題はよくある一般的なものと考える • 解決すれば世の中的な価値が高いため、趣味でこの課題に取り組む

42.

https://github.com/kazuhiro4949/PagingKit

43.

PagingKit • 様々なスタイル・レイ アウトのページングUI を実現可能 • 業務レベルの複雑なUI に適用できる https://github.com/kazuhiro4949/PagingKit

44.

OSSとして公開 • 個人のリポジトリで公開 • OSSにしたあと、業務で開発しているプロダクトへ採用 • 必要な機能の追加など業務としてもメンテナンスしている

45.

• 公開後に開発経緯を勉強会 で(仕事として)発表 https://speakerdeck.com/kazuhiro4949/uiraiburariha-doushe-ji-sarerubekika

46.

SwiftUICatalog

47.

SwiftUI • WWDC 2019で発表されたAppleプ ラットフォーム向け新UIライブラリ • Reactjsを書くようにアプリ開発がで きる https://developer.apple.com/jp/xcode/swiftui/ より

48.

SwiftUI • 発表後、早速1-2ヶ月に1回社内勉強会を開く • 興味を持ってはもらえるが、手を出すまでの敷居が高いこ とを感じる

49.

SwiftUIの課題 • 公式ドキュメントにも十分に実装方法が書かれていない • 公式サンプルのコードがかなり複雑で、初心者にやや敷居が高い

50.

https://github.com/kazuhiro4949/SwiftUICatalog

51.

SwiftUICatalog • 社内のiOSアプリエンジニア向け教育資料として開発 • 実行するだけで各UIコンポーネントの表示や動きを試せる • 最小限の実装と実際の実行結果を網羅

52.

OSSとして公開 • 自社に関わらず役に立つ資料となるため、 社内勉強会で利用後に公開 • ヤフーがやっている社外向け勉強会のネタ の一つとして活用し、好評をもらう https://yj-meetup.connpass.com/event/136285/

53.

自分のやり方再掲 1.会社のプロダクトに使われているコードで世の中の技術的 課題を解決するものは、OSSとして切り出す 2.会社のプロダクトから広く世の中に通じる技術的課題を発 見し、個人でOSSとして作ってフィードバックする 3.社内勉強会のネタとして作って、好評だったら公開 4.OSSとして開発したら経緯など含めて勉強会などで発信

54.

仕事のコードをOSS化する メリット • 始めから切り出すことを意識してクラス設計すると、機能 が明確化されて疎結合なコードが書ける • 普段から汎用的な課題がないか意識することで、個人的に ライブラリを作るきっかけが得られる • 退職した元同僚からプルリクがもらえる • プロダクトのライセンス欄に自分の名前が載る

55.

みなさんも身近な技術的課 題からOSSプロジェクトを 始めてみてください

56.

参考資料 • 身近な技術的課題から始めるOSSプロジェクト • https://techblog.yahoo.co.jp/advent-calendar-2017/ swift̲oss/ • ヤフーのアプリにおける会社全体での業務効率化について #devsumiC • https://www.slideshare.net/techblogyahoo/ss-153336977/ • yahoojapan - Github • https://github.com/yahoojapan