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

課題 • 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

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.

41.

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

42.

https://github.com/kazuhiro4949/PagingKit

https://github.com/kazuhiro4949/PagingKit

43.

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

https://github.com/kazuhiro4949/PagingKit

44.

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

45.

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

https://speakerdeck.com/kazuhiro4949/uiraiburariha-doushe-ji-sarerubekika

46.

SwiftUICatalog

47.

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

https://developer.apple.com/jp/xcode/swiftui/

48.

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

49.

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

50.

https://github.com/kazuhiro4949/SwiftUICatalog

https://github.com/kazuhiro4949/SwiftUICatalog

51.

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

52.

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

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