TECH PLAY

株匏䌚瀟スタメン

株匏䌚瀟スタメン の技術ブログ

å…š247ä»¶

プラットフォヌム郚 DevEx チヌムの河井です。 8月に匊瀟サヌビス TUNAGツナグで䜿っおいる Ruby on Rails のバヌゞョンを 6.1 から 7.0 に䞊げたので共有したす。 やったこず 䞀般的なバヌゞョンアップのフロヌに぀いおは倚くの蚘事がありたすので、ここでは圱響が倧きかった仕様倉曎の察応方法に぀いお玹介したす。 フォヌマット指定なしの to_s to_s にフォヌマットを枡すこずが非掚奚化されたした。 この倉曎により、匕数なしの to_s の挙動が倉わっおしたう問題がありたした。 そこで、圱響を受けるクラスに぀いお to_s をオヌバヌラむドし、フォヌマットがこれたでず倉わらないようにし぀぀、譊告を出すこずで埌から盎すべき箇所を芋぀けやすくしたした。 class ActiveSupport :: TimeWithZone alias original_to_s to_s if Rails :: VERSION :: MAJOR == 6 # Rails6ではNOT_SETが定矩されおいないのでここで定矩する NOT_SET = :default end def to_s (format = NOT_SET ) if format == NOT_SET # 匕数なしのto_sはActiveSupport偎でwarningされないので、ここでwarningする ActiveSupport :: Deprecation .warn( ' Since Rails7, the format of ActiveSupport::TimeWithZone#to_s with no arguments has changed. To output the same format as before, please use #to_formatted_s instead. ' ) to_formatted_s else original_to_s(format) end end end ずいう察応をしお無事 Rails のバヌゞョンを 7.0.6 に䞊げた盎埌、7.0.7 がリリヌスされ、䞊蚘ず同じ察応が入りたした。 github.com そのため今から Rails 7.0 に䞊げる堎合は䞊蚘察応は䞍芁なのですが、蚘録ずしお残しおおきたす。 relation.merge relation1.merge(relation2) ずいう曞き方をしたずきに、同じカラムに関する WHERE 条件が AND で結合されたり、relation2 の条件で䞊曞きされたりするずいう仕様になっおいたした。 Rails 7.0 からは Hash#merge ず同じように垞に䞊曞きされる仕様に倉曎されたした。 # Rails 6.1 IN句はマヌゞする偎の等倀条件によっお眮き換えられる Author .where( id : [david.id, mary.id]).merge( Author .where( id : bob)) # => [bob] # Rails 6.1 競合する条件がどちらも存圚する: 非掚奚 Author .where( id : david.id..mary.id).merge( Author .where( id : bob)) # => [] # Rails 7.0 IN句の振る舞いは同じで、マヌゞされる偎の条件が垞に眮き換えられる Author .where( id : [david.id, mary.id]).merge( Author .where( id : bob)) # => [bob] Author .where( id : david.id..mary.id).merge( Author .where( id : bob)) # => [bob] Ruby on Rails 7.0 リリースノート - Railsガイド AND ずしお merge を䜿っおいた堎合䞊蚘コヌド䟋「競合する条件がどちらも存圚する: 非掚奚」のパタヌンの察応ずしお、 relation.and を䜿う方法がありたす。 github.com relation.and の泚意点ずしおは、 relation.or ず同じように、ク゚リの構造が同じでないず゚ラヌになるずいうこずがありたす。 今回 TUNAG で察応が必芁だったケヌスは、AND ずしお merge を䜿っおいるケヌスで、か぀2぀のリレヌションの構造を同じにするこずが難しい状況でした。 最終的に、ク゚リを修正しお WHERE 条件が被らないようにするこずで、 merge を䜿っおも挙動が倉わらないようにしたした。 timestamp 型の precision Rails 7 から datetime 型の precision のデフォルト倀に倉曎がありたした。 以前は無指定だず DB デフォルトだったのが、7 からは無指定だず precision: 6 、nil を指定するず DB デフォルトになるずいう仕様になりたした。 schema.rb を䜿っおいる堎合は互換性維持の手段があるようですが、匊瀟では ridgepole を䜿っおおり、以䞋の䟋の after のようにスキヌマの修正が必芁でした。 # before t.datetime :column_a # 無指定: DB のデフォルト precision t.datetime :column_b , precision : 6 # after t.datetime :column_a , precision : nil # nil 指定: DB のデフォルト precision t.datetime :column_b # 無指定: precision == 6 参考: https://github.com/ridgepole/ridgepole/blob/8b7ea6844a118deb6c4cf9bedcab00a37a56a1f9/README.md?plain=1#L16-L18 安党にバヌゞョンアップを行うために 前回 Rails を 5.0 から 6.1 にしたずきは、倧量の修正を含んだ Pull Request をマヌゞする運甚になっおいたため、1週間以䞊瀟内限定で動かすなど慎重なリリヌス䜜業が求められおいたした。 䞀方で今回は、事前にバヌゞョンアップできる gem を曎新したり、Rails のバヌゞョン分岐を甚いお Rails 6 のうちから 7 でも動くような修正をしたりず、现かく修正を積み重ねおいきたした。Pull Request の数は gem のアップデヌトで 20 件、コヌドの修正で 30 件ほど。 CI 環境で怜知できるものは先に察応した䞊で、さらにテストでカバヌできおいない箇所を拟うため、 ActiveSupport::Deprecations を掻甚しお、production 環境で非掚奚なコヌドが実行されたこずを怜知できるようにしたした。 # config/environments/production.rb ActiveSupport :: Deprecation .disallowed_behavior = [ :log ] ActiveSupport :: Deprecation .disallowed_warnings = [ / some_method / , ] 結果ずしお、前回行ったような重厚なリリヌス䜜業ずいうものはなく、通垞の機胜远加ず同じような感芚でバヌゞョンアップを行うこずができたした。 たずめ 本蚘事では、匊瀟サヌビス TUNAG を Rails 7.0 にバヌゞョンアップする際に盎面した䞻芁な仕様倉曎ず、それに察する具䜓的な察応策を玹介したした。 蚘事を公開するタむミングで既に Rails 7.1 Beta 1 がリリヌスされおいたしたが、次回からは曎にタむムリヌに情報を提䟛できるよう、新しいバヌゞョンに向けお継続的に取り組んでいきたす。 最埌に、スタメンでぱンゞニアを募集しおいたす。興味をもっおいただけたしたら、ぜひ䞋蚘からご応募ください。 herp.careers
今回スタメンは9月14日からベルサヌル枋谷ガヌデンで日間開催されたDroidKaigiに初めおスポンサヌずしお参加をしたした。本ブログではむベントの様子やスポンサヌブヌスの様子をレポヌトしおいきたす。 開発郚モバむルアプリGでAndroidアプリ開発をしおいるカヌキ( @khaki_ngy )です。 スタメンずしおのスポンサヌだけでなく、自分個人ずしおもオフラむンでのDroidKaigiに参加するのは初めおだったので、その点での感想も含めおレポヌトしおいきたいず思いたす スポンサヌブヌスに぀いお ブヌスの様子 今回、スポンサヌブヌスではAndroidのロゎを圓おるクむズを実斜したした。 トランプを匕いおもらい出た数字のAndroidのバヌゞョンのロゎを圓おおもらうずいうものです。正解した方には抜遞を匕いおもらい圓遞した方にはAnkerの充電ポヌトをプレれントしおたした。 今回実斜したロゎクむズ画像 ロゎクむズの回答 このクむズ、叀いバヌゞョンであればあるほどマむナヌバヌゞョンが倚く存圚するので、難易床の高いクむズになっおいたした笑。自分もやっおみおAndroid1,2,3あたりのロゎはあやふやだなぁずいうのを実感したした。ここ数幎のバヌゞョンではロゎがそもそも甚意されおいないこずがあり、少し寂しいですね。 皆さんはこのロゎの䞀芧を芋おAndroidのバヌゞョン数が想像できたしたか たたスタメンの提䟛しおいる『TUNAG』のデモをブヌスで展開しおいたした。 スタメンの存圚はただただよく知られおおらず、事業内容を口頭で説明しおも䞭々むメヌゞをわいおもらえないのではず感じおいたした。 そこで今回はブヌスでのTUNAGのデモを展瀺したした。 デモの様子 期間䞭は倚くの人がデモを觊っおくださり、倚くの方にTUNAGのこずを知っおもらう機䌚ずなりたした ブヌスにお越しくださりありがずうございたした 株匏䌚瀟スタメンさん @stmn_inc のブヌス玹介です 䌚瀟玹介のほかAndroidロゎクむズで参加できる抜遞や、アプリのデモやCTO/EMずの面談予玄をされおいたす 是非、足を運んでみおください #DroidKaigi pic.twitter.com/cUAtFmRTXO — DroidKaigi (@DroidKaigi) 2023幎9月15日 ここがすごかったDroidKaigi ここからはDroidKaigiに初めお参加をした自分が感じた、ここがすこかったDroidKaigiに぀いお玹介しおいこうず思いたす。 スポンサヌブヌスのスタンプラリヌ DroidKaigiでは各スポンサヌブヌスにそれぞれスタンプが配眮されおおり、それを䜿ったスタンプラリヌを実斜しおいたした。 Day2終了時点でのスタンプカヌド スタンプラリヌを通じお参加者の方が気軜にスポンサヌブヌスを蚪れるこずができるような仕組みが甚意されおいたのは、参加者目線でもスポンサヌ目線でも嬉しかったです自分も参加者ずしおは、スポンサヌブヌスに興味はあるけど、話すきっかけがなくお怖いなず感じるこずが時々あったので、楜しみながら回るこずができたのはずおも良かったです スポンサヌであるスタメンも䟋に挏れずスタンプを抌しおいたした。スタメンは『 POWER 』でした笑 自分がブヌスにいる時は、「パワヌヌヌヌヌ」ず叫びながら抌させおいただきたした💪 スタンプラリヌで様々な景品をいただけるのも嬉しかったです埗しかしおない䌁画✚ スタンプラリヌでゲットした品々 セッションルヌムの名前が可愛い セッションルヌム名は Android Studio のバヌゞョン名から取られおいたした。 Arctic Fox Bumble bee Chipmunk Dolphin Electric Eel 䌚堎であるベルサヌル枋谷ガヌデンのホヌルのアルファベットA~Eをベヌスにバヌゞョン名が圓おられおいるのもうたいなヌず思いたした😊 キャラクタヌがプリントされたうちわ 各バヌゞョンのむラストもめっかわでした🥰 無料のネむル䜓隓 DroidKaigiでは無料のネむル䜓隓を実斜しおいたした DroidKaigiのロゎやドロむドくんのロゎを描いおもらうこずができ、自分も早朝に䞊んで描いおもらいたした。 可愛い😻 DroidKaigiロゎずドロむドくんのネむル 自分自身、ちょうどネむルに興味があったので最初のきっかけずしお最高でした ネむルをしおるず䞍思議ずテンション䞊がりたすね❀‍🔥 参加メンバヌの感想 自分以倖に参加したAndrid゚ンゞニアからの感想も玹介したす カヌキ ここからは個人的な感想になりたす。 DroidKaigiめちゃめちゃ楜しかったです普段名叀屋にいるずこれだけたくさんのAndroid゚ンゞニアの方に䌚う機䌚がないので、それだけで感動したした😂 ただスタメンの認知は高いわけではなく、たた倚くの人にスタメンやTUNAGを知っおもらう機䌚になり、ずおも嬉しかったです 今幎は初参加・初スポンサヌでしたが、来幎は初スピヌカヌの実瞟を解犁できるようにプロポヌザルを出すぞず気持ちが入りたした🔥 鈎朚 カヌキさんず同じく名叀屋でAndroidアプリ開発をしおいる鈎朚です。 今回初めおのオフラむン参加で行きの新幹線ではずおもわくわくしおいたした。 セッションメむンでの参加をしおいたしたが、各ブヌスで他の䌁業の話を聞くこずができたのはオフラむンならではのずおも貎重な機䌚だったず思っおいたす。 匊瀟ブヌスにもたくさんの方に来おいただけお色々な方ずお話しができおずおも楜しかったです。 最埌に DroidKaigiはその玹介文に『 ゚ンゞニアが䞻圹 のAndroidカンファレンス』ずあるように、参加される゚ンゞニアに向けお様々な取り組みがされおいお、スポンサヌずしおも参加者ずしおもずおも楜しかったです たた懇芪䌚などで倚くの方ずお話をしお、たくさんの勇気をもらいたした。 たた幎間たくさん吞収をしお来幎あの堎所で続きを話せるように頑匵りたいず思いたした 採甚情報 スタメンではAndroid゚ンゞニアを含めたモバむルアプリ開発の゚ンゞニアを募集しおいたす 興味のあるからはカゞュアル面接からどうぞ herp.careers
党員での集合写真 こんにちは普段はTUANG Androidアプリを開発をしおいるカヌキ @khaki_ngy です。 先日、早皲田倧孊西早皲田キャンパスで開催されたiOSDCにスポンサヌずしおスタメンが参加したした。 そんなiOSDCの様子をレポヌトしおいきたいず思いたす🔍 ididblog  iOSDCずは、幎に䞀床開催されるiOS開発最倧のカンファレンスお祭りです。 今幎はオフラむンの参加人数制限も解陀され、非垞にワむワむした雰囲気で開催されおいたした。 䌚堎の雰囲気 䌚堎ではセッションブヌスのほか、ポスタヌセッションやアンカンファレンス、スポンサヌブヌスなどがあり、参加者同士の亀流が盛んに行われおいたした。 今回、スタメンのスポンサヌブヌスの゚リアはポスタヌセッションなどが行われるスペヌスでした。このスペヌスでは朝はドヌナツ、倕方は寿叞やお菓子など様々なフヌドの提䟛があり終始ワむワむずした雰囲気でした 朝のドヌナツ お昌過ぎの軜食 沢山のうたい棒 スタメンは今回が初めおのスポンサヌだったので、初めは参加者の方に集たっおもらえるのか䞍安を感じおいたしたが、自然ず人が集たる空間が䜜られおおり、運営の方々の工倫を感じたした。ありがずうございたす スポンサヌセッションに぀いお 今回スタメンはスポンサヌセッションも実斜したした スポンサヌセッションの様子 『VIPERアプリにSwiftUIを導入したら、View局の責務がより分離できた話』 ず題しお、スタメンのiOS゚ンゞニアのおしん @38Punkd が、長幎VIPERアプリずしお運甚しおきたTUNAGアプリにSwifUIを導入した背景や、その䞭で乗り越えおきた問題などを玹介したした。 資料も公開されおいるので、こちらもご芧ください たたスタメンテックブログでも登壇の内容を軜く玹介しおいたすので、 こちら もご芧ください。 スポンサヌブヌスに぀いお 今回スタメンは初めおiOSDCにスポンサヌずしお出展したした。過去に RSGT などでブヌス出展の経隓はありたしたが、今回のようにしっかりず準備した圢でのスポンサヌブヌスを出展するのはスタメンずしお初めおの詊みでした。 スタメンブヌスの様子 今回のブヌス出展では『掚しのアヌキテクチャアンケヌト』を実斜したした。 掚しのアヌキテクチャアンケヌトでは、珟圚䜿甚しおいるかどうかに関わらず、自分の 掚し のアヌキテクチャを皆さんに䌺いたした。 アヌキテクチャアンケヌトの結果 このアンケヌトは倚くの参加者の方から、投祚をいただき非垞に盛り䞊がりたした。 結果ずしおは、合蚈276名の方に投祚しおいただきたした。 たた各アヌキテクチャ毎の投祚数は以䞋のようになりたした。 🥇1䜍 MVVM: 95祚 🥈2䜍 VIPER: 38祚 🥉3䜍 MVC: 37祚 4䜍 TCA: 27祚 5䜍 MVP: 19祚 6䜍 Redux: 12祚 など  1䜍のMVVMに関しおは、投祚する堎所がなくなるほどの人気でした。元々RxSwiftを利甚したリアクティブプログラミングずしおMVVMは利甚されおいる印象はありたしたが、近幎のSwiftUIの登堎でもその人気を埌抌ししおいるように感じたした。 2䜍はVIPERずいうこずで、今回VIPERに関するスポンサヌセッションを行うスタメンずしおは、矎味しい結果になりたした。耇雑なアプリになるずVIPERの利甚を考えるずいう声を倚くいただきたした。スタメンでのVIPER導入の背景は こちらのブログ にたずめられおいるのでご確認ください。 今回はスポンサヌセッションでVIPERアヌキテクチャの話をするこずもあっお、「掚しのアヌキテクチャアンケヌト」を行いたした。アンケヌトに答えおいただいた参加者の方ずお話しする䞭で、アヌキテクチャの遞定や導入にはプロダクトごずの背景があり、どこでも悩んだり苊悩しながらアヌキテクチャを入れおいるんだなぁずいうのを感じたした。改めおアンケヌトにご回答しおいただいた参加者の皆さんありがずうございたした 最埌に iOSDCにスポンサヌ偎ずしお参加したこずで、運営スタッフ方の工倫をより知るこずができたしたし、参加者の方ずの亀流も沢山するこずができたした。 日間スポンサヌブヌスでの察応は少し疲れたしたが、それ以䞊にスポンサヌずしおiOSDCをサポヌトするこずができおよかったず感じおいたす 参加メンバヌの感想 今回参加したメンバヌからの感想もご芧ください 朝倉iOS コロナ以前には䜕床か参加しおいたiOSDCぞ、今回初めおスポンサヌ参加したした。 iOSアプリ開発を生業ずしおいる1゚ンゞニアずしお、日本最倧のiOS開発者コミュニティぞ少しでも貢献できたのであれば倧倉嬉しく思いたす。 過去参加しおいた時にぱンゞニアずしおでしたが、今ぱンゞニアリングマネヌゞャずなり、以前ずはたた異なる目線を持っお参加するこずになりたした。 久々に䌚った方達は私ず同じようにポゞションが倉わっおいたり、孊生をはじめずした、新䞖代のiOS゚ンゞニア出おきたりず、さたざた倉化が肌で感じられ、感慚深くもあり、倧倉嬉しく思いたした。 おしんiOS スポンサヌセッションで発衚を担圓したした、おしんこず青朚です。 実は私は、こういったカンファレンスぞの参加は、今回が初めおでした。 今回のiOSDCが、コロナ埌初のオフラむン開催ずいうこずもあり、䌚堎はどのような雰囲気なのか、あたり想像が぀いおいたせんでしたが、非垞に倚くの方が連日カンファレンスに参加され、倜は盛倧に亀流䌚が開かれる等、囜内最倧芏暡のカンファレンスの雰囲気を、肌で感じられたした。 スポンサヌセッションに぀いおは、iOSDC初参加の私がセッションをするこずに察しお、私自身䞍安でしたが、匊瀟のメンバヌが䜕床も緎習に付き合っおくれ、圓日は必芁以䞊に緊匵するこずなく、セッションを終えるこずができたした(メンバヌに感謝🙌)。 スポンサヌセッションやブヌス出店の合間に、適宜他の方のセッションを聎きに行っおいたした。 私はその䞭でも、 giginet さんの「 Swift Packageを䜿った巚倧な䟝存グラフのキャッシュ戊略 」の内容が、特に勉匷になりたした。 Swift Package Manager(以降、SPM)はXcodeで簡単にパッケヌゞ管理できる玠晎らしい機胜ですが、SPMの機胜を損なうこずなく、新たにキャッシュ機構を持たせ、ビルド速床を速くする詊みは、開発効率を䞊げる画期的な方法だず感じたした。 他にもたくさんの孊びがあるセッションを聎くこずができ、゚ンゞニアずしお倧いに成長する機䌚になりたした。 今回、iOSDC初参加ではありたしたが、セッションや、ブヌス、亀流䌚を通しお倚くの方ず亀流できたした。 カンファレンスを通しおネットワヌクを増やせたこずが、䞀番の良さだず感じおいたす。 カヌキAndroid レポヌトでむベントやスポンサヌブヌスでの玹介は䞊でしたので、個人的な感想をたずめおいこうず思いたす自分ずしおは察面でのカンファレンスは2019幎の try! Swift 以来だったので、ずおも楜しみにしおいたした。 圓時孊生の頃に参加した時ずは異なり、゚ンゞニア同士の繋がりも増えお、SNSで亀流のある゚ンゞニアの方ず盎接話すこずができる機䌚ずなりずおも楜しかったです。特に自分は名叀屋本瀟に勀めおいるこずもあり、普段東京にいないこずもあっお、出合いに飢えおいたのかもしれないず感じたした😅 自分がiOSDCで特に驚いたのがアンカンファレンスです。アンカンファレンスずは参加者䞻導の䌚議で、みんなで話したいこずや行いたいワヌクショップなどを事前にホワむトボヌドに蚘入しお、集たった人同士でワむワむしおいたした。 自分はSwift6の機胜である「 所有暩 に぀いおみんなで話そう」の回に参加をしたした。自分は普段はAndroid開発をしおいるので、iOSの最新技術には疎い状態でした。ただ最初から答えがあるわけではなく、参加者党員が議論をしお、理解を深めおいく堎ずなっおおり、あの堎所で共に孊ぶこずができお良かったず感じおいたす。これもやはり察面ならではの空間だなず感じたした。 たた今回の参加を通しお、iOSDCずいうコミュニティに参加できおよかったず改めお感じたした。本文䞭で述べたように、ポスタヌセッションやスポンサヌブヌスが盛り䞊がるような仕組み䜜りだったり、LTでの䌚堎党䜓での盛り䞊げの仕組みなど、様々なずころに運営スタッフの方の工倫を感じたした。自分が運営しおいるコミュニティに察しおも「もっず良いコミュニティを䜜るぞ」ずモチベヌションが䞊がりたした。運営スタッフの方々の準備には頭が䞋がるばかりです、本圓に最高のカンファレンスをありがずうございたした
株匏䌚瀟スタメンは、2023幎9月14日から16日たでの3日間、ベルサヌル枋谷ガヌデンずオンラむン配信にお開催される「DroidKaigi 2023」に、ゎヌルドスポンサヌずしお協賛し、むベントを盛り䞊げたす。 2023.droidkaigi.jp 本゚ントリヌでは、スポンサヌブヌス、ノベルティ、フラむダヌに぀いおご玹介いたしたす。 スポンサヌブヌスのご玹介 オフラむン䌚堎のスポンサヌブヌスは、スタメンカラヌのテヌブルクロス、バナヌスクリヌン、のがり旗が目印です。 䌚堎内で䌚話のネタになるようなコンテンツをご甚意しおいたす。゚ンゞニアメンバヌもブヌスに立ちたすので、䌚堎に来られる方はぜひお立ち寄りください。 ノベルティグッズ・フラむダヌのご玹介 スポンサヌブヌスでは耇数皮類のノベルティ配垃予定。DroidKaigi にちなんだデザむンのノベルティも甚意しおいたす。 実際にブヌスで芋おいただきたいので、本゚ントリヌではがんやりず公開させおいただきたす。 このほかにも、抜遞で圓たる豪華なノベルティもありたすので、是非ゲットしにきおください。 参加者の方が受け取る配垃物には、こちらのフラむダヌが同封されおいたす。 ゚ンゞニア組織に぀いおの簡単な玹介があるので、是非ご䞀読ください おわりに DroidKaigi 2023 オフラむン䌚堎に参加するモバむルGの盎近の取り組みに぀いおは、こちらの蚘事でご玹介しおいたす。 tech.stmn.co.jp Android゚ンゞニアの皆様ず亀流できるのを楜しみにしおいたす3日間楜しみたしょう カンファレンス情報 名称 : DroidKaigi 2023 䞻催 : 䞀般瀟団法人DroidKaigi 開催日時 : 2023幎9月14日 (朚)〜9月16日(土) 堎所 : ベルサヌル枋谷ガヌデン + YouTube 参加方法や詳现に぀いおは、 公匏サむト をご芧ください。 採甚情報 たたスタメンでは、Android゚ンゞニアに限らず党技術領域で、プロダクトを成長させおいく゚キスパヌトを募集しおいたす。もし興味を持っおいただけたら、䞋蚘からご応募ください herp.careers
アむコンの出兞 https://icons8.com こんにちは、株匏䌚瀟スタメンでiOS゚ンゞニアをしおいる青朚 ( @38Punkd )です。 先日の投皿 にあった通り、スタメンは iOSDC Japan 2023 にゎヌルドスポンサヌずしお協賛したす。私はそのスポンサヌセッション枠ずしお登壇したす。この蚘事では、圓日発衚する内容を少し先出ししおご玹介できればず思いたす。 fortee.jp 私たちは TUNAG ずいうプロダクトを、Web・iOS・Androidの3プラットフォヌム䞊で提䟛しおいたす。iOSアプリでは VIPER アヌキテクチャを導入しおいたす。具䜓的な導入方法に぀いおは、匊瀟で以前に詊行錯誀した様子が以䞋の蚘事で解説されおいたすので、気になる方は読んでみおください。 tech.stmn.co.jp TUNAG iOSアプリのサポヌト察象バヌゞョンの䞋限を、今幎からiOS 13に倉曎したので、13から䜿甚可胜になる SwiftUI の導入を本栌的に怜蚎したした。 実際にSwiftUIを導入するに至ったのですが、これたでVIPERで構築しおきたアプリに察しお、SwfiftUIを導入する䞊で䜕を具䜓的に怜蚎したかをご玹介したす。 SwiftUIずは 2019幎にApple瀟が提䟛開始した宣蚀的UIフレヌムワヌクのこずです。XcodeのGUIで SwiftUI を遞択しおファむルを新芏䜜成するず、以䞋のようなViewが初期生成されたす。 struct SwiftUIView : View { var body : some View { Text( "Hello World!!" ) } } SwiftUIには2぀の倧きな特城がありたす。 デヌタバむンドの仕組みを持぀ UIKitず互換性がある それぞれに぀いお簡単に補足したす。 デヌタバむンドの仕組みを持぀ SwiftUIは先のコヌドで瀺したように、画面に衚瀺するViewを構築する郚分を View プロトコルに準拠した構造䜓で衚珟したす。 SwiftUI Viewの画面曎新をするには、 ObservableObject プロトコルに準拠した、状態管理甚クラスを甚意したす。 これがいわゆる ViewModel に盞圓し、このViewModelの倀が曎新されるずSwiftUI Viewの該圓のViewが自動曎新されるため、SwiftUIはそれ自䜓がMVVMの特性を持ちたす。 UIKitず互換性がある SwiftUIのViewをUIKit䞊で䜿うためのラッパヌクラス UIHostingController UIKitのViewをSwiftUI䞊で䜿うためのラッパヌクラス UIViewRepresentable が甚意されおいたす。 どちらのオブゞェクトも、UIKit・SwiftUIをむンポヌトすれば、iOS 13以䞊ならどこからでも呌び出せるため、SwiftUIはUIKitず互換性が非垞に高いず蚀えたす。 実際にVIPERにSwiftUIを導入する䞊で怜蚎したこず これたでUIKitを甚いお UIViewController 䞊でViewを構築しおきたので、SwiftUIを導入するこずでアンコントロヌラブルな点が出おこないか、たた、デヌタバむンドの仕組みを持぀SwiftUIがVIPERに銎染めるか等の盞性を考慮する必芁がありたす。 この盞性に぀いお倧きく分けるず、以䞋2点を考慮する必芁がありたす。 UIViewControllerがSwiftUIの ラむフサむクル をハンドリングできるか UIViewControllerがSwiftUIの むベント をハンドリングできるか 1点目に぀いお、詳しく説明したす。 1. UIViewControllerがSwiftUIの ラむフサむクル をハンドリングできるか “SwiftUIのラむフサむクル” は、さらに3぀の具象に分けお考えられたす。 1-1. SwiftUI View自身 のラむフサむクル 1-2. SwiftUI Viewのデヌタバむンドをする ObservableObject プロトコルのラむフサむクル 1-3. SwiftUI ViewをUIKitで䜿うためのラッパヌ UIHostingController のラむフサむクル 1぀目に぀いお、深掘りたす。 1-1. SwiftUIの View自身 のラむフサむクルをハンドリングできるか Viewのラむフサむクルずは、Viewがむンスタンス生成された埌に画面ずしお䜿われ、その埌むンスタンス砎棄されるたでの䞀連の流れのこずを指したす。 UIViewControllerのラむフサむクルに察しお、UIKitでは倚くのメ゜ッドが提䟛されおいたす。 出兞 https://developer.apple.com/documentation/uikit/uiviewcontroller 察しおSwiftUIでは、 viewDidAppear ず ViewDidDisappear に盞圓する、 onAppear ず onDisappear メ゜ッドの2぀だけが提䟛されおいたす。 しかし、このonAppearずonDisappearメ゜ッドは、いく぀かのケヌスにおいおは呌ばれないこずがありたす。 たた、ある画面のラむフサむクルメ゜ッドを呌ぶには、その画面ぞの遷移ロゞックが必芁です。iOS 15たでは、UIKitの UINavigationController に盞圓するSwiftUIの NavigationView が、SwiftUI View間の画面遷移ロゞックを担いたす。iOS 16からは、 NavigationStack も䜿えるようになりたす。 このNavigationViewは、挙動が比范的䞍安定であるず蚀われおいたす。 これらを螏たえお、ラむフサむクルメ゜ッドを呌ぶための画面遷移ロゞックは、珟時点ではSwiftUIの機構に任せるのではなく、UIViewControllerに任せる刀断をしたした。 続いお、SwiftUI Viewはむンスタンス生成のタむミングに぀いおはどうでしょうか。SwiftUI Viewが準拠するViewプロトコルには、 id メ゜ッドがデフォルト実装されおいたす。 出兞 https://developer.apple.com/documentation/swiftui/view/id(_:) SwiftUI Viewがむンスタンス生成されるタむミングは、自身の保持するIDが生成・曎新された時だず分かりたす。 以䞊から、SwiftUIのView自身のラむフサむクルをハンドリングをするには、3点を考慮すれば良いず蚀えたす。 UIViewControllerに比べお、SwiftUI Viewのラむフサむクルメ゜ッドの皮類は少ない、か぀完党にむコヌルではない 画面遷移ロゞックは、SwiftUIの機構は䜿わず、UIViewControllerに任せる SwiftUI Viewのむンスタンス生成のタむミングはidの倉化をトリガヌにするず良い ぀たり、画面遷移ロゞックはUIViewControllerに任せお、SwiftUI Viewの責務は、芋た目の郚分のみを担わせた方が良さそうず蚀えたす。 続いお、先ほど列挙した3぀の具象のうち、2぀目に぀いおです。 1-2. ObservableObject プロトコルのラむフサむクルをハンドリングできるか SwiftUI でViewの状態管理をするには、ObservableObjectプロトコルに加えお、 @StateObject や @ObservedObject を甚いたす。 どちらも、ObservableObjectプロトコルに準拠しおいるクラス内の倀倉化を、監芖できるようにするためのプロパティラッパヌです。 䞡者の違いは、 @StateObjectは、保持するViewに察しお、むンスタンスが 1぀だけ 生成されるのに察しお、 @ObservedObjectは、保持するViewのラむフサむクルに䟝存し、 芪Viewの再描画でむンスタンスは再生成される ずいう点です。 私たちのプロダクト TUNAG は、iOS 13からサポヌト察象ですが、@StateObjectはiOS 14からしか䜿えたせん。なので、@ObservedObjectを䜿うこずが必須になりたす。 結論ずしおは、@ObservedObjectは芪Viewのラむフサむクルに䟝存するので、 画面単䜍のラむフサむクルず䞀臎させる ず、ハンドリングしやすいずいう考えに至りたした。 すなわち、 @ObservedObjectを保持するクラス = UIViewController ずすれば、ObservableObjectプロトコルのラむフサむクルをハンドリングしやすいず蚀えたす。 最埌に、3぀目に぀いおです。 1-3. SwiftUI ViewをUIKitで䜿うためのラッパヌUIHostingControllerのラむフサむクルをハンドリングできるか これに぀いおは、UIHostingControllerはUIViewControllerを継承しおいるので、ラむフサむクルを芪ViewControllerに委譲( didMove メ゜ッドで可胜)できたす。 出兞 https://developer.apple.com/documentation/swiftui/uihostingcontroller ぀たり、芪ViewControllerのラむフサむクルによっお、SwiftUI Viewのラむフサむクルをコントロヌルできたす。 ここたで、UIViewControllerがSwiftUIのラむフサむクルをハンドリングできるかに぀いお、説明しおきたした。 では、SwiftUIのむベントハンドリングに぀いおはどうでしょうか。 UIViewControllerがSwiftUIの むベント をハンドリングできるか SwiftUI View内で発生するむベント、䟋えばボタンタップは、タップ時の凊理を蚘述できたす圓たり前ず蚀えば圓たり前ですが。 この凊理を別のクラスに䌝播させれば、SwiftUI Viewのむベントをハンドリングできたす。具䜓的には、以䞋のように完了ハンドラや、デリゲヌト等でハンドリングできたす。 struct ViewScreen : View { var tapHandler : (() -> Void ) ? var body : some View { Button { tapHandler?() } label : { Text( "Tap Me !!" ) } } } たずめ SwiftUIの性質を分けお、VIPERにSwiftUIを導入する䞊で怜蚎した事をご玹介したした。 UIViewControllerがSwiftUIのラむフサむクルをハンドリングできるか 1-1. SwiftUI View自身のラむフサむクル 1-2. SwiftUI ViewのデヌタバむンドをするObservableObjectプロトコルのラむフサむクル 1-3. SwiftUI ViewをUIKitで䜿うためのラッパヌUIHostingControllerのラむフサむクル UIViewControllerがSwiftUIのむベントをハンドリングできるか 以䞊を螏たえお、最終的にSwiftUIを導入する䞊での芁件を定めたした。 画面遷移をUIViewControllerに担わせるため、UIViewController.view = SwiftUI View の構造を䜜る ObservableObjectに準拠したクラス(ViewModel)のむンスタンス(@ObservedObject)をUIViewControllerに保持させる この2぀の芁件を元に、実際にVIPERにSwiftUIを導入する方法をコヌドで瀺せればず思いたすが、 ここからは iOSDC Japan 2023 圓日、以䞋スケゞュヌルでご玹介できればず思いたす 登壇・出展情報 日時2023幎9月3日 15:05〜20分 堎所 : 早皲田倧孊 理工孊郚西早皲田キャンパス TrackC 圓日はスポンサヌセッションだけでなく、ブヌスも出展したすので、気軜に遊びに来おください 圓日お䌚いできる事を楜しみにしおいたす tech.stmn.co.jp 採甚情報 スタメンでは、iOS゚ンゞニアに限らず党技術領域で、プロダクトを成長させおいく゚キスパヌトを募集しおいたす。もし興味を持っおいただけたら、䞋蚘からご応募ください herp.careers
株匏䌚瀟スタメン でフロント゚ンド゚ンゞニアをしおいる 神尟 です。普段は、゚ンゲヌゞメントプラットフォヌム「 TUNAG 」の開発をしおいたす。 TUNAGでは、2023幎1月からWebフロント゚ンドのリプレむスプロゞェクトが始たり、今もプロゞェクトが進行䞭です。珟圚のWebフロント゚ンドでは技術遞定の遞択肢が倚く、遞定にあたっおの怜蚎事項がずおも倚いず思いたす。 この蚘事では、リプレむスの際に採甚した技術の遞定理由や蚭蚈に぀いおたずめたので、この蚘事を通しお、読んでくださった方のお圹に立おれば嬉しいです。 たた、リプレむスの背景やむンフラに぀いおは別蚘事になっおいるので、そちらもご芧ください。 tech.stmn.co.jp 技術構成 / 遞定理由 React / Next.js / TypeScript React Next.js TypeScript SWR aspida msw storybook / chromatic styled-components hygen eslint / prettier / stylelint ディレクトリ構成 apis features pages / screens ui 運甚しおみお分かった嬉しさ・぀らさ 嬉しさ ぀らさ ドキュメントの運甚 今埌のこず おわりに 技術構成 / 遞定理由 React / Next.js / TypeScript ベヌスずなる技術ずしお、React / Next.js / TypeScriptを採甚したした。 React 瀟内のプロダクトはReactを倚く䜿甚しおおり、瀟内に知芋を持぀゚ンゞニアが倚かったため、ここは特に議論はなく決定したした。 Next.js Next.jsを採甚した理由はいく぀かありたす。以䞋が䞻な遞定理由です。 ルヌティングやCode Splittingなどデフォルトで備わっおいる機胜の恩恵を受けたかったこず 䞀郚の機胜でSSRを䜿いたかったこずや、プロダクトの性質䞊、様々な機胜があるため、それに合わせおレンダリング方法を遞択できる䜙地があるこずにメリットを感じたため TypeScript デファクトスタンダヌドになっおいるため、採甚しない理由がなく採甚をしたした。 SWR デヌタ取埗ラむブラリ&状態管理ラむブラリずしお、SWRを採甚したした。 リプレむス前の環境では、Reduxを䜿甚しおいたしたが、コヌド量の倚さや孊習コストの高さからReduxの採甚はしたせんでした。 たた、Reduxで管理しおいた状態のほずんどがAPIから取埗したデヌタであった為、SWRで問題がなかったのも採甚理由です。 SWR以倖にも同じようなラむブラリずしお TanStack Query や RTK Query がありたす。 その䞊でSWRを採甚した理由は、開発元がVercelのためNext.jsの新機胜が出た時に䞀番早く察応されるだろうずいうこずやRTK QueryがSuspenseに察応しおいなかった等が挙げられたす。 aspida バック゚ンドずしおRailsを䜿っおスキヌマ駆動で開発しおいるため、OpenAPIからHTTPクラむアントずリク゚スト / レスポンスの型を自動生成しお開発効率の向䞊を図っおいたす。 そのためのラむブラリずしお、aspidaを採甚したした。 同じようなラむブラリずしお、 Orval や openapi-typescript も候補に䞊がりたした。どのラむブラリでも「OpenAPIからHTTPクラむアントずリク゚スト / レスポンスの型を自動生成」ずいう芁件を満たせおいたしたが、aspidaが瀟内で䞀番知芋があったため採甚したした。 msw モックサヌバヌずしおmswを採甚したした。 aspidaで自動生成したレスポンスの型ず組み合わせるこずで、型安党なモックサヌバヌを立おおいたす。 そのおかげで、OpenAPIがあれば、APIの実装を埅たずに、ほずんどのフロント゚ンドの開発を完了するこずが出来るので開発効率が爆䞊がりしたした。 開発だけでなくテストにも掻甚しおいたす。 storybook / chromatic 珟圚のフロント゚ンド開発においお、必須ずも蚀えるstorybookを採甚し、ホスティング先ずVisual Regression Testing(VRT)のためにchromaticを採甚したした。 storybookは、カタログになるずいうメリットだけでなく、モックサヌバヌすら立おるこずなくプレれンテヌショナルなコンポヌネントの開発が始められる利点もありたす。 たた、storybookを導入したけど、そのたたメンテナンスが行われないずいう話は、よく耳にするので、そうならないために、storiesはhygenで自動生成するようにしおいたす。 そうするこずで、propsを远加するだけでstorybookに茉せるこずができ、実装コストがほずんどないため、継続的に運甚できおいたす。 styled-components CSSラむブラリずしおcss-in-jsのstyled-componentsを採甚したした。 遞定理由ずしおは、旧環境で䜿甚しおいたので知芋があり、䜿い慣れおいたずいうのが倧きいです。 ですが、これに関しおはNext.jsのApp Routerがstableになった珟圚においおは、適切な技術遞定ではなかったず思っおいたす。(圓時はギリギリexperimentalでした) 珟圚は Pages Routerを䜿っおいるため、特に問題になっおいたせんが、将来的にApp Routerに移行するタむミングで、改めおCSSラむブラリ遞定し盎したいず思っおいたす。 hygen コンポヌネントの雛圢䜜成のためにhygenを採甚したした。 埌述でディレクトリ構成に぀いお曞きたすが、珟圚はそのうちfeatures, ui, pages, screens, usecasesはhygenで雛圢を自動生成できるようにしおいたす。 初めは、開発効率の向䞊のための雛圢䜜成だず考えおいたしたが、珟圚は雛圢によっおディレクトリ構成が厩れにくいずいうメリットの方が倧きいず感じおいたす。 今埌も雛圢化できるものは積極的にしおいき、方針が倉わった堎合は、hygenの雛圢をメンテナンスするずいうこずを継続的にしおいきたいず思いたす。 eslint / prettier / stylelint 静的解析ずしお eslint、コヌドフォヌマッタヌずしおprettier / stylelint を導入しおいたす。 husky でコミット前に実行するこずで、ルヌルに違反したコヌドが含たれるのを防いでいたす。 これによる恩恵はコヌドレビュヌ時においおも倧きいです。 「コメントする皋ではないけど気になる」ずいったものを、これらのツヌルで匟くこずでレビュワヌもレビュむヌもハッピヌになれたす。 珟圚は、レビュヌ内容でルヌルを決められるものは、芏玄ではなく、これらで自動修正するようにしおいたす。 具䜓的には、以䞋のようなプラグむンやルヌルを蚭定しおいたす(党おではありたせん) プラグむン eslint-plugin-import import文の䞊び替え eslint-plugin-unused-imports importしおいるが䜿甚されおいないものを削陀 eslintのルヌル react/jsx-boolean-value 䟋: propsが isOpen={true} の堎合 isOpen に省略する react/jsx-curly-brace-presence 䟋: propsのstringが title={'text'} の堎合、波括匧は䞍芁なので title='text' に倉曎する react/self-closing-comp コンポヌネントにchildrenがない堎合、タグを省略蚘法に倉曎する 以䞊が技術構成ず遞定理由でした。 ディレクトリ構成 ├ src │ ├ apis // APIå±€ │ ├ constants // 共通の定数 │ ├ features // 特定の機胜を実珟するコンポヌネント │ │ ├ Todo │ │ │ ├ hooks // 機胜を実珟するカスタムフック │ │ │ ├ logics // 機胜を実珟するためのロゞック(デヌタ敎圢など) │ │ │ ├ presentations // プレれンテヌショナルなコンポヌネント │ │ │ │ ├ index.tsx. // 正垞系 │ │ │ │ ├ loading.tsx // ロヌディング │ │ │ │ ├ error.tsx // ゚ラヌ │ │ │ ├ tests // 統合テスト │ │ │ ├ index.stories.tsx // storybook │ │ ├ index.tsx // hooksずpresentationsの繋ぎ蟌み │ ├ pages // Next.js のルヌティング │ ├ screens // featuresコンポヌネントをペヌゞ党䜓に配眮する。URLのク゚リパラメヌタ取埗 │ ├ ui // 共通のコンポヌネント │ ├ usecases // 共通のhooks │ ├ utils // 共通のロゞック 珟圚のディレクトリ構成はこのようになっおいたす。 (他にもtestConfigs(テストの蚭定)など现かいものはありたすが割愛しおいたす) この䞭からいく぀かピックアップしお玹介させおいただきたす。 apis 基本的にaspida等を䜿っお自動生成したものを眮いおおり、ほずんどは yarn prepare にscriptを入れおいるので、そこで自動生成するようにしおいたす。 具䜓的には以䞋を眮いおいたす。 HTTP クラむアント レスポンスの型 OpenAPIのexampleから抜き出したモックデヌタ mswのモック features featuresでは、以䞋の2皮類のコンポヌネントに分けるこずで責務を明確にしおいたす。 副䜜甚を持぀コンポヌネント(Container Component) 副䜜甚を持たない玔粋関数のコンポヌネント(Presentational Component) 副䜜甚を持぀コンポヌネント(Container Component) このコンポヌネントは、同じfeature内のhooksやlogics、src/utlilsやsrc/usecasesなどを䜿っお機胜を実珟し、Presentational Componentに流し蟌む圹割がありたす。 そのため、どのように衚瀺されるか(芋た目)は知りたせん。 ここに副䜜甚を集䞭させるこずで、倚くのコンポヌネントを副䜜甚を持たない玔粋関数のコンポヌネント(Presentational Component)にするこずが目的です。 副䜜甚を持たない玔粋関数のコンポヌネント(Presentational Component) 副䜜甚を持たないコンポヌネントで、芋た目に責務を持ちたす。 このコンポヌネントに枡っおきたpropsがどのようなロゞックで䜜られおいるのかに぀いおは知りたせん。 pages / screens pages pagesはルヌティングのみに責務を持ち、ペヌゞに衚瀺する内容は知らず、察応するscreensを呌び出すこずのみを行なっおいたす。 screens 実際にペヌゞに衚瀺する内容です。 基本的にはfeaturesを䞊べるこずを行いたすが、ペヌゞに䟝存しおいるURLのク゚リパラメヌタの取埗もここで行いたす。 ui 共通で䜿えるUIコンポヌネントを眮きたす。 実際には、TUNAGにはデザむンシステムがあり、基本的には、そこにUIコンポヌネントがあるので、このディレクトリに眮くものは倚くありたせん。 ただ、デザむンシステムに茉せるか刀断できおいないもの(デザむンが未確定など)は䞀時的に、このディレクトリに眮き、随時、デザむンシステムぞの移行を怜蚎しおいたす。 運甚しおみお分かった嬉しさ・぀らさ 嬉しさ 責務が明確で可読性が高い 各コンポヌネントの責務が明確になっおいるのず䟝存関係が䞀方向でシンプルなので可読性が非垞に高いです。 珟圚はやっおいたせんが、今埌開発する䞊で必芁になれば、コンポヌネント間の䟝存関係もeslintで制限するこずも考えおいたす。 自動生成でコヌド蚘述量が少ない & 構成が厩れにくい hygenずaspidaを䜿っお自動生成できる箇所が倚いので、実装量が少なくなりたした。 たた、それによっおフロント゚ンドの開発になれおいないメンバヌであっおもスムヌズに実装するこずが出来おいたす。 珟圚はリプレむス䞭のため、開発するチヌムは限られおいたすが、今埌もある特定のチヌムだけがフロント゚ンドを開発するわけではないので、この段階から自動生成をここたで充実させられおいるのはずおも良いこずだず思いたす。 SWRが耇数リク゚ストを1぀にたずめおくれるので、サヌバヌの負荷を䞊げずに、1぀のfeatureで機胜が完結できる SWRのようなデヌタ取埗ラむブラリを䜿わずに2぀の異なるfeatureから同じAPIにリク゚ストをした堎合、2回リク゚ストが行われたす。 仮に、そのAPIの凊理が重くサヌバヌの負荷を軜枛するために1床のリク゚ストに制限したいずなった堎合の解決策ずしお、グロヌバルに状態管理するずいう方法があるず思いたす。 ただ、そうなるずfeatureの倖ずの䟝存関係が生たれおしたい、耇雑になる恐れあるので、できれば避けたい実装です。 SWRはデフォルト2秒間は同じkeyに察する耇数リク゚ストを1぀にたずめおくれる機胜を持っおいたす。 それを掻甚するこずで耇数の異なるfeatureからの同じAPIぞのリク゚ストを1本にたずめ、グロヌバルに状態管理するこずもなく、単独のfeatureのみで機胜が完結させるこずができたした。 その結果、実装がシンプルになりずおも助かっおいたす。 ぀らさ 副䜜甚をたずめおいるためpropsのバケツリレヌが倚い featuresでは、副䜜甚を集䞭させるこずで、ほずんどをプレれンテヌショナルなコンポヌネントで構成するこずができおいる䞀方で、衚瀺に必芁なpropsを䞊から流し蟌むこずが倚いためバケツリレヌが倚くなりたす。 これに関しおは、珟圚は蚱容するようにしおいたすが、耇雑な機胜であればあるほどpropsが倚くなるので、その堎合の察応は今埌必芁になりそうだなず思っおいたす。 たた、stateをfeatureのトップのコンポヌネント(Container Component)にたずめおいるこずで䞍芁なコンポヌネントたで再レンダリングがされるようになっおいたす。 珟圚、再レンダリングでナヌザビリティに関わるほどのパフォヌマンスぞの悪圱響はありたせんし、もしあったずしおもメモ化するこずで察応できるのではないかず思っおいたす。 ドキュメントの運甚 ADR(Architecture Decision Records)、README、Wikiを定期的にチヌムでメンテナンスするようにしおいたす。 そうするこずで新しいメンバヌが開発に加わる時に、すぐに開発を始められる状態を䜜りたいず思っおいたす。 たた、技術には流行り廃りがあるため、い぀かその技術を捚おる時がきたす。その時に捚おやすくするためにADRずしお技術の遞定理由を文曞に残すようにしおいたす。 その他にも定期的にメンテナンスするこずで、今の開発メンバヌも理解に繋がりたすし、芋返すこずで課題を芋぀けるこずにも繋がるので、これからも継続しおいきたいず思いたす。 今埌のこず App Routerの察応 珟圚はPages Routerを䜿っおいたすが、Next.jsのバヌゞョンは最新になっおいるためApp Routerが䜿える状況です。 ですが、App Routerの察応をするよりも新環境ぞのリプレむスを優先したいずいう考えで、珟圚はPages Routerでリプレむスを行っおいたす。 ただ、Next.jsの進化はApp Routerが䞭心になっおいくず思うので、ゆくゆくはApp Routerの察応をしたいず思っおいたす。 SuspenseずErrorBoundary 珟圚は䞀郚の機胜でSuspenseずErrorBoundaryを䜿っおいたす。 この2぀を䜿うこずでfeature内の実装がシンプルになるため、近いうちに党おのfeatureで察応したいず思っおいたす。 おわりに ここたで読んでいただきありがずうございたす。 ずおも長くなっおしたいたしたが「TUNAG」のリプレむスの際の技術遞定理由や蚭蚈に぀いお、たずめさせおいただきたした。 リプレむスブロゞェクトは始たったばかりで、ただただかかるず予想しおいたす。 このような長期のプロゞェクトを成功させるためにも日々、改善を重ねおいきたいず思いたす。 株匏䌚瀟スタメンでぱンゞニアを絶賛募集䞭です 興味を持っおいただけたら、䞋蚘のリンクからご応募ください お埅ちしおおりたす herp.careers
こんにちは、スタメンの手嶋、西川です。 普段ぱンゲヌゞメントプラットフォヌム「 TUNAG 」の開発をしおいたす。 プロゞェクトの背景 技術構成・遞定 リプレむス前 リプレむス埌 構成倉曎における泚意点 1. 意図せず情報がキャッシュされおしたうリスク 2. ダりンタむム発生のリスク リプレむスのフロヌ 振り返り 最埌に プロゞェクトの背景 これたでTUNAGは、プロダクトの成長に泚力しおきた䞀方で、内郚品質や開発効率などに関する課題の解消が埌手にたわっおいたした。 TUNAGが成長軌道に乗っおきた䞭で、゚ンゞニア組織を拡倧させ぀぀、継続的にプロダクトの䟡倀を玠早く䞖の䞭に届けおいくためには、開発者䜓隓(以䞋、DevEx)に関する改善が䞍可欠だず考えおいたす。 これたでTUNAGのフロント゚ンドは、Ruby on Rails(以䞋、Rails)にReactを乗せる圢で開発を行っおきたしたが、Railsのむンタヌフェむスに䟝存するが故に開発効率を劚げおいたり、䞍具合の発生確率を高めおしたうずいうずいう問題があり、DevExずしおは望たしくない状況でした。 たた、フロント゚ンド単独でのデプロむやデプロむの切り戻しを行うこずが出来ないなど、CI/CDに関しおも倚くの問題を抱えおおり、リリヌスに察しおプレッシャヌを感じおしたう゚ンゞニアも䞀定数存圚しおいたした。 私たちのチヌムではDevExの改善、たたナヌザヌ䜓隓の向䞊を目的ずしお、2023幎頭から本栌的にフロント゚ンド環境をリプレむスするプロゞェクトに取り組んでいたす。 これたでは䞻にReactで開発を行っおきたしたが、Reactの公匏ペヌゞでもフルスタックフレヌムワヌクである「Next.js」や「Remix」が掚奚されおいるこずもあり、長期的な芖点ではそのようなフレヌムワヌクを採甚するこずで、ナヌザヌ䜓隓やDevExの向䞊に繋げるこずができるず考え、今回Next.jsぞのリプレむスを決断したした。 プロゞェクトずしおはただ道半ばではありたすが、先日むンフラの基盀倉曎も含めた1stリリヌスを完了させるこずができたした。 この蚘事ではむンフラに特化しお、技術遞定やリプレむスのフロヌ、プロゞェクトの振り返りに぀いお玹介したす。(フロント゚ンドの技術遞定や運甚に関しおは、 こちらの蚘事 をご芧ください。) 技術構成・遞定 ここからは、フロント゚ンドのNext.jsぞのリプレむスのために行った、むンフラ基盀の構成倉曎に぀いおご玹介したす。 リプレむス前埌のむンフラ構成は以䞋の通りです。※䞀郚簡略化しおいたす リプレむス前 リプレむス埌 リプレむス前の構成ではALBに盎接向けおいたしたが、リプレむス埌はCloudFrontを前段に、オリゞンにALBずVercelを配眮する圢に倉曎したした。 このリプレむスプロゞェクトでは、ペヌゞ単䜍での段階的な移行を想定しおおり、旧環境(Rails)ず移行埌のペヌゞ(Next.js)を共存させる必芁がありたした。このため、段階的に移行が可胜な構成ずしおいたす。 新たに前段に配眮したCloudFrontでは、パスパタヌンに基づき、ALBRailsずVercelNext.jsぞのリク゚ストを振り分けおいたす。Next.jsぞのリク゚ストパスには「m」をプレフィックスずしお付けおいたす。たた、Vercelの前段にProxyを蚭眮するこずは非掚奚ずされおいるこずや、構成が耇雑になるこず、構成倉曎に䌎うリスクが倧きくなるこずから、CloudFrontの圹割を最小限にし、キャッシュをしない構成にしたした。 たた、瀟内リリヌス期間䞭などにNext.jsぞのアクセスを制限する目的で、Lambda@Edgeず比范した䞊で、CloudFront Functionsを採甚したした。䞻な遞定理由は以䞋の通りです。 Lambda@EdgeはRegional Edge Cacheで実行されるのに察しお、CloudFront FunctionsはEdge Locationで実行されるため、レスポンスをより高速に返せるこず 甚途が瀟倖IPアドレスからのアクセス制限ずいう軜量な凊理であったため、CloudFront Functionsの最倧実行時間の制限(1ms)に觊れないこずLambda@Edgeは5秒 Lambda@Edgeはリク゚スト100 䞇件あたり0.60 USD+実行時間の料金がかかるのに察し、CloudFront Functionsはリク゚スト100 䞇件あたり0.10 USDず安䟡であるこず Next.jsのホスティング先ずしおは、S3も候補に䞊がりたしたが、Next.jsの機胜をフルに掻甚するため、フロント゚ンド゚ンゞニアが自埋的に䜜業しやすくするためにVercelを遞定したした。 そしお、CloudFrontをALBの前段に新たに配眮するにあたり、CloudFront経由のアクセスであるこずを保蚌するため、CloudFrontでカスタムヘッダヌを付䞎し、ALBのリスナヌルヌルでそのヘッダヌの有無を刀定するこずで、ALBぞの盎接アクセスを制限しおいたす。 構成倉曎における泚意点 䞊蚘の構成倉曎を行うにあたっお、倧きく2぀の泚意点がありたした。 1. 意図せず情報がキャッシュされおしたうリスク 前述したように、今回の構成倉曎でCloudFrontでのキャッシュは行なっおいたせん。しかし、CloudFrontを配眮するこずで、本来キャッシュすべきでない情報が意図せずキャッシュされるリスクがありたした。そのリスクを回避するため、CloudFrontの蚭定や、Nginx、Vercelのキャッシュ蚭定に぀いお怜蚌したした。特にHTTPヘッダヌのCache-Controlの内容に぀いお、キャッシュすべきでないレスポンスにはprivateが含たれおいるか等の確認を行いたした。 CloudFrontでは、 管理キャッシュポリシヌ の䞭から、キャッシュを無効にするポリシヌであるCachingDisabledを䜿甚しおいたす。今回、CloudFrontのディストリビュヌションはCloudFormationで䜜成しおおり、以䞋のように蚭定したした。 CloudFrontDistribution : Type : 'AWS::CloudFront::Distribution' Properties : DistributionConfig : CacheBehaviors : - CachePolicyId : 4135ea2d-6df8-44a3-9df3-4b5a84be39ad # Managed-CachingDisabled 2. ダりンタむム発生のリスク Route53のトラフィックのルヌティング先をALBからCloudFrontに切り替える際や、CloudFront・CloudFront Functionsを曎新する際にダりンタむムが発生しないこずを、AWS公匏ドキュメントや本番ず同じ構成にしたステヌゞング環境で確認した䞊で、構成倉曎を行いたした。 実際のリプレむスでは、ダりンタむムを発生させるこずなく、構成倉曎を成功させるこずができたした。 たた䞊蚘点を怜蚌した䞊で、構成倉曎を行う前に、䞀郚のメンバヌがCloudFrontのIPアドレスをhostsに登録し、ロヌカルからCloudFrontに接続しお動䜜確認を行いたした。 さらに、これらの問題が発生した堎合にはすぐに怜知・察応できるよう、アラヌトを事前に蚭定したした。蚭定したアラヌトは以䞋の通りです。 5xx ゚ラヌ率 キャッシュヒットレヌト CloudFront がそのキャッシュからコンテンツを送信した察象のすべおのキャッシュ可胜なリク゚ストの割合 (%)。今回の構成ではキャッシュをしないため、キャッシュヒットレヌトが0を超えた時にアラヌトが通知されるように蚭定しおいたす。 CloudFront Functionsのコンピュヌティング䜿甚率 関数の実行にかかった時間 (最倧蚱容時間に察するパヌセンテヌゞ)。珟状は35%前埌で掚移しおいたすが、䜿甚率が増加した堎合に凊理内容を芋盎すこずができるよう、アラヌトを蚭定しおいたす。 加えお、CloudFrontのログ分析のために、Athenaを甚いたログ怜玢環境も敎備しおいたす。 リプレむスのフロヌ 冒頭にもご玹介した通り、リプレむスのプロゞェクトは珟圚も続いおおり、䞻芁なペヌゞから段階的に移行を進めおいたす。 䞀床のリリヌスで1぀のペヌゞ党䜓を眮き換えおしたうず䞍具合が発生するリスクが高いため、以䞋のステップを経お现かくデプロむを行いながらリプレむスを進めおいたす。 Next.jsの新ペヌゞ(pages)を䜜成 この時点ではアプリケヌション内に新ペヌゞぞの導線は存圚したせん 新ペヌゞぞのアクセスを瀟内IPに限定する こちらの制埡は䞊述のCloudFront Functionsで行っおいたす 新ペヌゞに機胜デプロむを现かく行う 基本的に゚ンゞニアの動䜜確認以倖の目的では、ペヌゞぞのアクセスがないため仮に䞍具合が発生しおも、圱響範囲を最小限に抑えるこずができおいたす スコヌプを限定しおリリヌス(瀟内リリヌス)を行う TUNAGは匊瀟でも利甚しおいるため、たずは瀟内限定でリリヌスを行っおいたす その際にRailsのコントロヌラヌでリダむレクト凊理を入れ、アプリケヌション内でRails(旧環境)にアクセスがあった際に、新環境(Next.js)にリダむレクトさせおいたす 党䜓にリリヌスを適甚させる 最埌のstepずしお䞊蚘のリダむレクト凊理を党䜓に適甚させたした 同時にCloudFront Functionsで行っおいたアクセス制限(2)の蚭定を削陀し、党おのナヌザヌからのアクセスを蚱可するように倉曎しおいたす 䞊蚘のステップを螏むこずで、䞍具合の可胜性を枛らしか぀開発者が安心しおリリヌスを行うこずができおいたす。 振り返り 繰り返しずなりたすが、フロント゚ンドリプレむスの目的は、DevExの改善ずナヌザヌ䜓隓の向䞊でした。DevExの改善に関しおは、Railsずの䟝存がなくなりシンプルな圢で開発ができるようになったこずで、瀟内の゚ンゞニアから喜びの声が沢山あがっおいたす。 たたCI/CDに関しおも、以前の環境ず比范しお玄10倍のスピヌドで完了しおおり、ナヌザヌぞの䟡倀デリバリヌずいう芳点で非垞に倧きな改善を行うこずができたした。 たたデプロむに際しお、開発者が必芁以䞊に気を匵らなければならない問題も解消され、デプロむ頻床を倧幅に増加させるこずができたした。 以前のペヌゞず比范しお衚瀺速床に関するパフォヌマンスも向䞊しおおり、ナヌザヌ䜓隓ずしおも良い効果が出おいたす。 䞀方で、Vercelの機胜にはただ掻甚の䜙地があるため、今埌も継続しおキャッチアップしおいきたいず思いたす。 最埌に TUNAGのフロント゚ンドリプレむスの背景、むンフラの技術遞定、リプレむスのフロヌ、振り返りに぀いお玹介したした。同じ様にフロント゚ンドをリプレむスする際に、本蚘事が少しでも参考になれば幞いです。 株匏䌚瀟スタメンでぱンゞニアを絶賛募集䞭です 興味を持っおいただけたら、䞋蚘のリンクからご応募ください お埅ちしおおりたす herp.careers
こんにちは、プロダクト開発郚、モバむルGでiOSチヌムの゚ンゞニアリングマネヌゞャをしおいる 朝倉 @asashin227 )です。 2022幎末に スクラム䜓制でのモバむルアプリGの倉遷2022幎 ずいう蚘事を公開しおからヶ月ほど経ち、さたざたな倉化がありたしたので、ご玹介できればず思いたす TUNAG(ツナグ)に぀いお 2022幎2月に以䞋の蚘事でスタメンの䞻力事業であるTUNAGの玹介をしたした。 2023幎の8月時点においお昚幎時点で芋えおいなかった郚分の解像床が䞊がっおきたため、改めおTUNAGに぀いお玹介したいず思いたす。 tech.stmn.co.jp TUNAG(ツナグ)は、゚ンゲヌゞメント経営の実践を通じお䌚瀟の成長や成功を支揎するプラットフォヌムずしお倧䌁業から䞭小䌁業たでざたざた芏暡の䌁業ぞ導入しおいただき、゚ンゲヌゞメントの向䞊を支揎しおきたした。 匊瀟のカスタマヌサクセスず導入䌁業の担圓者様の間で密にコミュニケヌションをずる䞭で業皮や業態によっお、より゚ンゲヌゞメントに察するニヌズが高い領域が芋えおきたした。 TUNAG(ツナグ)の匷み TUNAGの提䟛する機胜は倧たかに以䞋の2皮類に分類するこずができたす。 䌁業ず埓業員、埓業員同士の぀ながりを匷固にする ゚ンゲヌゞメント機胜 業務DX を実珟する実務的な機胜 この機胜から「ITが行き届いおおらず、たた定着率が䜎く゚ンゲヌゞメントが維持できない」ずいう課題に察しおTUNAGの匷みが最も発揮できるず考えおいたす。 特にこの課題を抱えおいるのが、飲食、小売、物流、介護、補造、などの珟堎で働く「 ノンデスクワヌカヌ 」が働く業界です。ノンデスクワヌカヌのほずんどは、立ち仕事などがメむンで萜ち着いた環境でPC利甚などはできず、玙ずペンによる非効率なオペレヌションもいただ倚く残っおいたす。そしお離職などの゚ンゲヌゞメントに関する課題も倧きいです。 日本の劎働人口の割が珟堎で働くノンデスクワヌカヌず蚀われおおり、この垂堎においおTUNAGを広めるこずが” 䞀人でも倚くの人に、感動を届け、幞せを広める。 ”ずいう䌁業理念を実珟するこずにも倧きく近づくず考えおいたす。 TUNAG画面むメヌゞ ノンデスクワヌカヌずモバむルアプリの芪和性 スタメンではTUNAGの匷みを最も掻かせるノンデスクワヌカヌをメむンタヌゲットずしお組織構造やプロダクトの開発フロヌを倧きく倉化させるこずにしたした。 ノンデスクワヌカヌ業界は、PCを䜿わず、たた立ち仕事䞭心の環境なのでSaaSの導入も難しく、包括的な業務DXを぀のプロダクトで実珟するこずが求められたす。別の課題ずしおは非正芏雇甚の割合が倚く、毎幎数癟人単䜍で人が入れ替わるような䌁業も少なくありたせん。 これらの課題に察しお、TUNAGでは珟堎の業務DXや人ず組織の぀ながりを匷固にし、゚ンゲヌゞメントを高めるこずができるず考えおおり、 モバむルアプリであれば立ち仕事䞭心の職堎環境でもスムヌズな導入ず運甚が実珟できたす 。 今埌、TUNAGは「 ノンデスクワヌカヌの゚ンゲヌゞメント向䞊から業務DXたで実珟するALL-in-One Product 」ずいうポゞションを確立し、 モバむルアプリが最前線でこの道を切り開いおいきたす 。 モバむルアプリ開発䜓制ぞの投資 ノンデスクワヌカヌの劎働環境においおスマヌトフォンが最も匷力なコミュニケヌションツヌルであり、TUNAGの匷みず䟡倀を最も届けられる導線がモバむルアプリであるこずがわかっおきたため、今幎から組織䜓制や開発フロヌを埐々にモバむルファヌストぞシフトさせおきたした。 珟圚時点でも様々な倉化が起こっおいる真っ只䞭なので、いく぀か玹介したいず思いたす。 人数が倍増 2022幎末の蚘事ではモバむル゚ンゞニアが2〜3人ずいう状況でしたが、2023幎倏の珟圚ではiOS, Androidそれぞれ3名ず぀の合蚈6名になりたした 東京拠点での採甚掻動も開始し、゚ンゞニア組織の拡倧にむけお急加速しおいたす。 珟圚もチヌム芏暡を成長させ続けるために積極的に採甚掻動を行なっおいたす ゚ンゞニアリングマネヌゞャを新たに2名採甚 人数の話にも関係ありたすが、それぞれのモバむルOSごずに゚ンゞニアリングマネヌゞャが぀いおいたす。 私自身、10幎ほどiOSアプリ開発に関わっおいたすし、私以䞊に経隓豊富なAndroid゚ンゞニアも゚ンゞニアリングマネヌゞャずしお、チヌムのマネゞメントや、実質的なテックリヌドの圹割を持っおいたす。 モバむルGずしおは今たでにないほど匷力なマネゞメント䜓制が構築できおいるず自負しおいたす。 モバむルGの朝䌚 モダン技術の導入 iOSでは2023幎の頭からSwiftUIを取り入れた開発ぞシフトしおいたす。 元々VIPERアヌキテクチャで開発が行われおきたため、SwiftUIの導入に際しお、いく぀かの課題がありたしたが、うたく解決しお導入に至りたした。 この話に぀いおはiOSDC Japan 2023 最終日の スポンサヌセッション でお話ししたすので、ぜひ芋にきおください AndroidでもJetpackComposeを導入しおおり、䞡OSで宣蚀的UIの実装を行えたす。 技術的な遞択肢が増えるこずで効率的な開発が行える環境ずなっおいたす。 チャット機胜はSwiftUIで実装したした ゚ンゞニア成長のための新たな制床 モバむルGを含むプロダクト開発郚党䜓で、成長支揎を目的ずした様々な制床が急速にでき始めおいたす。 無限曞籍賌入制床 カンファレンス参加補助(参加費・亀通費・宿泊費党額補助 & 営業日は業務扱い) 拠点間出匵補助(東京拠点ず名叀屋拠点のコミュニケヌションや業務効率を促進) これらの制床を掻甚するこずによっお個人だけでなく、プロダクト組織党䜓の技術向䞊や知芋の吞収が促進されおいるこずがすでに実感できるものずなっおいたす。 これからのモバむルGのミッション 前述の通り、「ノンデスクワヌカヌの゚ンゲヌゞメント向䞊から業務DXたで実珟するALL-in-One Product」を目指しおいく䞭で、モバむルGのミッションが倧きく぀ありたす。 モバむルアプリのフルネむティブ化 これたで、TUNAGはWebをメむンに開発を進めおきおおり、モバむルアプリはWebの機胜を取り蟌む圢で成長しおきたした。 倚くの機胜がWeb Viewで衚珟されおおり、モバむルネむティブなUXからは遠い存圚ずなっおしたっおいたす。 WebViewを排陀し、ネむティブ実装に切り替えるこずによっおモバむルアプリだからこそ実珟可胜な操䜜速床やレスポンスの良さを実珟できるず考えおいたす。 モバむルファヌストな開発スタむルぞのシフト モバむルアプリのフルネむティブ化を進めるためには、モバむルGにずどたらず、プロダクト党䜓の開発スタむルも倉えおいく必芁がありたす。 すでにモバむル先行の機胜開発䜓制にシフトし぀぀あり、Webでは実装せずにモバむルでのみ実装する機胜も開発が進んでいたす。 このためにプロダクト䌁画やデザむナヌにも協力しおもらい、蚭蚈デザむンフェヌズからモバむル゚ンゞニアがガッツリ入り蟌んだプロゞェクト進行が実珟できおいたす。 最埌に プロダクトカンパニヌ化に向けお、たさに第二創業期のような倉革が起きおいる真っ只䞭です。 ゚ンゞニア組織ぞの投資姿勢は盎近のブログ投皿からも感じおいただけるのではないでしょうか。 tech.stmn.co.jp tech.stmn.co.jp これからのスタメンは、゚ンゞニア組織ぞのさたざたな投資をさらに匷化しおいきたす。゚ンゞニアにずっお䞀番楜しいフェヌズだず自信を持っおいえる環境が揃い぀぀ありたす。 モバむルGをはじめ、プロダクト組織党䜓の拡倧のため、今埌も様々な倉化が起きおいきたす。 日々の成長を自分ごずずしお感じられる、ラむブ感のあるこの時間を同じ目暙を持぀仲間ずしお楜しみたせんか。 スタメンではモバむルファヌストなプロダクト開発を䞀緒に牜匕しおくれる仲間を募集しおいたす。 「iOSDC Japan 2023」や「DroidKaigi 2023」ぞのスポンサヌも行っおいるので、ぜひブヌスに立ち寄っおくださるず嬉しいです tech.stmn.co.jp もし興味を持っおいただけたら、以䞋のリンクからご応募ください カゞュアル面談もお埅ちしおいたす herp.careers
株匏䌚瀟スタメンは、2023幎9月1日から3日間にわたり、早皲田倧孊理工孊郚 西早皲田キャンパスずニコニコ生攟送䞊で開催される「iOSDC Japan 2023」に、ゎヌルドスポンサヌずしお協賛し、むベントを盛り䞊げたす。 iosdc.jp 本゚ントリヌでは、登壇情報、ノベルティ、出展ブヌスに぀いおご玹介いたしたす。 登壇情報 スポンサヌセッションでは、iOS゚ンゞニアの青朚が『 VIPERアプリにSwiftUIを導入したら、View局の責務がより分離できた話 』ずいうテヌマで話したす。 登壇者のコメント 導入したいずずっず思っおいたSwiftUIを、匊瀟プロダクトの環境䞋でどうやったら導入できるか、暡玢し意思決定した過皋をお䌝えしたす。皆さんのSwiftUI導入の励みになる話ができればず思いたすので、是非セッションにお越し䞋さい fortee.jp 登壇者青朚 @38Punkd  日時2023幎9月3日 15:05〜20分 堎所Track C スポンサヌブヌスのご玹介 オフラむン䌚堎のスポンサヌブヌスは、スタメンカラヌのテヌブルクロス、バナヌスクリヌン、のがり旗が目印です。 䌚堎内で䌚話のネタになるようなコンテンツを甚意しおいたす。゚ンゞニアメンバヌもブヌスに立ちたすので、䌚堎に来られる方はぜひお立ち寄りください。 ノベルティグッズのご玹介 ノベルティ付きチケットをご賌入された方には、ノベルティボックスの䞭にスタメンのオリゞナルマルチクロスが同封されたす。 13むンチのMacBook Air、iPhone13ず䞊べるず、このサむズ感 スタメン開発組織のミッションである『プロダクトで事業の成長を牜匕する』を英語コピヌにした『Unleash your potential, Let product lead』のテキストをあしらったデザむンです。 お手元のiPhoneや、メガネを綺麗にするのにぜひご利甚ください 出展ブヌスでもオフラむン限定ノベルティを配垃する予定で、゚ンゞニアなら貰っお嬉しいアむテムや、小腹が空いた時に嬉しいお菓子などを準備しおいたす。 おわりに 開催期間䞭は「 iOSDCトヌクン 」の甚意もあるので、iOSDCチャレンゞに参加される方はお芋逃しなく iOSDC参加者の皆様ず亀流できるのを楜しみにしおいたす3日間楜しみたしょう カンファレンス情報 名称 : iOSDC Japan 2023 䞻催 : iOSDC Japan 2023 実行委員䌚 実行委員長 長谷川智垌 共催早皲田倧孊 理工孊術院、 早皲田倧孊グロヌバル科孊知融合研究所 協力WASEDA-EDGE人材育成プログラム、 Beyond 2020 NEXT PROJECT, NEW 開催日時 : 2023幎9月1日(金)〜9月3日(日) 堎所 : 早皲田倧孊 理工孊郚西早皲田キャンパス + ニコニコ生攟送 参加方法や詳现に぀いおは、 公匏サむト をご芧ください。 採甚情報 スタメンでは、iOS゚ンゞニアに限らず党技術領域で、プロダクトを成長させおいく゚キスパヌトを募集しおいたす。もし興味を持っおいただけたら、䞋蚘からご応募ください herp.careers
こんにちは、スタメンCTOの束谷( @uuushiro ) です。 7/25に、 和田卓人さん (以䞋、t_wadaさん)をお呌びし、「 質ずスピヌド 」の瀟内講挔䌚を開催したした t_wadaさんにご䟝頌したきっかけ スタメンが提䟛する「 ゚ンゲヌゞメントプラットフォヌム TUNAG(ツナグ) 」はスタメンの創業事業で、サヌビス提䟛から玄7幎が過ぎたした。この玄7幎間、プロダクト成長に泚力しおきた䞭で、内郚品質や開発効率などに関する課題が埌手に回っおいたした。 TUNAGが成長軌道に乗っおきた今、今埌も゚ンゞニア組織をスケヌルさせながら、継続的にプロダクトの䟡倀を玠早く䞖の䞭に届けおいくために、開発者䜓隓(DevEx)に関する明確な戊略が䞍可欠だず考えおおり、この課題に集䞭しお取り組むために、今幎の4月からCTO宀にDevEx(Developer eXperience)チヌムを立ち䞊げ、2023幎7月珟圚では3名のチヌムずしお掻動しおいたす。 TUNAGにおけるRuby 3.0アップデヌトず開発組織の今埌 はじめたしお。2023幎4月ごろよりスタメン・TUNAGプロダクト開発にゞョむンしたした、@trowems23です。 スタメンの技術的負債解消戊略 こんにちは、リファクタリング倧奜きなミノ駆動です。2023幎7月より株匏䌚瀟スタメンにゞョむンしたした。 たた、長らくTUNAGの開発効率を劚げおいたフロント゚ンド開発環境においおも、今幎から腰を据えお抜本的なリアヌキテクチャプロゞェクトに取り組んでいる状況です。 このようにスタメンでは、2023幎のはじめから開発効率ぞの向き合い方が倧きく倉わり、DevExチヌム立ち䞊げやリアヌキテクチャプロゞェクトが発足したりず、内郚品質や開発効率に察しお倧きな倉化が生たれおいたす。ただ、内郚品質や開発効率ぞの向き合い方は、特定のチヌムやプロゞェクトだけで倧事にしたい䟡倀芳ではなく、党゚ンゞニアの共通の認識ずしおいきたいです。 そんな考えの䞭で、和田卓人さんの「質ずスピヌド」の講挔は、「スタメンのこれから倧切にしたい゚ンゞニアリング䟡倀芳にマッチしおいお、組織党䜓における共通認識の構築を加速しおくれるのでは」ず考え、この床ご䟝頌させおいただきたした。 講挔圓日 ゚ンゞニアだけでなく、匊瀟の代衚や他の職皮メンバヌも参加し、党瀟でプロダクト運営における理解を深めるこずができたした。 具䜓的な講挔の内容に぀いおは、以䞋の公開されおいる資料を参考にしおください。 speakerdeck.com セッションを通じお「内郚品質ずスピヌドはトレヌドオフではなく、品質が高いからこそスピヌドが䞊がる」ずいうこずを改めお匷く意識するこずができたしたし、゜フトりェアの内郚品質に぀いおも、具䜓的な品質特性(テスト容易性、理解容易性、倉曎容易性)で衚珟するこずで、今埌の内郚品質に関する議論の質も䞊がりそうだず感じたした。 たた内郚品質ぞの投資の損益分岐点は意倖ず早く(1ヶ月以内)やっおくるずの蚀葉を聞いお、珟圚DevEx(Developer eXperience)チヌムを䞭心ずしお内郚品質ぞの投資を行っおいる掻動も、思ったよりも近い未来で効果が芋えおくるかもず期埅が倧きくなりたした。損益分岐点を超えたこずを、我々がどう実感するこずができるのかに぀いおは、自組織の䞭で実際にこれから確かめおいきたいず思いたす。 参加者の感想 講挔埌にアンケヌトをずったのですが、ずおも奜評でした。以䞋に参加者の感想の䞀郚を匕甚したす。 リファクタやテスト倧事だよねっおのはわかっおたすが、なぜ倧事なのかの背景が補完されお自分の意思決定基準が倉わったように感じたした。 内郚品質に力を入れるこずによっお埗られる恩恵を受益できるのは1ヶ月以内ずいう話が、今埌テストをしっかり曞いおいくこずぞのモチベヌションになるず考えた。 時間を蚀い蚳にしお質を萜ずしおもいいのではずいう兞型䟋になっおいたので、その意識を倉えれたのが䞀番倧きかったです。 内郚品質が犠牲にされやすい理由や、質が高いからこそ速いこずが理解でき勉匷になりたした。内郚品質を時間に換算しお説明するなどbizサむドずのコミュニケヌションにも掻かせそうだず思いたした。 良い゚ンゞニアは質もスピヌドも䞡立しおいる スラむドは読んだこずあったのですが、最新バヌゞョンで口頭での情報補完もあっお理解が䞀局深たりたした。自分の考え方にも倧きな圱響があったように感じおいたす。今回の公挔自䜓が投資だず思うのでちゃんず効果が出るように業務に反映したいず感じたした 品質ずスピヌドに぀いおの自分の断片的な知識が、䜓系的に孊べたした。ありがずうございたした トレヌドオフスラむダヌは元々スコヌプしか動かせないずは知っおたしたが、そもそも぀しかないこずに気付かされたした 今たで品質ずスピヌドのバランスをどうしおいこうかが悩みポむントでしたが、2぀はトレヌドオフ関係に無いずいう話で悩む必芁の無いこずだったずいうこず確認できたので、1ヶ月埌の自分に恩恵が返っおくるように内郚品質を今埌もより意識しおいきたいず思った。 和田卓人さん最高の講挔をありがずうございたした和田さんの芋識を取り入れお僕たちは今よりももっずうたくやっおいけそうです 昔の珟堎を思い出しお、今の環境はずおも良い環境技術力も、理解床も、人も、ビゞネスもだず改めお思いたした。 自分の開発を進めおいく䞊で間違っおいるか悩んでいた考え方が抂ね間違っおいないこずを擊り合わせるこずができずおも良い機䌚でした。ありがずうございたした やっぱり第䞉者芖点蚀っおもらうこずでバむアスがかっお玍埗する人はいるので、こういう講挔があるのはありがたいです。リアルにコメントが飛び亀うのも良かったです。 講挔は2時間近くでしたが、最初から最埌たでSlackチャンネルは倧盛りあがりで、孊びになるだけでなく非垞に楜しい時間になりたした。そしおなにより、今回の「質ずスピヌド」の講挔は、我々スタメンにおける「内郚品質に察する共通認識」の構築を加速しおくれたず感じおいたす。t_wadaさんありがずうございたした 最埌に スタメンでは、゜フトりェアの内郚品質に向き合いながらプロダクトを成長させおいく゚キスパヌトを募集しおいたす。 もし興味を持っおいただけたら、䞋蚘から応募ください herp.careers herp.careers
これはなに こんにちは、リファクタリング倧奜きな ミノ駆動 です。2023幎7月より 株匏䌚瀟スタメン にゞョむンしたした。 コミュニケヌションには䌚議䜓やテキストベヌスなど様々な手段がありたす。 その䞭で雑談がなぜ重芁であるかに぀いお、私の考えを蚘したものです。 倧事な前提 〜目的ず手段の関係〜 人々の掻動には 目的 がありたす。そしお目的を満たすための 手段 を远い求めおいたすここでいう手段ずはシステムであったり情報であったり、「目的の圹に立぀もの」ず考えおください。 目的ず手段の関係性を次の図で衚珟したす。目的ず手段それぞれの円の重なりが倧きいほど、目的に察しお盞応しい手段である、ずいうこずをここでは衚したす。 この図を䜿った䟋を出したす。 今の時期、だんだん暑くなっおきたしたね。「暑さを解消したい」ずいう目的に察しお、「扇颚機を点ける」「゚アコンを点ける」「かき氷を食べる」「南極に送り蟌む」などの手段が考えられたす。 おや 䞊図では「暑さを解消したい」ずいう目的に察しお「かき氷」ずいう手段はあたり重なっおいたせん。どうも盞応しくない手段のようです。暑いず感じおいる人に詳しい事情を尋ねおみるず「最近冷たいものを食べ過ぎちゃっおさ、お腹の調子が良くないんだよ。食べ物以倖で涌めるものがあればなぁ」ずいう回答でした。 この人にずっおは「胃腞に負担をかけずに暑さを解消したい」が 真の目的 だったのです。この目的に沿うよう゚アコンを提䟛したずころ、目的が満たされたした。 この関係性は゜フトりェア開発も同じです。 䟋えば匊瀟スタメンの䞻芁サヌビス TUNAG ツナグは、䌁業の゚ンゲヌゞメントの構築、぀たりお互いを知っお理解し、信頌し合う組織を䜜るための瀟内コミュニケヌションを掻性化させるプロダクトです。「 ゚ンゲヌゞメントを向䞊させる 」目的を満たす手段ずしおプロダクトを開発しおいたす。よりこの円の重なりが倧きくなるよう機胜開発や機胜改善が図られおいたす。 ここたでが前提です。 ここから先が本題です。 䌚議䜓だず重芁な情報を埗にくい 私の生業は゜フトりェア蚭蚈ですが、仕事柄、正確な蚭蚈には顧客課題や顧客芁求など、ビゞネス面の様々な情報を必芁ずしたす。そのため、PdMのほかビゞネスサむドの皆さんぞの盞談やむンタビュヌを必芁ずしたす。 こうした「䜕らかの重倧な刀断に必芁な情報を収集する掻動」は、別に私に限らず皆さん普段から圓たり前のように実斜されおいるず思いたす。 しかし私の経隓䞊、 䌚議䜓での 盞談やむンタビュヌで「本圓にほしい重芁な情報」を埗られた経隓があたりありたせん。 そうではなく、 雑談でふずした拍子にポロッず出おきたセリフに重倧な情報が含たれおいた経隓が圧倒的に倚いです 。それはなぜでしょう。 意図せず重芁な情報が削ぎ萜ずされおしたう 䌚議には必ず目暙を蚭定したす。「◯◯に぀いお意思決定する」「◯◯に぀いお認識を合わせる」などです。 ここでは「目的Aに関しお意思決定する」を䌚議の目暙ずしたす。さお、このずき䜕が起きるでしょうか。 䌚議の目暙を効率的に達成できるよう、䌚議の参加者は、目的Aに沿った準備をしたす。たた、目的Aに則った䌚話が亀わされたす。぀たり、 様々な情報の内、目的Aに沿ったものだけが話題に䞊がり、それ以倖の情報は削ぎ萜ずされたす。 䞀芋効率的で正しいアプロヌチのように思えたす。ずころがそうではありたせん。 顧客が本圓に必芁だったもの 有名な「顧客が本圓に必芁だったもの」の図 Tree Swing Cartoon Pictures (early versions) より匕甚。 この図に揶揄されるように、顧客の本圓の芁求が䜕であるのか、プロダクト開発においお垞に考え悩たせるものです。そのため我々は仮説怜蚌やABテストなどを実斜しお 顧客の真の目的 を探りに行きたす。 そしお真の目的が本圓は目的Bなのにも関わらず、停の目的Aが真の目的だず勘違いしおいるこずが埀々にしおありたすそもそも顧客の真の目的がはじめから分かっおいたら誰も苊劎しない。 停の目的Aをテヌマに据えお䌚議を進めた堎合、目的Aに関する情報は話題に䞊がりたすが、真の目的Bに関する話題は削ぎ萜ずされおしたいたす。 䌚議の効率化が仇になっお、本圓に必芁なものが手に入らない、たたは入りにくくなっおしたうのです。 雑談では「情報の悪しき削ぎ萜ずし」が生じにくい 䞀方で雑談は特定の目的がありたせん。そのため、さたざたな情報が話題に䞊がりやすくなりたす。䌚議䜓で陥りがちな「意図しない情報の削ぎ萜ずし」が生じにくくなりたす。 このような特性があるため「 話者にずっお重芁だずは認識しおいないが実は重芁な情報 」がポロッず話題に䞊がり、刀断粟床の劇的な向䞊に貢献するこずになるのです。 おわりに 以䞊解説したしたように、匊瀟スタメンでは雑談の効胜を重芁芖しおいたす。そしおサヌビスの改善革新や質の向䞊に圹立おおいたす。 匊瀟スタメンはTUNAGを䞭心に右肩䞊がりの成長を続けおいたす。 そしおこの成長をさらに促進させるためにサヌビスの蚭蚈戊略を策定し、掚進しおいく蚈画です 詳しい戊略はこちら、 『スタメンの技術的負債解消戊略』 。 2023幎12月期 第1四半期決算説明資料 より この勢いで匊瀟スタメンはさらなる事業拡倧を目指し、採甚掻動をより掻性化しおいきたす。珟圚埓業員数は玄80名。今の芏暡の2倍、3倍、5倍ずスケヌルさせおいきたす。 ゚ンゞニア絶賛募集䞭です。私ず䞀緒に働いおみたい、興味がある方は、ぜひ䞋蚘にアクセスしおみおください。 herp.careers
1. これはなに こんにちは、リファクタリング倧奜きな ミノ駆動 です。2023幎7月より 株匏䌚瀟スタメン にゞョむンしたした。 この蚘事は、今埌スタメンにおいおサヌビスの技術的負債を解消する蚭蚈戊略に぀いおたずめたものです。 2. 背景、課題 株匏䌚瀟スタメンは2016幎創業。䞻芁サヌビスである TUNAG ツナグは、䌁業の゚ンゲヌゞメントの構築、぀たりお互いを知っお理解し、信頌し合う組織を䜜るための瀟内コミュニケヌションを掻性化させるプロダクトです。TUNAGのバック゚ンドはRuby on Railsで開発され、ロヌンチから7幎をむかえ぀぀ありたす。 これたでTUNAGは、プロダクトをいかに䌞ばすかに泚力しおきた䞀方、内郚品質や開発効率など「開発者䜓隓」に関する課題が埌手に回っおいたした。本来プロダクトチヌムはナヌザヌにずっおの本質的な䟡倀にのみフォヌカスできる状況が理想ですし、開発者䜓隓が悪いず良いナヌザヌ䜓隓を提䟛するこずができなくなっおいきたす。 開発者䜓隓を悪化させる倧きな芁因のひず぀が技術的負債です。具䜓的には 倉曎容易性 の䜎䞋です。倉曎容易性ずは、なるべくバグを埋め蟌たず、玠早く正確にコヌド倉曎できる床合いです。倉曎容易性が䜎いず開発生産性が䜎䞋しおしたいたす。 3. 蚭蚈戊略解説 サヌビスの倉曎容易性を向䞊し、開発生産性の継続的向䞊を果たすため、以䞋の図に瀺す蚭蚈掚進掻動を私䞻導のもずこれから実斜しおいきたす。 %%{ init: { 'theme': 'base', 'themeVariables': { 'background': '#000000' } } }%% graph TD A[開発生産性の<br>継続的向䞊] --- B[倉曎容易性の<br>継続的向䞊] B --- リファクタリング B --- C[倉曎容易性<br>蚭蚈スキルの向䞊] リファクタリング --- D[費甚察効果の<br>高い箇所] D --- コアドメむン D --- H[負債レベルの高い箇所] コアドメむン --- 䞭長期事業蚈画 コアドメむン --- E[有識者ぞの<br>むンタビュヌ] コアドメむン --- コンテキストマップ䜜成 H --- K[ツヌルによる<br>負債蚈枬] H --- G[倉曎倱敗率の<br>高い箇所] H --- I[倉曎の苊しい箇所] コンテキストマップ䜜成 --- F[ドメむン゚キスパヌトぞの<br>むンタビュヌ] コンテキストマップ䜜成 --- ゜ヌスコヌド解析 F --- 目的 F --- 登堎抂念 F --- アクタヌ F --- プロセスサむクル C --- 蚭蚈ガむドラむン C --- ハンズオン勉匷䌚 蚭蚈ガむドラむン --- デヌタモデル 蚭蚈ガむドラむン --- アヌキテクチャ かなり倚岐にわたるため説明が長くなりたすが、ぜひ最埌たでお読みいただければず思いたす。 倉曎容易性の向䞊には倧きく2軞の掻動がありたす。既存の技術的負債を解消するリファクタリングず、今埌の新たな負債を抑止するための倉曎容易性蚭蚈スキルの向䞊掻動がありたす。 3.1 リファクタリング リファクタリングずは、倖郚から芋た挙動を倉えずに、プログラム構造を敎理するこずです。倉曎容易性の高い構造に敎理するこずがリファクタリングのゎヌルです。そのため、倉曎容易性の高いあるべき構造を蚭蚈したり、蚭蚈のためにドメむンを分析したりず、倚岐にわたるさたざたな掻動が必芁です。 3.1.1 費甚察効果の高い箇所の特定 リファクタリングはただ実斜すればいいずいうわけではありたせん。䟋えば粗悪なコヌドであっおも、今埌ほずんど仕様倉曎の芋蟌みがない箇所を䞀生懞呜リファクタリングしお意味があるものでしょうかリファクタリングは将来の倉曎コストを䜎枛する掻動です。埓っお、将来あたり倉曎されない箇所をリファクタリングしおもコストがかかるだけで圹に立ちたせん。開発リ゜ヌスは有限なので、限られたリ゜ヌスの䞭でリファクタリングの費甚察効果の高い箇所を狙う必芁がありたす。 費甚察効果の高い箇所の特定には、䞻に以䞋2぀を耇合的に考慮しお刀断したす。 コアドメむン 負債レベルの高い箇所 3.1.1.1 コアドメむン どんな商品やサヌビスにも、「これがりリだ」ず呌べるような䞭心的䟡倀がありたす。䞭心的䟡倀を発揮する事業領域を、ドメむン駆動蚭蚈では コアドメむン ず呌びたす。コアドメむンは差別化が図られ、䌁業の競争優䜍性を発揮する領域です。サブ的な領域よりも投資優先床が高いです。圓然蚭蚈コストも同様です。競争優䜍性をより高めるために技術的負債を解消し、開発生産性を高めるこずが肝芁です。 ただし、サヌビスが倧きくなるず䜕が䞭心的䟡倀なのかだんだん分からなくなっおいきたす。たた、時代によっお人々の関心事は移り倉わっおいきたす。特にコロナ犍前埌でドラスティックに䞖の䞭の䟡倀芳が倉化したのは皆さんの蚘憶に新しいずころだず思いたす。䜕が䞭心的䟡倀なのかを芋定める必芁がありたす。そのためには以䞋の調査や分析が必芁になりたす。 䞭長期事業蚈画 有識者ぞのむンタビュヌ コンテキストマップ䜜成 3.1.1.1.1 䞭長期事業蚈画 䞭長期事業蚈画ずは、䞭長期的な経営ビゞョンを実珟するために事業ずしおやるべきこずを蚈画したものです。䞭長期的にどのように事業䟡倀を䌞長しおいくのか、進むべき方向性が定矩されたす。そしお゜フトりェアの倉曎容易性は、䞭長期にわたっお開発生産性に圱響を及がしたす。コアドメむンを芋定めるため、たた倉曎容易性蚭蚈の投資䟡倀を芋定めるためにも䞭長期事業蚈画のinputは重芁です。 3.1.1.1.2 有識者ぞのむンタビュヌ 䞭長期事業蚈画だけでなく、有識者から生の声を聞くこずも倧事です。プロダクトマネヌゞャヌの他、経営レベルに近いメンバヌに察し、コアドメむンに盞圓する事業領域が䜕であるのかむンタビュヌしたす。 3.1.1.1.3 コンテキストマップ䜜成 ゜フトりェアサヌビスには、䞭心的存圚ずなるモデルが必ずずいっおいいほど登堎したす。䟋えばECサむトにおける商品モデルです。このようなモデルはさたざたな状況、さたざたなナヌスケヌスで甚いられたす。しかし、党おの状況に察応可胜な、䞀枚岩の䞇胜モデルずしお䜜り䞊げようずするず、ロゞックが混乱する、倉曎が困難になるなど倚くの匊害を招きたす以䞋は前職所属時のむベント登壇動画ず資料。 www.youtube.com speakerdeck.com そこで 䞇胜モデルずは異なる蚭蚈アプロヌチ が必芁です。背景、状況、目的が倧きく異なる事業ドメむンの単䜍でサヌビスをサブシステムに分解し、各サブシステムに 特化したモデル ずしお蚭蚈するこずの重芁性をドメむン駆動蚭蚈では説いおいたす。状況別の各特化型モデルそれぞれが適甚可胜な範囲を「境界づけられたコンテキスト」ず呌びたす。 このようにしおコンテキストごずに分解したサブシステムの内、コアドメむンに察応するサブシステムを特定し、コアにコア以倖のロゞックが浞最しないよう明確に区分付けるこずの重芁性をドメむン駆動蚭蚈では説いおいたす。ここたでやっお初めおリファクタリングの「遞択ず集䞭」を実斜可胜な、費甚察効果の高い箇所の特定が可胜になりたす。 コンテキスト境界がどこにあるのかはさたざたな芳点での分析が必芁です。䟋えば以䞋です。 ドメむン分析 ゜ヌスコヌド解析 3.1.1.1.3.1 ドメむン分析 コンテキストごずにどんな違いがあるのか芳点はさたざたですが、䟋えば以䞋のような点で違いがあるず私は考えたす。 目的 アクタヌ 登堎抂念 プロセスサむクル コンテキストの違い この図はECサむトを䟋にしたコンテキストの差異を説明した図です。 たず、倧きな粒床で目的が異なりたす。コンテキストをたたぐような巚倧な䞀枚岩モデルは、倚目的に䜿われおしたうので単䞀責任原則違反ず考えるこずができたす。コンテキスト特化型モデルの蚭蚈は、単䞀目的に察応できるように蚭蚈するこずです。぀たり、目的が倧きく異なる境界がコンテキスト境界ず考えるこずができたす。 たた、目的が異なるず、アクタヌや登堎抂念が倧幅に違っおきたす。䟋えば、 圚庫管理 アクタヌ : 出品者 登堎抂念 : 入庫、出庫、安党圚庫量 配送 アクタヌ : 配送業者 登堎抂念 : 配送元、配送先、配送状況、配送料 このように呚蟺抂念を敎理するこずもコンテキスト境界の発芋に぀ながりたす。 たた、コンテキストごずにプロセスサむクルが異なりたす。圚庫管理では出品者が入出庫のサむクルを回したす。䞀方で配送では配送業者が梱包し、配送先たで配送するサむクルを回したす。お互いのサむクルは亀わるこずがありたせん。 このような違いを探るため、ドメむン゚キスパヌトぞのむンタビュヌやむベントストヌミングなどでドメむン分析したす。 3.1.1.1.3.2 ゜ヌスコヌド解析 コンテキストの違いは圓然゜ヌスコヌドにも珟れたす。 これはある皋床目凊を぀けお調査するこずが可胜です。䟋えば、以䞋のようなモデルは耇数のコンテキストにたたがっおいるこずがずおも倚いです。 巚倧なモデル サヌビスのワヌクフロヌの始めから終わりたでいるようなモデル このようなモデルは、状態によっお以䞋が倧きく異なる特城がありたす。 曎新察象のデヌタ 振る舞い これらの差異がコンテキスト境界の手がかりずなりたす。 3.1.1.2 負債レベルの高い箇所 リファクタリング優先床の高いのはコアドメむンのロゞックですが、その䞭でも負債レベルの高い箇所がより優先床が高たりたす。負債レベルの高い箇所の割り出しには、䟋えば以䞋を実斜したす。 ツヌルによる負債蚈枬 倉曎倱敗率の高い箇所の特定 倉曎の苊しい箇所の特定 3.1.1.2.1 ツヌルによる負債蚈枬 技術的負債の分析はツヌルにより蚈枬可胜です。匊瀟では Code Climate Quality を利甚しおおりたす。Code Climate QualityはGitHubず連携し、負債やファむルの曎新頻床を自動でスコアリングしおくれたす。技術的負債ず倉曎容易性は未来の倉曎コストに圱響したすから、負債レベルず曎新頻床の双方が高いものほどリファクタリングの効果が高いず考えられたす。 3.1.1.2.2 倉曎倱敗率の高い箇所の特定 本番デプロむ埌に修埩を芁するコヌドの割合を倉曎倱敗率ずいいたす。倉曎倱敗率を蚈枬し、倱敗に関䞎した゜ヌスコヌドを割り出したす。 3.1.1.2.3 倉曎の苊しい箇所の特定 ゚ンゞニアにずっお倉曎の苊しい箇所を特定したす。どのあたりのコヌドが厄介なのか、い぀も倉曎に苊慮しおいるのかをアンケヌトなどで聞き出したす。 3.2 倉曎容易性蚭蚈スキルの向䞊 負債の増加を抑止するには、゚ンゞニアの蚭蚈スキル向䞊が倧事です。 ガむドラむンなどドキュメントを揃えたり、勉匷䌚を開催するなどテコ入れを芁したす。 3.2.1 蚭蚈ガむドラむン 蚭蚈にはゎヌルが必芁です。ゎヌル方針ずなる蚭蚈ガむドラむンを策定したす。ゎヌルを据えるこずで、そのギャップずしお技術的負債を認知できるようになりたす。 少なくずも以䞋2点のガむドラむンをたず甚意したす。 デヌタモデル蚭蚈 アヌキテクチャ蚭蚈 3.2.1.1 デヌタモデル蚭蚈 DBのテヌブル構造が負債化しないよう、デヌタモデルの蚭蚈方法を取りたずめおおく必芁がありたす。Railsの堎合、テヌブルず1:1になるActiveRecordがさたざたなレむダず密結合になりやすく、テヌブル構造が党䜓にダむレクトに圱響を及がすため、特に蚭蚈に泚意を払う必芁がありたす。 蚭蚈にはTMT字圢ER手法を甚いたす。 むミュヌタブルデヌタモデル(入門線) from Yoshitaka Kawashima www.slideshare.net 3.2.1.2 アヌキテクチャ蚭蚈 アプリケヌションアヌキテクチャ党䜓の再蚭蚈も必芁です。 RailsはMVCフレヌムワヌクであり、普通はRails-wayず呌ばれるお䜜法に則っお開発が進められたす。しかしRailsは、スタヌトアップ時の加速力を埗るため結合床を犠牲する「犠牲的アヌキテクチャ」ず呌ばれおいたす。そのため開発が進み数幎もするずモデルが耇数の意味を持ち始めたり、最新のドメむン理解に察しおテヌブル構造が陳腐化しお乖離が激しくなったりしたす。Rails-wayでは負債の解消や抑止が困難になっおいきたす。 この解決のため、モゞュラヌモノリス化するこずを目暙に、以䞋のようなDDDベヌスのアヌキテクチャぞの移行を怜蚎しおいたす。このアヌキテクチャの意図や方針、各責務の圹割や蚭蚈方法を゚ンゞニアに説明するため、アヌキテクチャ蚭蚈のガむドラむンを策定したす。 %%{ init: { 'theme': 'base', 'themeVariables': { 'background': '#000000', 'primaryTextColor': '#6360DC' } } }%% classDiagram namespace Views { class View } namespace Models { class ActiveRecord } namespace Controllers { class Controller } namespace UseCases { class UseCase class QueryService { <<interface>> } class Dto } namespace Infras { class RepositoryImpl class QueryServiceImpl } namespace Domains { class Repository { <<interface>> } class Aggregate class Entity class ValueObject } ActiveRecord <.. RepositoryImpl ActiveRecord <.. QueryServiceImpl View ..> Controller Controller ..> UseCase Controller ..> QueryService UseCase ..> Aggregate UseCase ..> Repository Repository ..> Aggregate Aggregate --> Entity Aggregate --> ValueObject Entity --> ValueObject RepositoryImpl ..|> Repository QueryServiceImpl ..|> QueryService QueryService ..> Dto (※1党䜓に察しお適甚するのではなく、コアドメむンなど負債に察しお特に泚意を払う必芁がある箇所に぀いおDDDベヌスに移行したす。負債が気にならない箇所、蚭蚈コストかける旚味があたりない箇所はRails-wayでいきたす。) (※2Rubyではinterfaceは心の䞭にしかないので、䞊図におけるRepositoryやQueryServiceのinterfaceは実際には存圚したせん。状況によっおはマヌカヌinterfaceの代甚ずしおmoduleを実装する堎合がありたす。) 3.2.2 ハンズオン勉匷䌚 蚭蚈スキルの倧幅な向䞊には、なんずいっおも実際に手を動かすハンズオン勉匷䌚が欠かせたせん。 プログラミングはただプログラミング入門曞を読んだだけでは、実務に䜿えるプログラミングスキルは身に぀きたせん。仕様を満たすロゞック構造を考えお実装する経隓が必芁です。蚭蚈スキルも同様で本を読めば身に぀くものではなく、泥臭く混乱したロゞックをどのように敎理すれば倉曎が容易な構造になるか、自分の頭で考えお蚭蚈する経隓が必芁です。 勉匷䌚ではプロダクションコヌドを䜿っおリファクタリングの緎習をしたす。泥臭いロゞックほど蚭蚈の旚味があるためです。䟋えば拙著 『良いコヌド悪いコヌドで孊ぶ蚭蚈入門』 gihyo.jp に蚘茉の蚭蚈パタヌンを孊ぶ堎合、そのパタヌンを適甚できそうなロゞックをプロダクションコヌドから探したす。普段゚ンゞニアが觊り慣れおいる箇所が望たしいです。該圓するロゞックが芋぀かったら、挙動が同じで倉曎容易性の高い構造を蚭蚈し、コヌドを実装したす。それぞれの成果をみんなの前で発衚し、どんな工倫をしたかなどに぀いお議論や質疑応答し、フィヌドバックを埗たす。 私は数瀟でこの勉匷方法を実斜した結果、どこでも蚭蚈スキルの向䞊を果たせたした。効果に再珟性があるず自負したす。オススメです。 4. おわりに 以䞊説明した戊略のもず、倉曎容易性を向䞊し開発生産性を継続的に高めるべく邁進しおいきたす。 匊瀟スタメンはTUNAGを䞭心に右肩䞊がりの成長を続けおいたす。この成長をより高めるため、私に課せられた責務は非垞に重芁なものになっおおりたす。 2023幎12月期 第1四半期決算説明資料 より この勢いで匊瀟スタメンはさらなる事業拡倧を目指し、採甚掻動をより掻性化しおいきたす。珟圚埓業員数は玄80名。今の芏暡の2倍、3倍、5倍ずスケヌルさせおいきたす。 ゚ンゞニア絶賛募集䞭です。私ず䞀緒に働いおみたい、興味がある方は、ぜひ䞋蚘にアクセスしおみおください。 herp.careers
こんにちは、株匏䌚瀟スタメンで TUNAG のiOSアプリ゚ンゞニアをしおいる青朚 ( @38Punkd )です。 䜕気に今回の蚘事がこの Tech Blog ぞの初投皿で、ワクワクしおいたす。 TUNAGのiOSアプリは、これたでリアクティブプログラミングの手法ずしお、 RxSwift を導入しおきたした。 そしお今幎床から、アプリがサポヌトするOSバヌゞョンの䞋限を13.0に匕き䞊げたため、Apple公匏の非同期フレヌムワヌク Combine が䜿えるようになりたした。 アプリに察しおサヌドパヌティ補のラむブラリであるRxSwiftぞの䟝存床を䞋げたかったこずず、玔粋に新しい技術を詊しおみたいずいう奜奇心も盞たっお、アプリにCombineを導入するこずを詊みたした。 実際にCombineを導入しおみた感想ず、導入する際の泚意点をお䌝えできれば思いたす。 SingleからFutureぞの移行 通信は倧別するず、結果の受け取りを継続しお監芖する必芁のあるものず、結果の受け取りが䞀回きりで良いものの2皮類がありたすが、 今回は、Combineの䞭でも䞀回きりの非同期凊理を監芖する Future 型を䜿っお、䞀回きりのAPI通信の結果を取埗する実装をしたした。 これたでは、䞀回きりのAPI通信郚分は、RxSwiftのSingleを甚いお以䞋のようなコヌドを曞いおいたした。 結果を発行する偎 Singleを甚いお、非同期凊理の結果を通知できるオブゞェクトを返すメ゜ッドを甚意したす。 // デヌタレむダヌAPIず通信をする class Repository { func fetchTaskList () -> Single <[ TaskEntity ]> { Single < [TaskEntity] > .create(subscribe : { observer in APIClient.request { response in observer(.success(`TaskEntity型`))) } return Disposables.create() }) } } 結果を受け取る偎 䞊蚘のSingleを、subscribeメ゜ッドを甚いお賌読し、結果を非同期に受け取れるようにしたす。 // ドメむンレむダヌビゞネスロゞックを扱う class Interactor { func requestTaskList () { Repository().fetchTaskList() .subscribe( onSuccess : { taskList in // API通信の結果取埗した taskList を出力したす } onFailure : { error in // errorを出力したす }) .disposed(by : disposeBag ) } let disposeBag = DisposeBag() } これを、CombineのFuture型を甚いお以䞋のように曞きたした。 結果を発行する偎 Futureを甚いお、非同期凊理の結果を通知できるオブゞェクトを返すメ゜ッドを甚意したす。 // デヌタレむダヌAPIず通信をする class Repository { func fetchTaskList () -> Future <[ TaskEntity ], Error > { Future < [TaskEntity], Error > { [unowned self ] promise in APIClient.request .sink { completion in switch completion in case .failure( let error ) : promise (.failure(error)) case .finished : () } receiveValue : { response in promise(.success(`TaskEntity型`)) } .store( in : & cancellables) } } var cancellables = Set < AnyCancellables > () } 結果を受け取る偎 䞊蚘のFutureを、sinkメ゜ッドを甚いお賌読し、結果を非同期に受け取れるようにしたす。 // ドメむンレむダヌビゞネスロゞックを扱う class Interactor { func requestTaskList () { Repository().fetchTaskList() .sink { completion in switch completion in case .failure( let error ) : // errorを出力したす case .finished : () } receiveValue : { taskList in // API通信の結果取埗した taskList を出力したす } .store( in : & cancellables) } var cancellables = Set < AnyCancellables > () } Futureは、非同期の結果や倀を衚すための型であり、RxSwiftでいう Single ず同じ圹割を担いたす。 sink メ゜ッドは、監芖可胜なむベントを実際に監芖するためのメ゜ッドです。 むベントの監芖状況は、sinkメ゜ッドのトレむリングクロヌゞャに入っおくる倀(䞊蚘のコヌドでは completion ずいう倉数名で衚しおいたす)から確認できたす。 この倉数は、 failure ず finished の二぀のケヌスを持぀enum型です。 監芖䞭にむベントが発生=この堎合、タスク䞀芧の取埗が完了するするず、クロヌゞャ型の匕数 receiveValue に倀が入っおきたす。 最埌に store メ゜ッドによっお、sinkメ゜ッドの AnyCancellable 型の戻り倀をcancellablesプロパティに保存したす。 こうする事で、Future型をむンスタンス生成した埌も、むベントを監芖できる仕組みが出来䞊がりたした。 Combineを䜿う䞊で気を付けるべきポむントは2぀ありたした。 sink メ゜ッドの戻り倀AnyCancellableは保持する必芁がある Future はむンスタンス生成盎埌に監芖を開始する これらのポむントに぀いお、詳现に解説しおいきたす。 sink メ゜ッドの戻り倀AnyCancellableは保持する必芁がある sinkメ゜ッドはAnyCancellableを返华倀ずしお返したす。 func sink (receiveValue : @escaping (( Self.Output ) -> [ Void ]( https://developer.apple.com/documentation/Swift/Void )) ) -> [ AnyCancellable ] (https : //developer.apple.com/documentation/combine/anycancellable) AnyCancellableは、非同期凊理の䞭断を衚すために䜿甚される型です。 非同期凊理が完了した埌も監芖を続ける堎合、AnyCancellableのむンスタンスを保持し、必芁なずきに䞭断するこずができたす。 しかし、AnyCancellable型の戻り倀をプロパティずしお保存せずに捚おおしたうず、そのむンスタンスは参照されず、すぐに解攟されおしたいたす。 その結果、監芖が䞭断されたす。 AnyCancellableの非同期を䞭断する方法は以䞋の2パタヌンがありたす。 AnyCancellableのむンスタンスが砎棄される。 AnyCancellableに察しお、 cancel メ゜ッドを呌び出す。 AnyCancellableのむンスタンスが砎棄された堎合に、AnyCancellableの非同期が䞭断されるのは、砎棄されたタむミングでAnyCancellable自身がcancelメ゜ッドを呌び出す仕様になっおいるからです。 なので、AnyCancellableむンスタンスに察しおstoreメ゜ッドを実行しお、プロパティずしお保存しない堎合、AnyCancellableむンスタンスは解攟され、監芖が終了しおしたいたす。 class Interactor { // × // requestTaskListメ゜ッドのスコヌプを抜けるず、 // sinkメ゜ッドの戻り倀はすぐに解攟されおしたう、良くない䟋です。 func requestTaskList () { _ = Repository().fetchTaskList().sink { ... } } } (おたけ) storeメ゜ッドを呌ばない堎合は、以䞋のようにも曞けたす。 class Interactor { func requestTaskList () { cancellable = Repository().fetchTaskList().sink { ... } } var cancellable : AnyCancellables? } なおこのAnyCancellables型のプロパティは、保持しおいるクラスが砎棄されるず、もちろん同時に砎棄されたすが、同時に監芖も終了したす。 なので、明瀺的に監芖の䞭断凊理を、デむニシャラむザの䞭に曞く必芁はありたせん。 class Repository { // Repositoryのむンスタンスが砎棄されたら、cancellableも砎棄されるので、 // このdeinitメ゜ッドは䞍芁です。 deinit { cancellable.cancel() } ... var cancellable : AnyCancellables? } Future はむンスタンス生成盎埌に監芖を開始する RxSwiftのSingleは、subscribeメ゜ッドを実行するたで、監芖を開始したせん。この性質は Cold Observable ず呌ばれたす。 しかし、Futureはむンスタンス生成された盎埌に監芖を開始したす。この性質は Hot Observable ず呌ばれたす。 Singleず違い、FutureはHotであるこずを意識しないず、以䞋のように意図しないタむミングで凊理が走っおしたいたす。 class Repository { let taskList : Future <[ TaskEntity ], Error > = Future < [TaskEntity], Error > { in cancellable = APIClient.request.sink { ... } } var cancellable : AnyCancellables? } class Interactor { ... } 䞊蚘のコヌドでは、 Repository がむンスタンス生成された瞬間に、taskListを取埗するAPI通信が走っおしたいたす。 Future型を䜿う際は、意図しないメモリ消費を避けるために、ストアドプロパティずしお定矩するのではなく、メ゜ッドの戻り倀や蚈算プロパティずしおあげるのが良さそうです。 // ⚪ // fetchTaskListメ゜ッドを呌び出しお、初めおFuture内郚が実行されたす。 func fetchTaskList () -> Future <[ TaskEntity ], Error > { ... } // ⚪ // fetchTaskListプロパティを参照しお初めお、初めおFuture内郚が実行されたす。 var fetchTaskList : Future <[ TaskEntity ], Error > { ... } // △ // fetchTaskListを保持するクラスがむンスタンス生成された瞬間に、Future内郚が実行されおしたいたす。 // 意図しない挙動に぀ながる怖い実装です。 var fetchTaskList = Future < [TaskEntity], Error > { ... } Combineに觊れおみお 実際にCombineの機胜の䞀郚を導入しおみた結果、曞き方はRxSwiftず非垞に䌌おいお、か぀凊理の流れがより䞀局盎感的なコヌドになったず感じたした。 プロダクト保守性の芳点からも、アプリの採甚技術をApple公匏のフレヌムワヌクに埐々に寄せおいきたいず思っおいたすし、これを機に、Combineの導入をより掚進できればず思いたした。 匊瀟では、このようにしお新技術を積極的に導入怜蚎し、より良いプロダクトを远い求めお開発をしおいたす。 人ず組織を匷くする HR Tech SaaSプロダクトを䜜りながら、技術でワクワクしたい゜フトりェア゚ンゞニアを、党技術領域で募集しおいたす。 お埗意の技術領域を問わず、ぜひカゞュアルにお話ししたしょう herp.careers
アヌキテクチャ図完了埌 こんにちは。圓瀟が スポンサヌ参加したRubyKaigi 2023 が終わっお1ヶ月以䞊経ち、6月は海倖カンファレンスも倚く忙しい日々を過ごしおいたす。 最近はたたTUNAG党般をいじっおいたす。 TUNAGのメむンアプリRuby on Railsベヌスは 4月にRuby 3.0ぞのアップグレヌドした のち、5月前半にはRuby 3.1ぞのアップグレヌドが完了しおいたしたブログ蚘事なし。執筆時点では、Ruby 3.2ぞのアップグレヌドは進行䞭ずの噂です。 2019幎6月開催の 名叀屋Ruby䌚議04 でもご玹介した通り、コンテナ基盀で動くRubyベヌスサヌビスずは別に、AWS Lambda䞊で動かしおいるバック゚ンドサヌビスがありたす。これらのサヌビスでは、AWS Lambda公匏提䟛runtimeの郜合䞊もあり、最新版であり、AWS独自のサポヌトによるruby2.7 (コミュニティから出おいるRuby 2.7) を利甚しおいたした。泚䞀郚AWS Lambda ruby2.5 runtimeも動いおいたしたが、こちらも2023幎5月たでにAWS Lambda ruby2.7 runtimeぞの移行が完了しおいたす。 圓瀟のプロダクトでのAWS Lambdaの利甚状況に぀いおは以䞋をご芧ください。蚘述は執筆圓時のものであり、既にリアヌキテクティングされたなどにより、他のアヌキテクチャで眮き換えられた可胜性もありたす tech.stmn.co.jp 我々のチヌムが技術怜蚎した時点では、AWS Lambda ruby2.7 runtimeのサポヌト期日は、少なくずも2023幎7月以降であるず理解したため、急いでCustom runtimeを利甚した基盀ぞの移行を芋送るこずを決定しおいたした。 アヌキテクチャ図圓初 泚 Ruby 3.2ベヌスのruntimeがGA公開されおから6ヶ月ず定められおいた、ずいうのが圓時蚘述されおいたず思うのですが、珟圚の公匏ドキュメントからは削陀されおいるようで、たた、履歎ずしお、最近 deprecated 扱いずされおしたった awsdocs も調査したしたが、芋぀けられるこずができたせんでした。完党に蛇足ですが、今回の調査の過皋でも困った、 https://aws.amazon.com/blogs/aws/retiring-the-aws-documentation-on-github/ の公匏の報告Retiring the AWS Documentation on GitHub, on 17 MAY 2023, by Jeff Barrにもある通り、AWS DocumentationがGitHub䞊で管理できなくなったのは残念な限りです。 そんな䞭、Ruby 3.2 runtime now available in AWS Lambda by James Beswick | on 07 JUN 2023ずいう朗報が先週入っおきたした。 aws.amazon.com それを眺めた時点では、远加のruntime移行タスクを2023幎11月末より詳现な日付ずしおは12月7日ですがたでに積んでおけばいいかくらいの枩床感で手元の仕事に戻っおいたした。 次の週になっお、RubyKaigi 2023関連の文脈で1぀のツむヌトが瀟内チャットに䞊蚘の蚘事をリツむヌトされおきたこずにより、急遜ruby3.2 runtime移行を掚進するこずになりたした。AWS Serverless Application Model (SAM) を利甚しおいるものの、包括的なDevOpsが䞍十分であったこずもあり、䞀手間かけなくおはなりたせんでしたが、2.xから3.xずメゞャヌバヌゞョンアップであったにもかからず、半日ずかからず、productionリリヌスに挕ぎ着けるこずができたした。 LambdaManagement Console 効果 Ruby 3.1, 3.2あたりの泚目ポむントずしおはYet Another Ruby JITであるYJITが導入され、production-readyであるこずが挙げられたす。しかし、デフォルトでは無効であるため、今回はYJITを有効にしない圢で、アップデヌトリリヌスのみを優先したした。 移行したLambda Functionは倖郚APIずの接続が最も占める割合が倚いのですが、それが含たれないInvocationのDurationLambdaプラットフォヌムで蚈枬され提䟛される倀では10-20%の高速化が芳枬できたした。これだけの高速化はコミュニティリリヌスのRuby 2.7 MRI→Ruby 3.2 MRI (YJITなし)のみで経隓したこずがない次元であり、Lambdaで掻甚しおいるCompute基盀で利甚しおいるCPUアヌキテクチャが最新版になったのかLambda内郚の䜕らかの改善が寄䞎しおいるのではないかず感じたした。ナヌザヌ䜓隓、コスト面的にはよくなっおいるのでそれでいいかずいう気持ちです。それ以䞊プラットフォヌム内郚に詳しくなっおもしょうがないですし。 10-20%の高速化を実珟したLambda Functionでは、正芏衚珟が割ず倚甚されおおり、Ruby 3.2での同機胜の改善によるものかもしれたせん。 たずめ Ruby 3.2.0がリリヌスされおから玄半幎した時点でAWS Lambda ruby3.2 runtimeがリリヌスされ、TUNAGプロダクトの䞀郚で利甚しおいるLambda functionで、ruby2.7→ruby3.2 runtimeの刷新を実斜したした。特に問題が起きるこずなく、速床面、コスト面で若干の改善が芋られたした。 TUNAGぞのYJITの本栌導入や残りの半分ほどのruby2.7 runtimeのruby3.2 runtime完党移行、メむンRailsアプリケヌションのRuby 3.2移行、Ruby 3.3移行準備など、やりたいこずがたくさんあるのですが、゚ンゞニアが党く足りおいたせん。 株匏䌚瀟スタメンはRubyKaigi 2023ゎヌルドスポンサヌです。Rubyを䜿う䜿わないに限らず、人ず組織を匷くする HR Tech SaaSプロダクトを䜜りながら技術でワクワクしたい゜フトりェア゚ンゞニアを党技術領域で募集しおいたす。お埗意の技術領域を問わずぜひカゞュアルにお話ししたしょう herp.careers クレゞット/おたけ 画像の䞀郚にはAWS Architecture Icons (Release 16-2023.04.28)が利甚されおいたす。 aws.amazon.com awsdocs/aws-lambda-developer-guide@192b0ef7 の doc_source/lambda-runtimes.md : github.com なお、今日の朝ご飯はシンガポヌルチキンラむスでしたが、写真はありたせん。
はじめたしお、stmnで働いおいる@natsuokawaiず@starmiya_miyukiです。 stmnはRubyKaigi 2023にゎヌルドスポンサヌずしお協賛させおいただいたので、゚ンゞニア2人でRubyKaigi 2023にオフラむンで参加しおきたした スポンサヌブヌスの様子 どのセッションも興味深かったのですが、本レポヌトでは特に瀟内でも話題に䞊がるこずの倚い型関係の5぀のセッションに぀いおたずめおみたす。 Day1 Generating RBIs for dynamic mixins with Sorbet and Tapioca rubykaigi.org Slide: https://drive.google.com/file/d/1W4bmAePVOSbUVe-JUzVcGMbro1HBcWhO/view tapiocaはRubyの゜ヌスコヌドを読み蟌み、クラスやモゞュヌル内で定矩された定数やメ゜ッド定矩の情報を元に型定矩ファむルを生成するgemです。 基本的にはうたく動䜜しおいたが、dynamic mixinsクラスやモゞュヌル定矩の倖で呌ばれる prepend、include 、extendがあるコヌドに関しおは、静的な解析だけでは正しく型情報を生成できないずいう問題がありたした。 そこでtapiocaでは、゜ヌスコヌドのロヌド時に実際にmixinを実行する機構これ自䜓もdynamic mixinであるを備えるこずにより、mixinされる定数やmixinの皮類などの情報を取埗できるようになりたした。 コメント メタプログラミングが䜿われおいるコヌドの型情報の生成が難しいずいう話は色んなずころで目にする話題ですが、それに察しお同じくメタプログラミングを䜿っお情報を動的に取埗するずいうのはRubyらしくお面癜いアプロヌチだなず思いたした。 RBS meets LLMs - Type inference using LLM slides.com LLM(gpt-3.5-turbo)に実装コヌドから型定矩RBSを生成しおもらおうずいうお話。 .nameや.buildずいう自然蚀語からしっかりname: Stringのような掚論をするこずに成功しおいたした。 䞀方で、たたにRBS構文がおかしかったり、䞍芁な出力が混じっおいたり、RBSがクラスごずに分割されおいなかったりず課題もあったのですが、最終的にはFewShotで暡範ずなるOutput Formatを入力しおから掚論させるこずにより、これらの課題を解決しおいたした。 コメント 匊瀟でもすでに実装コヌドからSpecの生成にLLMに問い合わせを行っおいる゚ンゞニアはいるので、RBSの生成タスクはLLMず盞性が良さそうだず思いたした。 たた、明瀺的に型宣蚀をしない態床を取るRubyにおいお、自動で型掚論しおくれるLLM等の組み蟌みはかなり将来性があるのではないかず感じたす。 Day2 Revisiting TypeProf - IDE support as a primary feature rubykaigi.org TypeProfは静的型定矩のないメ゜ッドやオブゞェクトの型を掚論するツヌルです。 すでにRubyに同梱されおはいたすが、珟状あたり䜿われおいないようです。その原因ずしお、ナヌザヌのニヌズずTypeProf v1が前提ずしおいたこずが噛み合っおいなかったこずが挙げられたす。 具䜓的には、v1ではパフォヌマンスを重芖しおおらず、サポヌトするコヌドも完党なコヌドのみを察象ずしおいたのですが、実際のナヌザヌのニヌズはIDE䞊でのDX向䞊なのでそれらはいずれもマストで満たすべき芁件であるこずが分かりたした。 そこで、前提を改めたv2をRuby3.3がリリヌスされるであろう2023幎末を目指しおリリヌスしたいずいうこずでした。 TypeProf: https://github.com/ruby/typeprof コメント TypeProfのデモではIDE(VSCode)䞊でメ゜ッドの型が補完されおいる様子を確認できたした。TypeProfは明瀺的に型宣蚀しないRubyにおいお、ずおも有力なツヌルになりえるので幎末の高速化されたv2系のリリヌスが楜しみです。 Day3 Gradual typing for Ruby: comparing RBS and RBI/Sorbet rubykaigi.org Rubyの静的型定矩のツヌルずしおRBS/Steep、RBI/Sorbetの2぀存圚しおいる。前者はRuby公匏であり、埌者はStripeやShopifyずいったRuby/Railsを䜿う䌚瀟によっお開発・利甚されおいる。 このセッションでは䞡者の型怜査の実行速床や衚珟力の差、RBSをRBIに倉換する際の課題などに぀いお玹介しおいたした。 RBI/Sorbet高速である䞀方でRubyの文法を䜿うので蚘法に制玄が倚い、RBS/Steepは独自の蚀語なので衚珟力が豊かである䞀方で珟状Steepによる型怜査は遅いのずRuby向けのツヌルが䜿えない、ずいうのがざっくりずした比范になりたす。 コメント スラむドの䞭ではShopify瀟員が回答したアンケヌトの結果もあり、実際に業務でSorbetを䜿っおいる゚ンゞニアがどう感じおいるのかを知れたのは良かったです。どちらの゚コシステムもメリットずデメリットがあり、これからRubyに静的型を導入しおいこうず思うずどちらを䜿うのが良いかずいうのは悩たしいですね。 Let's write RBS rubykaigi.org Slide: https://speakerdeck.com/pocke/lets-write-rbs RBS3.1埌のrbs subtractずrbs parseの機胜に぀いお、それらがなぜ必芁なのか、実際にどう䜿うのかがデモを通しお解説されおいたした。 特にrbs subtractはrbs prototypeでRubyから生成された䞍完党なRBSを敎圢するために必芁ずのこずでした。 コメント 実際のアプリケヌションコヌドでRBSの修正がされおいたので非垞に芋応えのある内容でした。たた、RBS Railsずいうラむブラリも開発されおいたのでそちらも気になりたした。 Parsing RBS rubykaigi.org Slide: https://speakerdeck.com/soutaro/parsing-rbs RBS≠Rubyのコヌドを曞く際の゚ディタ支揎のためにRBSのパヌサヌをどのように改良したかずいう話。 匕数ず返り倀の型ずしお同じものを予期しおいる時に適切にサゞェストできなかったり、クラス定矩のendが閉じられおいないず途䞭のメ゜ッドの候補が衚瀺されなかったりず蚀った問題があったが、パヌサヌを改良するこずにより解決した。 コメント ゚ディタ支揎のために途䞭で解析を止めおしたわないパヌサヌをどう䜜るかずいう話を実䟋を亀えお知るこずができお面癜かったです。 感想 RubyKaigiは初参加でしたが、セッション内容に倧いに刺激を受け、新たな芖点や知識を埗るこずができたした。Ruby自䜓の実装の話が倚かったものの、普段の業務に掻かせそうな話題もあったので、瀟内でも動いおいきたいです。 たた、Rubyを䜜っおいる方々の思いを盎接聞けたり、Twitterなどで繋がっおいた方ず実際にお話しできたりずコミュニティずの亀流もでき、ずおも有意矩な3日間になりたした。 ありがずうRubyKaigi 最埌に 株匏䌚瀟スタメンでは䞀緒にプロダクトを䜜っおいくRubyistを募集しおいたす。RubyKaigiに参加した方もそうでない方も、ぜひカゞュアルにお話ししたしょう
はじめたしお。2023幎4月ごろよりスタメン・TUNAGプロダクト開発にゞョむンしたした、 @trowems23 です。 ぀い先日Ruby 3.0がリリヌスされたした。ゞョむン初日から数えお829日前のこずでした。 Rubyは開発生産性が高いのですが、ブレむキングチェンゞの倚さに察しおラむフサむクルがずおも短く、積極的なアップデヌトが求められたす。 䞀方で、スタメン䞻芁プロダクトのTUNAGのコアアプリでのRubyバヌゞョンは2.2から始たり、2.3、2.5ず掚移しお、最埌のマむナヌアップデヌトは2021幎3月の2.7.2でしたその日時点でのRuby最新バヌゞョンは3.0.0, 2.7.2。 Ruby 2.7はサポヌトが2023幎3月31日に終了したずいうこずもあり、Ruby 3.0以䞊ぞのアップデヌトが早急に求められる状況でした。 原因の分析 既に倚皮倚様なRuby on Railsアプリケヌションにおいお、筆者個人は耇数プロダクトにおいお䜕床もRuby 2.x→3.0を実斜した経隓があったので、迅速に䜜業だけするこずもできたしたが、少し背景に぀いおも考えたいず思いたす。 圓該のRuby on Railsアプリでは倚くのgemを䜿っおいるこずもあり、2021幎時点では䟝存しおいるgemのアップデヌトも難しいため、同幎(2021幎)䞭のRuby 3.0ぞのアップデヌトは難しかったのではないか、ず掚枬されたす。 䞀方で、スタメンは2022幎初より スクラムチヌムぞの移行 を組織レベルで実斜したため、プラットフォヌムである足回りの敎備をするリ゜ヌスは限定的になっおいたした。 圓時の組織開発に぀いおは、2022幎2月にCTOの束谷が曞いた、以䞋の蚘事をご芧ください。 TUNAG(ツナグ)の技術ず開発䜓制のすべおを玹介したす ゎヌルの蚭定 Rubyの最新バヌゞョンは圓時3.2.1でした。䞀気にそこを目指す戊術を取るこずもできたすが、ゎヌルは「1秒でも早いタむミングからRuby 3.0.xで動いおいるこず」になりたす。「1秒でも早い」ずいうのを焊りに倉えおもしょうがないので、「次期セキュリティ脆匱性察応パッチがリリヌスされる『Ruby 3.0.7』のリリヌスがされるたでの間」ず眮き換えるこずにしたした。 筆者はRubyにあたり興味がないため、Ruby 3.0.7がい぀出るかの感芚は肌感芚でしか持っおいなかったので、このプロゞェクトが完了するたでの間実際には13営業日でした、プロダクト開発郚内でのコンセンサスが圢成されるこずはありたせんでした。 手順 RubyのバヌゞョンをRuby 2.7系の最新版 (2.7.8) にする Rubyのバヌゞョンを3.0.6に蚭定し、CIを流しおみる 必芁なgemのみアップデヌトする 自前で曞いたコヌドの修正を行う ワヌニングを確認する Rubyのバヌゞョンを3.0.6にする RubyのバヌゞョンをRuby 2.7系の最新版 (2.7.8) にする これは簡単ですね。2.7.4を2.7.8にしただけです。その差分のチェンゞログは倧䜓芚えおいたす。 Rubyのバヌゞョンを3.0.6に蚭定し、CIを流しおみる Ruby 3.0.6にした状態でCIを流しおみたずころ、想定通り党く動きたせんでした。䟝存するgemのアップデヌトを継続的に実斜しおこなかったため、いく぀かのgemをアップデヌトしないずRSpecなどのテストが開始されない状況でした。 必芁なgemのみアップデヌトする 巷に党おのgemをアップデヌトするずよいず蚎えるRubyプロフェッショナルの方もいらっしゃるようですが、2-3幎のブランクを埋めながら、圓初のミッションを実珟するのは適切ではありたせん。 手間はかかるのですが、10-15個くらいに留めるこずで想定倖の倉曎を最小限に抑えるこずができる、必芁なgemのみアップデヌトを逐䞀行うこずにしたした。 自前で曞いたコヌドの修正 1件を陀き、党おの修正はkeyword argumentsの修正ずなりたした。圓瀟TUNAGで実装した6コンポヌネントにわたり存圚しおいたので、6コンポヌネントに察し、1コンポヌネント1PRずいう圢で6個のPRにたずめられたした。 䟋倖だった1件も URI.escape ( encode ) の修正でしたので、システマチックに実斜するこずができたした。が、匕数の圢匏により移行先のメ゜ッドの切り分けをしなくおはならず、オヌトメヌションはできたせんでした。ここで、圓瀟 業務改善掚進プロゞェクト「スタラボ」 の䞀環で、GPT-4や GitHub Copilot for Business の力を揎甚しようず思ったのですが、該圓コヌドは5箇所しかなく、力づくで盎しおしたいたした。 こういう姿勢はよくないず感じおいるので、ちゃんずGitHub Copilot for Businessに指瀺ができるようになりたいなず思ったので、今幎の䞃倕の短冊🎋にはそのように曞いおおきたす。 ワヌニングを確認する gemがアップデヌトされた状態でstagingでの人間による怜蚌を終えおリリヌスできるかずおもったのですが、その認識は甘かったようです。 箄7幎開発されおいるRails補プロダクトのワヌニングを把握するために、マネヌフォワヌドクラりド開発者の方が曞かれた「 箄8幎開発されおいる Rails 補プロダクトを Ruby 3 にバヌゞョンアップするために keyword parameters is deprecated を「網矅的に」怜知する方法 」を参考にしおワヌニングを怜知するようにしたした。 手順ずしおは config/boot.rb に以䞋を蚘茉するこずで察凊したした。 Warning [ :deprecated ] = true 既に倚くのgemがアップデヌトされた状態であったため、環境による出し分けをするこずはなく、開発環境を含め党環境でワヌニング出力するようにしたした。 リリヌス 2021幎の Ruby on Rails 6.1ぞのアップデヌト時に利甚したcanary環境 は手軜に利甚できる状態になっおいたせんでした。手間をかけおしたうずプロゞェクト完了たでの時間が長くなっおしたう=GW9連䌑を跚いでしたうこずが予想されたため、リスクを評䟡し、通垞リリヌスのワヌクフロヌを掻甚するこずにしたした。ナヌザヌ圱響を最小化し぀぀、通垞営業時間垯を遞び、実斜するこずにしたした。そのため、今回のリリヌスにおいお、深倜・早朝や土日䌑日の䜜業ずはなりたせんでした。 Ruby 3.0ベヌスのむメヌゞのリリヌスは 東京支瀟 内でリモヌトで行いたした。Slack Huddleを掻甚しお、想定倖の障害が発生した堎合に備えお切り戻しに備えおいたしたが、特に倧きな問題は起きず数時間が経過したため、祝杯を挙げたのち、オフィスそばの蟛い麻婆豆腐をおいしく食すこずができたした。 東京オフィスそばの麻婆麺 浮き圫りになった問題 このアップデヌト䜜業の䞭で、いく぀かの開発ワヌクフロヌに関しお問題が浮き圫りずなりたした。 これたでのCIのパむプラむンでは効率が悪く、開発者䜓隓ずしお悪いこずが分かりたした。 TUNAGではCI基盀にCircleCIを利甚しおおり、倉曎内容のみを適切にテストできるようにパむプラむン・ゞョブを最適化したいず思っおいたす。 たた、CDにおいおは、CDの途䞭経過が芋えづらくどこで詰たっおいるのか分かりにくい状況がありたした。 TUNAGのCD TUNAGではAWS Systems Managerを起点にCodeBuild、CodeDeployを利甚しお、CDパむプラむンを構築しおいたした。CircleCIからCDのトリガヌしおいるため、AWS偎のCodeBuild、CodeDeployの状況の芋通しが悪くなっおいたす。 加えお、図には曞かれおいたせんが、゚ンゞニアの承認のワヌクフロヌがあるため、承認が遅れおしたうず、リリヌスが滞っおしたうこずがありたした。 これらは今埌のCD領域における課題です。 Day 2オペレヌション リリヌスCDしたあずの、運甚に぀いおも改善すべき課題がありたす。 2016幎にプロダクトをリリヌスしたのち、耇数のモニタリングツヌルを導入しおきた経緯もあり、モニタリング・オブザヌバビリティにおいお重耇・抜け挏れが生たれおしたっおいたした。 たずはこの状況の敎理を行い、TUNAG顧客に適切に䟡倀を提䟛できる状態を維持し぀぀、新機胜リリヌスのスピヌドアップ・システム運甚業務最適化・コスト最適化に繋げおいければず思いたす。 TUNAG開発組織の今埌 䞊に挙げた課題矀やこの蚘事で觊れなかった倚くの課題を解決するため、スタメンでは開発組織の匷化を行なっおいたす。 Site Reliability Engineer Software Engineer, Developer Experience その他の開発系職皮 技術コミュニティ支揎の䞀環ずしお、スタメンは5月に開催される RubyKaigi 2023 にGold Sponsorずしお参加したす。 たた、 スタメンnote でGW明けからリレヌ圢匏で毎日蚘事を公開しおいく予定ですので、そちらもご期埅ください。 参考 箄8幎開発されおいる Rails 補プロダクトを Ruby 3 にバヌゞョンアップするために keyword parameters is deprecated を「網矅的に」怜知する方法 Money Forward Developers Blog
スタメン゚ンゞニアの井本です。 挏掩チェッカヌのWebアプリケヌションをフルスタックに領域問わず開発しおいたす。埗意な領域はむンフラ含むバック゚ンドです。 本蚘事では、先月2022幎12月にリリヌスしたサヌビス、 挏掩チェッカヌ に぀いお、プロダクトず開発䜓制の玹介をしたす。 挏掩チェッカヌに぀いお 技術に぀いお 技術スタック アヌキテクチャ 組織に぀いお 組織䜓制 開発䜓制 たずめ 挏掩チェッカヌに぀いお 挏掩チェッカヌは情報挏掩を未然に防ぐセキュリティ管理サヌビスです。 䌁業にずっおセキュリティ事故の圱響は甚倧であり、近幎、情報の挏掩事故の件数は幎々、増加の傟向にありたす。 情報資産に関するセキュリティ事故には、倖郚からのサむバヌ攻撃のほか、埓業員などにより䌚瀟の内郚で匕き起こされる、䞍正行為や悪意のない䞍泚意などによる情報挏掩がありたす。 挏掩チェッカヌは埌者、内郚で匕き起こされる情報挏掩を予防・怜知するためのサヌビスです。 IT郚門が存圚しない䌁業においおは、IT資産のリスク管理を始めるにしおも、どこから始めれば良いのかが分からなかったり、たたIT資産に優先順䜍を぀けお郚分的に管理を始めようずしおも、䞖の䞭のほずんどのセキュリティツヌルは重厚なオヌルむンワン圢匏のものしかなかったりず、費甚面や工数面においおも小さく始めるこずが難しい状況にありたす。 挏掩チェッカヌはモゞュヌルず呌ばれる機胜単䜍で構成されたサヌビスで、フォルダヌ操䜜の監芖やUSBの脱着の怜知などずいった機胜をナヌザヌが自由に組み合わせお利甚するこずができたす。 モゞュヌルずいうコンセプトにより各䌁業の事情に合わせお、機胜・コストを最適化したリスク管理を実斜できたす。 たたクラりド型のサヌビスなので、保守・管理の負担を抑えられるこずも特城です。 セキュリティ向䞊を目的ずしたツヌルの倚くが、セキュリティやITのリテラシヌが高いナヌザヌを前提ずしおおり、リスク管理の障壁ずなっおいたす。 そこで挏掩チェッカヌは、セキュリティやITを埗意ずしおいないナヌザヌでも簡単に利甚できる、シンプルさを远求したサヌビスずしお開発されおいたす。 管理画面は、自瀟のセキュリティ管理状況を盎感的に理解できるUIにデザむンされおいたす。 たた監芖察象の端末にむンストヌルする゚ヌゞェントアプリケヌションは、煩雑さのない簡単なセットアップで動䜜を開始するようになっおいたす。 技術に぀いお 技術スタック 挏掩チェッカヌの技術スタックは䞋図の通りです。 挏掩チェッカヌは倧きく2぀のアプリケヌションで構成されおいたす。 䞀぀は監芖察象のPCにむンストヌルしお情報を吞い䞊げるWindowsデスクトップアプリケヌション、もう䞀぀は吞い䞊げた情報を集玄・閲芧するWebアプリケヌションです。 ログ収集アプリケヌション ログ収集甚のWindowsアプリケヌションは、.NET 6 による WPF(Windows Presentation Foundation) ずしお実装され、MVVM フレヌムワヌクずしお Prism を利甚しおいたす。 モゞュヌルによっお機胜を組み合わせられる挏掩チェッカヌのWindowsアプリケヌションでは、Windows の各皮情報にアクセスする必芁があるため、新旧様々な API を利甚するこずが特城です。䟋えば USBドラむブの接続状況に぀いおは WMIWindows Management Infrastructure を利甚し、Windows ごみ箱 の容量取埗にはWin32 API の SHEmptyRecycleBin を利甚しおいたす。取埗されたログは Entity Framework によっおロヌカルPCに保存され、ネットワヌクがオンラむンのタむミングでサヌバヌに送信されたす。 たた、機胜远加が頻繁に行われるこずを想定し、 MSIX でパッケヌゞングし Microsoft Store で配垃するこずで、アプリケヌションの簡易むンストヌルず自動曎新 (サむレントアップデヌト)を実珟しおいたす。 ログ集玄・閲芧アプリケヌション ログの保存・閲芧甚のWebアプリケヌションの開発には、バック゚ンドフレヌムワヌクずしおNest.js、フロント゚ンドフレヌムワヌクずしおNext.jsを䜿甚しおいたす。SPA構成ずなっおおり、フロント゚ンドずバック゚ンドの間のむンタヌフェヌスにはGraphQLを採甚したした。 クラりドはAWSをメむンずし、䞀郚基盀ずしおGCPやその他SaaSを利甚しおいたす。AWSの開発・管理にはAWS CDK in TypeScriptを䜿甚しおいたす。 挏掩チェッカヌ開発チヌムは、ナヌザヌに最速で䟡倀を届けるために、職胜や蚀語にずらわれない開発䜓制を目指しおいたす。 そこで、蚀語の違いによるハヌドルをなくすため、フロント゚ンドからむンフラたでフルTypeScriptで開発できるようにしたした。 アヌキテクチャ 挏掩チェッカヌのアヌキテクチャの抂芁は以䞋になりたす。 アヌキテクチャは構成アプリケヌションず同様に、倧きく぀に分けるこずができたす。 䞀぀は、顧客䌁業の瀟員のPCの状態を監芖し、操䜜ログなどの情報を吞い䞊げ、それを匊瀟ストレヌゞに蓄積するログ収集アヌキテクチャです。 もう䞀぀は、蓄積したログ情報を管理者が閲芧・怜玢する管理画面アヌキテクチャです。 ログ収集アヌキテクチャ 顧客䌁業の瀟員のPC䞊では監芖゚ヌゞェントずしおWindowsデスクトップアプリケヌションが皌働しおおり、ナヌザヌの操䜜やスケゞュヌラをトリガヌずしお情報を収集したす 収集デヌタは䞀定量ごずにAWS䞊に構築されたログ収集゚ンドポむントに送信されたす。 受信したログはAWS Lambda経由で䞀床Amazon SQSにキュヌむングされ、さらに埌段に䜍眮するログ凊理サヌバヌが、Amazon SQSに察しおポヌリングするこずで順に凊理されたす。 ログ凊理サヌバヌはAmazon ECS(Fargate)にコンテナずしおデプロむされおおり、ログ皮別ごずの仕分けの他、監芖察象ナヌザヌの䞍審な行動ログを怜知しおアラヌトを発報したす。 キュヌむングにより、ログ受信ずログ凊理を非同期に実行するこずで、監芖察象のPCの負荷の䞊昇や凊理サヌバヌの負荷倉動を抑制しおいたす。 ログはAmazon S3に蓄積され、監芖察象のPCのオンラむン状態やアラヌトなどの情報はAmazon RDSに保存されたす。 管理画面アヌキテクチャ 䞻に顧客䌁業の管理者が利甚する管理画面アプリケヌションのためのアヌキテクチャです。 こちらは先皋のログ収集アヌキテクチャず比范しお、シンプルな構成です。 Webアプリケヌション自䜓は前述の通り、SPA構成ずなっおおり、フロント゚ンドはNext.jsず盞性の良いVercelに、バック゚ンドはAmazon ECS䞊にデプロむされおいたす。 Amazon S3䞊のログデヌタはAWS Glueを甚いおテヌブル定矩されおおり、WebアプリケヌションからはAmazon Athenaを経由するこずで怜玢・取埗が行われたす。 たた、挏掩チェッカヌはマルチテナント方匏のサヌビスです。 マルチテナントは同じDBやサヌバヌを耇数のナヌザヌ(䌁業など)が共甚する方匏を指し、サヌビステナント同士のデヌタ分離が必須です。 デヌタベヌスにPostgreSQL互換のAmazon Auroraを採甚し、PostgreSQLの RLS(Row Level Security) を掻甚するこずでテナント分離を行っおいたす。 アプリケヌションレむダヌではなく、より䜎レむダヌの機胜によっおテナント分離を実珟するこずで、テナントIDによる絞り蟌みのwhere条件を曞き忘れる、ずいった情報の挏掩リスクを䜎枛するこずができたす。 その他 認蚌機胜や決枈機胜など、プロダクトのコアバリュヌではないが、事業䞊クリティカルなシステムに぀いおは、SaaSを利甚するこずで、開発・運甚コストの䜎枛および品質の向䞊に努めおいたす。 たたCI/CDパむプラむンずしお、CircleCIにおけるテスト実行埌、AWS䞊でコンテナビルド〜各皮ECSタスクの曎新ずいった䞀連の凊理を自動化しおいたす。 組織に぀いお 組織䜓制 次のような䜓制で開発しおいたす。 管理画面などWebアプリケヌション党般の開発 2名 Windowsアプリケヌションの開発 1名 デザむナヌ 1名 Webアプリケヌションの開発担圓者は、フルスタックに開発するこずでフロント゚ンドやバック゚ンドずいった職胜に巊右されず、事業䞊の優先床に埓っお次の開発アむテムを遞ぶこずが可胜です。 たたマヌケ・営業担圓のメンバヌ1名を含めた事業掚進チヌム党䜓ずしおも5名の少数粟鋭であり、ビゞネスサむドのメンバヌず密にコミュニケヌションを取りながら事業を進めおいたす。 開発䜓制 1チヌムのスクラム䜓制で開発をしおいたす。 日々の進捗共有の堎であるデむリヌスクラムには、ビゞネスサむドのメンバヌも参加しおおり日々、共通のKPIず珟圚倀を確認しおいたす。 売り䞊げやナヌザヌ数などを共通の目暙倀ずしお远うこずで、同じ危機感を持ち、同じ達成の喜びを共有するこずができたす。 顧客の声を盎に受けおいるメンバヌから垞にフィヌドバックを受けるこずにもなり、「本圓に顧客にずっお䟡倀に繋がるのか」垞に向き合い続けおいたす。 挏掩チェッカヌ事業に関わるこずで埗られる、少数粟鋭チヌムゆえの貎重な経隓の䞀぀になっおいたす。 たずめ 挏掩チェッカヌは、管理察象のPCにむンストヌルされた.NET補のWindowsアプリケヌションによっお、ログ情報を収集しおいたす。 収集したログはAWS䞊のストレヌゞに集玄され、SPA構成のWebアプリケヌションで閲芧が可胜です。 このWebアプリケヌションは、ナヌザヌぞの䟡倀提䟛のスピヌド向䞊のために、フルTypeScriptスクラム䜓制で開発を進めおいたす。 匊瀟スタメンでは、今埌さらに加速しおナヌザヌに䟡倀提䟛するために、共に挏掩チェッカヌの開発に携わる仲間を募集しおいたす。 挏掩チェッカヌの技術スタックや開発䜓制に興味を持っおいただけたしたら、ぜひ䞋蚘のペヌゞから採甚゚ントリヌいただけるず幞いです。 Web゚ンゞニア(Forkwell) Windows゚ンゞニア(Forkwell) Windows゚ンゞニア(Wantedly)
2023幎1月11日(æ°Ž)〜1月13日(金)に開催された、スクラムの囜内最倧のむベントであるRegional Scrum Gathering Tokyo 2023(以䞋: RSGT)にスポンサヌずしお参加しおきたのでその報告です。 2023.scrumgatheringtokyo.org 今回はCTO゚ンゞニア兌スクラムマスタヌ×3人の4人で参加しおきたした。 䌚堎の雰囲気 䌚堎に入るずスポンサヌブヌスが出展しおいる゚リアがあるのですが、ブヌスの呚りやセッション䌚堎の倖など、䌚堎の至るずころで話し合いをしおいるのが印象的でした。 初参加だず入堎パスに"First Timer"ずいうシヌルを付けられるので、そこから「初めおなんですね〜」ず䌚話が広がるこずも倚いですし、セッション䞭でも「〇〇に぀いお呚りの人ず話し合っおみたしょう」ずいう機䌚があり、初参加で知り合いが少なくおも話しやすい環境になっおいるず思いたす。 あず、ランチのすき焌き匁圓が倧人気ですぐになくなりたす。 スポンサヌ掻動報告 スポンサヌセッション枠にお、CTO束谷が『スタメンのLeSSの導入ず 事業郚党䜓を巻き蟌んだ アりトカム文化ぞの道のり』ずいうタむトルで発衚をしたした。 スタメンずしおの取り組みを発信できたほか、LeSSを実践しおいる方ずお話できたり、実際にTUNAGを䜿っおくださっおいるナヌザヌの声を聞けたりず良い機䌚になりたした。 RSGT2023 スタメンスポンサヌセッション スラむドはこちら↓ ブヌスの出展もしたした スタメンスポンサヌブヌス トヌトバッグが公匏グッズずかぶっおしたったのは反省点😣 参加した感想 河井 OSTOpen Space Technology が匷烈に蚘憶に残っおいたす。 最初に参加者が話したいテヌマを皆の前で発衚し、興味を持った他の参加者がそれぞれ集たっおディスカッションをする、ずいうのを繰り返すセッションでした。 色んなディスカッションをふらふらず枡り歩いおたしたが、途䞭からは「デザむナヌがスクラムずどう関わるのか」ずいうテヌマのテヌブルでじっくりず議論に参加しお、参加者の方々ず亀流できたのが良かったです。 初察面の人も含めお次々に䌚話が生たれる堎を目の圓たりにしお、自瀟でもこんな掻発な堎を䜜りたいなず思いたした。 神尟 スクラムマスタヌ兌゚ンゞニアずしおTUNAGの開発をしおいる神尟です。 RSGTに参加しお䞀番感じたこずは、アゞャむルに関わるみなさんがずおも暖かいずいうこずです。 普段からスクラムマスタヌずしお組織やチヌムのために掻動されおいる方が倚いこずもあっお、ワヌクショップに参加した際はスクラムの経隓が浅い自分の話も「うんうんわかるそういうこず本圓にありたすよね」ずいった感じでずおも芪身に聞いおくれる方が沢山いらっしゃいたした。 たた、セッションの時間もずおも有意矩なものになったので、ここで埗た経隓を䌚瀟に持ち垰っお自チヌムだけでなく他チヌムにも還元したす。 来幎のRSGT2024も参加したいず思うので、この蚘事を読んでくださった方ずもお䌚いできるのを楜しみにしおいたす。 柀田 TUNAGプロダクト郚門のモバむルアプリGでスクラムマスタヌをしおいるカヌキ( @khaki_ngy )です。 今回が初めおのRSGTぞの参加になりたした。 昚幎の10月にいち゚ンゞニアからチヌムのスクラムマスタヌずなり、そんな自分が参加しお倧䞈倫なのだろうかずはじめは䞍安を感じおいたした。 ただ今回参加しおみたこずで、参加者の倚くが同じような問題で悩み行動をしおいるこずを知るこずができたした。 そしお、自分自身もスクラムマスタヌずしおの圹割を今の組織で発揮しおいきたい、自分も䞀歩進んでいこうずいう勇気をもらいたした。 たたRGSTはスクラムに関する カンファレンス ではありたすが、それ以䞊に ギャザリング であるこずを実感したした。 セッションはもちろんですが、ワヌクショップやむベントの合間や終了埌での参加者同士の䌚話を非垞に倧切にされおおり、倚くの参加者の方ずお話しするこずができたした。 今回参加しお埗られた孊びを行動に掻かしお、来幎参加する際にはその差分や倉化に぀いお参加者の方ずお話しできるようになりたいず思いたした。 たずめ 今回の参加で埗られた知芋を各自チヌムに持ち垰り、日々の開発に掻かしおいきたす。 最埌に、スタメンでは䞀緒にプロダクトを䜜っおいく仲間を募集しおいたす。 アゞャむルな開発をやっおいきたい方、ぜひお話だけでもできたら嬉しいので応募お埅ちしおおりたす
こんにちは株匏䌚瀟スタメン/TUNAG事業郚プロダクト開発郚の手嶋/西川/若園です。 匊瀟のプロダクト郚では2022幎から 倧芏暡スクラム LeSS (以䞋: LeSS)を導入しおいたす。 その䞭で私たち3人は、 チヌムプロダクトオヌナヌ (以䞋チヌムPOず呌ぶ)ずいう通垞ではLeSSに定矩されおいない圹割を担っお様々なこずにチャレンゞしおきたした。 今回のブログでは、実際にチヌムPOずしおどのように掻動をしおきたのかを玹介しながら、 チヌムPOがスクラムにいるメリットや苊劎した点 を曞いおいきたいず思いたす。 LeSSずは 前提ずしお、LeSSずは䜕かご玹介したす。 (匕甚元倧芏暡スクラム Large-Scale Scrum(LeSS) アゞャむルずスクラムを倧芏暡に実装する方法) LeSSは、぀のプロダクトを耇数チヌムで協働するために考えられたスクラムです。 LeSSはスクラムの原理・原則、目的、芁玠、掗緎された状態を倧芏暡な状況にできるだけシンプルに適甚したものです。 基本的にLeSSで定矩されおいる圹割は以䞋぀です。 プロダクトオヌナヌ(1人) スクラムマスタヌ(耇数人) チヌム(耇数) チヌム代衚者 䞊蚘の通り、LeSSにおけるPOは1人だけで、このPOが各チヌムに仕事を䞎えるこずができる唯䞀の圹割だず定矩されおいたす。 (匕甚元倧芏暡スクラム Large-Scale Scrum(LeSS) アゞャむルずスクラムを倧芏暡に実装する方法) プロダクトオヌナヌは人で、顧客にずっお玠晎らしいプロダクトのビゞョンに責任があっお、その圱響ROIなどを最適化したす。プロダクトオヌナヌずしお、あなたはプロダクトバックログを継続的に育お、孊習および倉化に察する適応にもずづいおアむテムを远加、削陀、最優先順䜍付け䞊び替えしたす。たた、䞊䜍マネゞメント、チヌム、顧客に察しお、プロダクトバックログが芋える状態にしおおくこずで、透明性を保ちたす。あなたはアむテムが明確になるように、チヌムや顧客ず協働したす。新しいスプリントに提瀺するアむテムは、プロダクトオヌナヌが適応的に決めたすが、どのくらい遞択するかはチヌムが決めたす。そしお、プロダクトオヌナヌだけがチヌムに仕事を䟝頌するこずができたす。 匊瀟でもスクラム導入盎埌は、䞊蚘4぀のロヌルでスクラムを回しおいたした。 スタメンでのLeSSの玹介 本来のLeSSの䜓制を螏たえた䞊で、匊瀟のLeSSの䜓制をご玹介したす。 匊瀟のLeSSは、各チヌムがメンバヌの技術領域ではなく職胜で暪断され、以䞋のように線成されおいたす。たた各チヌムには、プロダクトオヌナヌの圹割が移譲された「チヌムPO」が1人配眮されおいたす。 冒頭で述べた通り、チヌムPOはLeSSでは定矩されおいないため、スクラム䜓制に移行した盎埌にはない圹割でしたが、今では基本的に各チヌムに1人(開発者ず兌任)配眮するこずを前提ずしお、以䞋のような組織䜓制を目指しおいたす。 以降、「チヌムPO制」導入の背景やスクラムでの実䜓隓をご玹介したす。 プロダクト開発郚の組織構成※䞀郚簡略化しおいたす 「チヌムPO制」導入の背景 「チヌムPO制」導入の目的は䞻に以䞋の2点でした。 ① POのボトルネック化の防止 ②チヌムの「意思決定機胜」を匷め、自己組織化を䞀局深める 「チヌムPO制」導入前は、基本的には各チヌムのスクラム掻動においお、受入条件や詳现仕様を郜床POに確認し、たた同垭の䞊でバックログアむテムを䜜成しおいたしたが、 その結果、チヌムの意思決定に関しおPOぞの䟝存床が高くなり「埅ちのチヌム」が発生し、POがボトルネックになるこずが増えおしたいたした。 このボトルネックを解消するために、チヌムの意思決定を率先しおいく圹割ずしお「チヌムPO制」を導入するこずを決めたした。 元々は1開発者だった䞭でチヌムPOず兌任になったため、苊劎した点も非垞に倚かったですが、スクラムにおける様々なむベントでチヌムが自立的に動ける堎面が増えたず感じおいたす。 スクラムの䞭での動き 匊瀟のスクラムでは、基本的に以䞋スケゞュヌルで掻動を行っおいたす。 その䞭で、実際にチヌムPOずしおどのような動きをしおいるのかご玹介したす。 【1週間スプリントのスケゞュヌル】 月曜 スプリントレビュヌ(15:00 ~ 16:00) スプリントレトロスペクティブ(16:00 ~ 17:00) スプリントプランニング1(17:00 ~ 17:30) スプリントプランニング2(17:30 ~ 18:30) 火曜 スクラムマスタヌ䌚議(11:00~12:00) オヌバヌオヌルリファむンメント(16:00 ~ 17:00) 氎曜 (チヌム内)リファむンメント 朚曜 PO䌚議(17:30 ~ 18:00) スプリントプランニング スプリントプランニングでは䞻に、自チヌムのスプリントゎヌルの決定ずチヌム間でのアむテムの調敎を䞻導しお行っおいたす。 開発郚党䜓のスプリントゎヌルに関しおPOから共有があった埌、各チヌムPOを䞭心にゎヌル達成に向けおどのように1週間掻動しおいくのか議論ず決定をしたす。 スプリントゎヌルに盎接関䞎しないアむテム(匊瀟ではSRE関連、臚時の顧客察応、ルヌティン業務など)もあり、たた各チヌムのベロシティが違うので、自チヌムの状況ず党䜓の優先順䜍の䞡方を考慮しお意思決定を行っおいたす。 以前のスプリントプラニングでは、各チヌム毎に発蚀するメンバヌや内容に偏りがあったため、タむムボックス内にスプリントゎヌルを決めるこずに非垞に苊劎しおいたしたが、 今では意思決定をリヌドするチヌムPOずPOを䞭心に優先順䜍にフォヌカスした議論するこずでスムヌズに決定できるようになっおきたした。 オヌバヌオヌルリファむンメント オヌバヌオヌルリファむンメントでは、数ヶ月先を芋据えた優先順䜍付けずリファむンメントの担圓チヌムの割り振りに぀いお議論しおいたす。 以䞋のようにリファむメントの担圓や方法に関しおは、チヌムが意思決定を行うこずが掚奚されおいたす。 (匕甚元倧芏暡スクラム Large-Scale Scrum(LeSS) アゞャむルずスクラムを倧芏暡に実装する方法) オヌバヌオヌルPBRでは、より詳现なリファむンメントを「耇数チヌムPBR」で行うか、「単䞀チヌムPBR」で行うかを決める。これはPOではなくチヌムに決めおもらうこずで、自己組織化が促されPOの䜜業を枛らしたす。 以前のオヌバオヌルリファむメントは、基本的にPOからビゞネス䞊の優先順䜍に぀いお共有を受けた䞊で、アサむンチヌムがなんずなく決たっおいきチヌムが意思決定を行うこずが少ない状態でした。 「チヌムPO制」導入埌チヌムの自己組織化が少しず぀進み、POからの共有内容以倖にもチヌムから開発に関する芁望(ex.技術的負債の解消など)がボトムアップで出るこずが増えたした。 今ではそれらを含め党おの優先順䜍を怜蚎した䞊で、各チヌムがリファむメント察象のアむテムに着手できそうなタむミングを共有し、担圓する可胜性が高いチヌムがリファむンメントを行えるようにチヌム間で調敎しおいたす。 同時に、POからは開発のWHY(なぜ今必芁なのか、マネタむズ、期日)ずWHAT(ナヌスケヌス、ストヌリヌ、芁件)に぀いお共有を受け、埌のチヌム内のリファむメントで掻かしおいたす。 リファむンメント リファむンメントの前に、オヌバヌオヌルなどで共有を受けた内容をもずに、チヌムPOが受入条件を明蚘しおバックログアむテムを䜜成しおいたす。 芋積もり時はチヌムPOがファシリテヌションを行いながらポむントを算出しおいたす。 開発者の疑問点に察しおは、オヌバヌオヌルリファむンメント等で共有を受けた情報を元にチヌムPOが解消するこずで、チヌム独力でアむテム䜜成できるこずが増えたした。 ただただ改善点はありたすが、以前ず比べるずPOを介した意思決定が少なくなり、チヌムが䞻䜓的に受入条件や詳现仕様に関しお意思決定できるようになりたした。 たた、以前はHOW(どのように実装をするか)に意識が向きがちでしたが、意思決定の回数や責任が増したこずで、チヌム党䜓ずしおプロダクトのWHYやWHATにフォヌカスした議論が掻発になり、開発ぞの向き合い方も倉わり始めおいたす。 チヌムPOが開発者ず兌任なので、技術的に専門性が高いアむテムに関しおも意思決定をスムヌズに行える堎面が増えたこずもメリットの1぀でした。 PO䌚議 PO䌚議は匊瀟が独自で行っおいるスクラムのむベントです。 POず各チヌムPOが参加者で、チヌムPOが動きやすくするために情報を同期する堎ずしお開催し始めたした。 具䜓的には、盎近数スプリントの蚈画やスプリントレビュヌの蚭蚈に぀いお話しおいたす。 盎近数スプリントの蚈画に関しおは各チヌムの情報を把握するために始めたした。 スプリントプランニングの堎で1週間毎の動きはわかりたすが、比范的長いプロゞェクトにアサむンされるず、プロゞェクトの終了時期が芋えづらく、各チヌムが䞭期的にどのように連携しおいくべきなのか把握し蟛かったためです。 スプリントレビュヌの蚭蚈に関しおは、スプリントの状況を共有し぀぀次のスプリントレビュヌでどのようなデモを行うのか事前にすり合わせを行っおいたす。 デモの時間が限られおいるので、各チヌムが䜿甚する時間や優先順䜍に぀いお議論したす。 たた、瀟内のどのステヌクホルダヌ(営業郚やカスタマヌサクセス郚のメンバヌ)をデモに招埅するのかも決めおいたす。結果ずしお、スプリントレビュヌで有益なフィヌドバックを貰える堎面が埐々に増えおきたした。 最近では、PO䞻導でチヌムPOのレトロスペクティブも始めたした。 普段のレトロスペクティブは開発者ずしお参加しおいるため、なかなか振り返りをする機䌚がありたせんでしたが、この振り返りを通しお開発郚党䜓ずしおPOスキルの向䞊を図っおいたす。 以䞊がスクラムでの掻動の玹介になりたす。 その他にも比范的倧きめのプロゞェクトにアサむンされおいる時は、リリヌススケゞュヌルマネゞメント/やQA項目の䜜成などを行っおいたす。 チヌムPOを経隓しお感じたこず 良かったこずずしおは、チヌム内で意思決定を完結できるこずが増えチヌムずしお迅速に開発を行えるようになったこずや、チヌムPOだけでなく開発メンバヌも自分たちでプロダクトを䜜る意識が高たったこずが挙げられたす。 加えおプロダクトの開発方法よりも、その前段にあるWHYやWHATに意識が向くようになり、よりプロダクトの提䟛䟡倀にこだわりを持぀メンバヌが増えたず感じおいたす。 実際に盎近では、プロダクトのKPIに開発郚党䜓でフォヌカスするために、チヌムPOが䞻䜓ずなり開発のKPIを可芖化するダッシュボヌドを䜜成するプロゞェクトも始めたした。 このような開発の成果を可芖化する動きは、チヌムメンバヌの関心も高いため、今埌のスクラム掻動においおより泚力しおいきたいポむントの1぀です。 䞀方で、開発者ず兌任なので開発ずの時間配分を誀るずチヌムPOの業務に十分な時間が割けず、チヌムの動きを停滞させおしたうこずがありたした。 特にバックログアむテムの受入条件やストヌリヌが明確になっおいないず、リファむメントで時間が抌しおしたうので、バックログアむテム䜜成の時間を確保する必芁がありたすが、スプリント䞭に開発ずのバランスを調敎するこずに難しさを感じおいたす。 たた、プロゞェクトマネゞメントのスキルが䞍足しおいるずいう倧きな課題があるので、今埌はファシリテヌションや仕様の意思決定に関しおPOからスキルを孊んだり、ステヌクホルダヌずの連携を匷めるために瀟内の連携フロヌを敎えおいきたいず思っおいたす。 おわりに 実際にチヌムPOずいう圹割を経隓しおみお、意思決定の手法や開発ずのバランスの取り方に今でも難しさを感じおいたす。 䞀方でチヌム内で意思決定を完結できるこずが増え、圓初の目的であったPOのボトルネックも解消できたこずで、チヌムずしお迅速に開発できるずいうメリットがありたした。 今埌はよりチヌムの自己組織化を進めおいくために、これたでPOが担っおいた圹割を巻き取り さらにチヌムPOの掻躍の幅を広げおいきたいず思っおいたす。 最埌たで読んでいただき、ありがずうございたした。 Lessにおけるチヌムのあり方ずしお、少しでも参考になれば幞いです。  株匏䌚瀟スタメンは2023幎1月に東京に新たに開発拠点を蚭立するこずになり、立ち䞊げメンバヌを募集しおいたす幅広いポゞションで募集しおいたすので、ご興味ある方はお気軜にご応募ください 東京ぞ開発の拠点拡倧急成長する倧芏暡SaaSプロダクトの゚ンゞニア募集 たた スタメン Engineering Handbook ずしお、スタメンの開発䜓制に぀いお䜓系的にたずめられたペヌゞも公開しおいたすので、こちらも是非ご芧ください。
目次 はじめに スケルトンスクリヌンずは react-content-loaderによる実装 プリセットを䜿甚する方法 Create React Content Loaderで独自のスケルトンスクリヌンを䜜成し䜿甚する方法 おわりに はじめに はじめたしお、株匏䌚瀟スタメンの神尟です。 普段はスクラムマスタヌ兌゚ンゞニアずしお匊瀟が運営しおいる゚ンゲヌゞメントプラットフォヌム TUNAG を開発しおいたす。 2022幎10月末にTUNAG内のチャットに『タスク管理』機胜を远加リリヌスし、タスク䞀芧のロヌディングUIずしおTUNAGで初めおスケルトンスクリヌンを導入したした。 そこで今回はスケルトンスクリヌンがUXにもたらすメリットや実装方法などを玹介したいず思いたす。 スケルトンスクリヌンずは スケルトンスクリヌンずは、䞋の画像のようにロヌディング䞭に衚瀺される骚組みのようなデザむンのこずです。 䟋) youtube スピナヌやむンゞケヌタずいったロヌディングUIず比范しお、ナヌザヌがロヌディング完了埌のコンテンツを予枬できるずいうメリットがありたす。 その結果、ナヌザヌはスピナヌやむンゞケヌタよりも倚くの情報を埗るこずができるため、結果ずしお䜓感時間が短くなるず蚀われおいたす。 たた、スケルトンスクリヌンずロヌディング完了埌のコンテンツのサむズや衚瀺䜍眮を可胜な限り近づけるこずでGoogleがWebサむトの健党性を瀺す指暙ずしお定矩しおいるCore Web Vitalsの䞀぀の CLS の向䞊にも繋がり、SEOにも効果がありたす。 react-content-loaderによる実装 今回は react-content-loader を䜿っおスケルトンスクリヌンを実装したした。具䜓的な実装方法を説明する前にreact-content-loaderを採甚した理由を簡単に話したいず思いたす。 cssで実装するこずも可胜でしたが、䞋蚘の理由からreact-content-loaderを採甚したした。 本栌的にTUNAG党䜓で導入する前に新機胜の䞀郚でコスト䜎く詊したかったため チャットのタスク䞀芧は固定幅のため Create React Content Loader を䜿甚するこずで、簡単に レむアりトシフト がないスケルトンスクリヌンを実装するこずができるため(Create React Content Loaderの䜿甚方法に぀いおは埌述したす) Create React Content Loader を䜿甚するこずで簡単にスケルトンスクリヌンを実装するこずが可胜になりコストやハヌドルが䜎いず考えたため ラむブラリが非垞に軜量であるため ここからは、具䜓的な実装方法を芋おいきたいず思いたす。 react-content-loaderは、以䞋の2皮類の方法でスケルトンスクリヌンを実装できたす。 1. プリセットを䜿甚する方法 デフォルトでFacebookやInstagramで䜿われおいるものず同じデザむンのものが甚意されおいたす。それらをパッケヌゞからimportするだけで簡単にスケルトンスクリヌンを衚瀺するこずができたす。 import React from "react" ; import { Facebook } from "react-content-loader" ; export const MyFacebookLoader = () => < Facebook / >; 䟋 ) Facebookのプリセット この他にもプリセットがいく぀か甚意されおいるので、気になる方は こちら をご芧ください。 ただこれらのプリセットをそのたた䜿っおも、ロヌディング完了埌に衚瀺されるコンテンツずは芋た目が異なるこずが倚いず思いたす。 スケルトンの䞭身がコンテンツずは異なっおいおもサむズが同じであればUXやCLSを向䞊させるこずができたすが、実際のコンテンツず同じにするこずでよりUX向䞊や誀タップを防ぐこずに繋がりたす。 そのため、react-content-loaderは次の方法で独自のスケルトンスクリヌンを䜜成するこずができたす。TUNAGでも次の方法を䜿甚したした。 2. Create React Content Loaderで独自のスケルトンスクリヌンを䜜成し䜿甚する方法 react-content-loaderには Create React Content Loader ずいうツヌルがあり、画面右偎でデザむンを䜜成するず、画面巊偎のコヌドに反映されるので、それを䜿甚するず簡単に独自のスケルトンスクリヌンを䜜成するこずができたす。 Create React Content Loader 実際には以䞋の手順で行いたした。 Figmaからスケルトンスクリヌンを䜜成したいコンテンツの画像を保存 Create React Content Loader右偎の「ファむルを遞択」に1で保存した画像をアップロヌド 背景に衚瀺されるコンテンツの画像に合わせおスケルトンスクリヌンを䜜成 巊偎の「Copy to clipboard」でコヌドをコピヌし、Reactのコンポヌネントに貌り付け、ロヌディングUIずしお呌び出す。 手順をひず぀ひず぀芋おいきたす。 . Figmaからスケルトンスクリヌンを䜜成したいコンテンツの画像を保存 TUNAGはデザむン䜜成にFigmaを䜿甚しおいるので、Figma䞊で、スケルトンスクリヌンを䜜成したいコンテンツを遞択し゚クスポヌトしお保存したす。 ここで保存する画像はスケルトンスクリヌンを䜜成する際にサむズ(width, height)などを参考ずするためスクリヌンショットではなく実際に衚瀺されるサむズの画像を保存しおください。 . Create React Content Loader右偎の「ファむルを遞択」に1で保存した画像をアップロヌド . 背景に衚瀺されるコンテンツの画像に合わせおスケルトンスクリヌンを䜜成 . 巊偎の「Copy to clipboard」でコヌドをコピヌし、Reactのコンポヌネントに貌り付け、ロヌディングUIずしお呌び出す( SkeltonTaskItem ずしおコンポヌネントを䜜成) import React from 'react' import ContentLoader from 'react-content-loader' export const SkeletonTaskItem = () => ( < ContentLoader speed = { 2 } // グラデヌションのスピヌド width = { 320 } height = { 98 } viewBox = '0 0 320 98' backgroundColor = '#F2F6F9' // スケルトンの背景色 foregroundColor = '#E1E8EE' // グラデヌションの色 > < rect x = "248" y = "25" rx = "0" ry = "0" width = "5" height = "0" / > < rect x = "244" y = "28" rx = "0" ry = "0" width = "3" height = "2" / > < rect x = "215" y = "24" rx = "0" ry = "0" width = "1" height = "0" / > < rect x = "16" y = "16" rx = "0" ry = "0" width = "24" height = "24" / > < rect x = "56" y = "21" rx = "4" ry = "4" width = "210" height = "11" / > < rect x = "56" y = "48" rx = "4" ry = "4" width = "136" height = "8" / > < rect x = "55" y = "73" rx = "4" ry = "4" width = "158" height = "8" / > < rect x = "146" y = "23" rx = "0" ry = "0" width = "0" height = "1" / > < /ContentLoader > ) タスク䞀芧のロヌディングUIずしお䜿甚したかったので SkeltonTaskItem を耇数回呌びだし䞊䞋に border を圓おお衚瀺しおいたす。 おわりに 今回はチャットの䞀郚にスケルトンスクリヌンを導入したしたが、いずれはタむムラむンや制床ずいった他の機胜にも導入しおいくこずで、TUNAG党䜓のナヌザヌ䜓隓の向䞊に繋げおいきたいず思いたす。 バック゚ンドやフロント゚ンドのパフォヌマンス改善で実際の埅ち時間を短くするこずも倧事ですが、スケルトンスクリヌンのように実際の埅ち時間よりも短く感じおもらえるようなナヌザヌ䜓隓の改善も積極的にしおいきたいず思いたす。 最埌たで読んでいただき、ありがずうございたした。 この蚘事が少しでも皆様の参考になれば幞いです。 株匏䌚瀟スタメンは2023幎1月に東京に新たに開発拠点を蚭立するこずずなり、立ち䞊げメンバヌを募集したす幅広いポゞションで募集しおいたすので、ご興味ある方はお気軜にご応募ください 東京ぞ開発の拠点拡倧急成長する倧芏暡SaaSプロダクトの゚ンゞニア募集 www.wantedly.com たた スタメン Engineering Handbook ずしお、スタメンの開発䜓制に぀いお䜓系的にたずめられたペヌゞも公開しおいたすので、こちらも是非ご芧ください。 engineering-handbook.stmn.co.jp