複雑な画面をリファクタした話

Slide 1

Slide 1 text

ෳࡶͳը໘ΛϦϑΝΫλͨ͠࿩ © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . גࣜձࣾΞτϥΤ ZFOUB ࠤ౻ເੵ 5XJUUFS!NVUUVT@

Slide 2

Slide 2 text

2 ࠤ౻ເੵ .VUTVNJ   גࣜձࣾΞτϥΤ೥৽ଔೖࣾ ZFOUB "OESPJEΞϓϦΤϯδχΞࣾ಺Ͱਓ ॳ-5 5XUJUUFS!NVUUTV@ (JUIVC!NVUUTV © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d .

Slide 3

Slide 3 text

ࢿຊۚ ԯ ສԁ גࣜձࣾΞτϥΤ ˞(SFBU1MBDFUP8PSL*OTUJUVUF+BQBO࣮ࢪʢैۀһʙ໊ͷ෦ʣ ԯԁ ࣌Ձ૯ֹ ࣾһ਺ ໊ ౦ূϚβʔζ্৔ ೥݄ ೥݄ ౦ূҰ෦ʹࢢ৔มߋ ࠃ಺ϥϯΩϯά ΞδΞϥϯΩϯά ೥൛ʮಇ͖͕͍ͷ͋Δձࣾʯ Ґ Ґ ΞτϥΤઃཱ ೥݄ ౦ূҰ෦্৔ɿ Ԋֵ ࣌఺ © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . 3 ձࣾ֓ཁ

Slide 4

Slide 4 text

4 1FPQMF5FDI$PNQBOZͱࣗࣾΛ࠶ఆٛ ୯ͳΔ)3ྖҬͰ͸ͳ͘ ςΫϊϩδʔʹΑͬͯ ਓͷՄೳੑΛ֦͛ΔࣄۀΛ૑଄ νʔϜྗΛݺͼى͜͢ ૊৫վળϓϥοτϑΥʔϜ ϏδωεΛՃ଎ͤ͞Δ ग़ձ͍ΛੜΈग़͢ "*ϏδωεϚονϯάΞϓϦ ʮਓͱ૊৫Λݩؾʹ͢Δʯ ੒ޭใुܕٻਓϝσΟΞ ձࣾ֓ཁ#VTJOFTT © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d .

Slide 5

Slide 5 text

ࣄۀ঺հZFOUB ϏδωεΛՃ଎ͤ͞Δ ग़ձ͍ΛੜΈग़͢ "*ϏδωεϚονϯάΞϓϦ ؇΍͔ͳ৘ใަ׵͔Βɺىۀɾఏ ܞɾग़ࢿɾ࠾༻·ͰɺZFOUBΛ௨ ͯ͡ʮϏδωεΛՃ଎ͤ͞Δग़ձ ͍ʯ͕਺ଟ͘ੜ·Ε͍ͯ·͢ɻ ϏδωεΛՃ଎ͤ͞Δग़ձ͍Λ © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . 5

Slide 6

Slide 6 text

6 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . w ࿩͢಺༰ w ZFOUBʹ͓͚Δϝοηʔδը໘ͷ৚݅෼ذ w աڈ w ղܾํ๏

Slide 7

Slide 7 text

7 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . w ϝοηʔδϦΫΤετΛڐՄ͍ͯ͠ͳ͍৔߹ɺ  ೖྗϨΠΞ΢τΛมߋ w ӡӦ#PU͔Βͷϝοηʔδͷ৔߹΋ผϨΠΞ΢τʹมߋ w ϝοηʔδ͕ڐՄ͞Ε͍ͯͳ͍৔߹͸ফ͢ w ભҠݩ͕༑ୡҰཡͷ৔߹ɺඇදࣔϝχϡʔΛফ͢ ৚݅෼ذͷྫ

Slide 8

Slide 8 text

8 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . #PUϝοηʔδऔಘ ϝοηʔδະڐՄϦΫΤετड৴ͷ৔߹ͷϝοηʔδऔಘ ͦͷଞͷ৔߹ͷϝοηʔδऔಘ ৚݅෼ذͷྫ

Slide 9

Slide 9 text

9 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . "DUJWJUZ'SBHNFOU "DUJWJUZ w ϝχϡʔˡ৚݅෼ذ w 7JFX1BHFS .FTTBHF'SBHNFOU 1SPpMF'SBHNFOU w ΠϯϓοτϨΠΞ΢τˡ৚݅෼ذ 'SBHNFOU w ϝοηʔδऔಘɾૹ৴ˡ৚݅෼ذ w FNQUZ Ұཡදࣔ w ৚݅෼ذ͕ଟ͍ w ௨৴΋"DUJWJUZ 'SBHNFOUͰߦͳ͍ͬͯͨ աڈͷ࣮૷ํ๏

Slide 10

Slide 10 text

10 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . ՝୊ "DUJWJUZ'SBHNFOUͰ  ඳըɺ௨৴ͳͲ΋͢΂ͯߦͳ͍ͬͯͨͨΊ  ίʔυྔ͕૿͍͑ͯͨɻ JGจ͕ଟ͘ɺಉ͡৚݅෼ذ͕ଟ༻͞Ε͍ͯͯɺ  ίʔυΛಡΈղ͖վम͢Δ͜ͱʹ͕࣌ؒ  ͔͔Γ͍͗ͯͨ͢ɻ ՝୊ͱղܾํ๏

Slide 11

Slide 11 text

11 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . ՝୊ "DUJWJUZ'SBHNFOUͰ  ඳըɺ௨৴ͳͲ΋͢΂ͯߦͳ͍ͬͯͨͨΊ  ίʔυྔ͕૿͍͑ͯͨɻ JGจ͕ଟ͘ɺಉ͡৚݅෼ذ͕ଟ༻͞Ε͍ͯͯɺ  ίʔυΛಡΈղ͖վम͢Δ͜ͱʹ͕࣌ؒ  ͔͔Γ͍͗ͯͨ͢ɻ ݪҼ w 6*Ͱڞ௨ͳ෦෼͕ଟ͘ɺ  ڞ௨ԽΛҙࣝ͗ͯ͢͠Լखʹ৚݅෼ذ͕૿͑ͨɻ ՝୊ͱղܾํ๏

Slide 12

Slide 12 text

12 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . ղܾࡦ .77.ʹͯ͠ɺඳըɺϏδωεϩδοΫɺ  σʔλ௨৴Λ෼͚ͨ ৚݅෼ذΛJGͰॻ͔ͣɺผϑΝΠϧʹ෼͚ͨ ϝχϡʔද͕ࣔ"DUJWJUZΛෳ਺ ୟ͘"1* ΠϯϓοτϨΠΞ΢τ͕ҧ͏  'SBHNFOUΛෳ਺ &NQUZ Ұཡ͸ڞ௨ͳͷͰɺ  Ұஈਂ͍֊૚ͷ'SBHNFOUΛ࡞੒ ՝୊ͱղܾํ๏ ՝୊ "DUJWJUZ'SBHNFOUͰ  ඳըɺ௨৴ͳͲ΋͢΂ͯߦͳ͍ͬͯͨͨΊ  ίʔυྔ͕૿͍͑ͯͨɻ JGจ͕ଟ͘ɺಉ͡৚݅෼ذ͕ଟ༻͞Ε͍ͯͯɺ  ίʔυΛಡΈղ͖վम͢Δ͜ͱʹ͕࣌ؒ  ͔͔Γ͍͗ͯͨ͢ɻ ݪҼ w 6*Ͱڞ௨ͳ෦෼͕ଟ͘ɺ  ڞ௨ԽΛҙࣝ͗ͯ͢͠Լखʹ৚݅෼ذ͕૿͑ͨɻ

Slide 13

Slide 13 text

13 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . ղܾࡦ .77.ʹͯ͠ɺඳըɺϏδωεϩδοΫɺ  σʔλ௨৴Λ෼͚ͨ ৚݅෼ذΛJGͰॻ͔ͣɺผϑΝΠϧʹ෼͚ͨ ϝχϡʔද͕ࣔ"DUJWJUZΛෳ਺ ୟ͘"1* ΠϯϓοτϨΠΞ΢τ͕ҧ͏  'SBHNFOUΛෳ਺ &NQUZ Ұཡ͸ڞ௨ͳͷͰɺ  Ұஈਂ͍֊૚ͷ'SBHNFOUΛ࡞੒ ɹɹˢͷ࿩Λ͠·͢ ՝୊ͱղܾํ๏ ՝୊ "DUJWJUZ'SBHNFOUͰ  ඳըɺ௨৴ͳͲ΋͢΂ͯߦͳ͍ͬͯͨͨΊ  ίʔυྔ͕૿͍͑ͯͨɻ JGจ͕ଟ͘ɺಉ͡৚݅෼ذ͕ଟ༻͞Ε͍ͯͯɺ  ίʔυΛಡΈղ͖վम͢Δ͜ͱʹ͕࣌ؒ  ͔͔Γ͍͗ͯͨ͢ɻ ݪҼ w 6*Ͱڞ௨ͳ෦෼͕ଟ͘ɺ  ڞ௨ԽΛҙࣝ͗ͯ͢͠Լखʹ৚݅෼ذ͕૿͑ͨɻ

Slide 14

Slide 14 text

14 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . ղܾͷϙΠϯτ w ৚݅෼ذ͕ಉ͡΋ͷ͸ಉ͡ϨΠϠʔʹͯ͠  ৚݅෼ذ͝ͱʹϑΝΠϧΛ࡞੒͢Δɻ

Slide 15

Slide 15 text

15 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . "DUJWJUZ w ϝχϡʔˡ৚݅෼ذ w 7JFX1BHFS .FTTBHF'SBHNFOU 1SPpMF'SBHNFOU w ΠϯϓοτϨΠΞ΢τˡ৚݅෼ذ 'SBHNFOU w ϝοηʔδऔಘɾૹ৴ˡ৚݅෼ذ w FNQUZ Ұཡදࣔ ղܾͷϙΠϯτ

Slide 16

Slide 16 text

16 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . "DUJWJUZ w ϝχϡʔˡ৚݅෼ذ w 7JFX1BHFS .FTTBHF'SBHNFOU 1SPpMF'SBHNFOU w ΠϯϓοτϨΠΞ΢τˡ৚݅෼ذ 'SBHNFOU w ϝοηʔδऔಘɾૹ৴ˡ৚݅෼ذ w FNQUZ Ұཡදࣔ ৚݅෼ذͷ਺  "DUJWJUZΛෳ਺࡞੒ ղܾͷϙΠϯτ

Slide 17

Slide 17 text

17 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . ಉ͡৚݅ͳͷͰ·ͱΊ  'SBHNFOUΛෳ਺࡞੒ ղܾͷϙΠϯτ "DUJWJUZ'SBHNFOU "DUJWJUZ w ϝχϡʔˡ৚݅෼ذ w 7JFX1BHFS .FTTBHF'SBHNFOU 1SPpMF'SBHNFOU w ΠϯϓοτϨΠΞ΢τˡ৚݅෼ذ 'SBHNFOU w ϝοηʔδऔಘɾૹ৴ˡ৚݅෼ذ w FNQUZ Ұཡදࣔ

Slide 18

Slide 18 text

18 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . ղܾͷϙΠϯτ "DUJWJUZ'SBHNFOU "DUJWJUZ w ϝχϡʔˡ৚݅෼ذ w 7JFX1BHFS .FTTBHF'SBHNFOU 1SPpMF'SBHNFOU w ΠϯϓοτϨΠΞ΢τˡ৚݅෼ذ 'SBHNFOU w ϝοηʔδऔಘɾૹ৴ˡ৚݅෼ذ w FNQUZ Ұཡදࣔ "DUJWJUZ 'SBHNFOU 'SBHNFOU

Slide 19

Slide 19 text

19 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . ݱࡏͷ࣮૷ํ๏ "DUJWJUZ'SBHNFOU "DUJWJUZ ະڐՄະϝοηʔδ #PU ͦͷଞ w ϝχϡʔ 'SBHNFOU ະڐՄϦΫΤετड৴ #PU༻ ͦͷଞ w ϝοηʔδऔಘɾૹ৴ˠ%#ʹϝοηʔδΛอଘ w 7JFX1BHFS w ΠϯϓοτϨΠΞ΢τ 'SBHNFOU w FNQUZ Ұཡදࣔˡ%#Λ؂ࢹ͠ɺϝοηʔδऔಘ

Slide 20

Slide 20 text

20 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . ϝϦοτ w ϝχϡʔɺσʔλऔಘɺ&NQUZɾҰཡදࣔ  ͦΕͧΕͷϨΠϠʔͰਖ਼͠͞Λ֬ೝͰ͖Δɻ w ෳ਺ϑΝΠϧʹ෼͚͓͔ͨ͛Ͱɺ  ҧ͏৚݅ͷ΋ͷʹӨڹ͕ग़ʹ͍͘ɻ

Slide 21

Slide 21 text

21 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . σϝϦοτ w ෼͚Δͷ͸ͱΓ͋͑ͣΊΜͲ͍͘͞ɻ w ಉ͡ίʔυ͕ෳ਺ϑΝΠϧʹଘࡏͯ͠͠·͏ɻ  ͜Ε͸Ұ୴͠ΐ͏͕ͳ͍ͱڐ༰ʜ

Slide 22

Slide 22 text

22 © 2 0 1 9 A t r a e , I n c . A l l r i g h t s r e s e r v e d . ֶͼ w ৚݅෼ذ͚ͩͰ੍ޚ͢Δͷʹ͸ݶք͕͋Δɻ  ͷͰɺผͳ΋ͷ͸ผͱׂΓ੾Δɻ w "DUJWJUZ΍'SBHNFOUࣗମ΋੹຿ʹΑͬͯ  ֊૚Λ෼͚͍ͯ͘͜ͱʹΑͬͯ'BUʹͳΓʹ͍͘  ͔΋͠Εͳ͍