実践、BFF ~ BFFはFiNCのアプリで何を解決したのか ~

by izmeal2000

Slide 1

Slide 1 text

࣮ફɺBFF ~ BFF͸FiNCͷΞϓϦͰԿΛղܾͨ͠ͷ͔ ~ FiNC Technologies Inc. / Engineer Development Kensuke Izumi

Slide 2

Slide 2 text

2 ࣗݾ঺հ Kensuke Izumi Android Engineer @FiNC Kotlin / javascript / ruby Twitter: @izmeal2000

Slide 3

Slide 3 text

3 ΞδΣϯμ 1. FiNCʹ͓͚ΔBFFͷ໾ׂ ɹɾBFFͷҰൠతͳఆٛ ɹɾFiNC appͷ๊͑Δ՝୊ ɹɾBFF͕ղܾ͢Δ՝୊ 2. BFFಋೖ࣮ફ ɹɾػೳ঺հ ɹɾ՝୊ͱBFFΛ༻͍ͨղܾ ɹɹ- ύϑΥʔϚϯε ɹɹ- ू໿ϩδοΫͷڞ༗ ɹɹ- ϨεϙϯεʹΑΔදࣔ੾Γସ͑ 3. ࠓޙͷల๬

Slide 4

Slide 4 text

4 ΞδΣϯμ 1. FiNCʹ͓͚ΔBFFͷ໾ׂ ɹɾBFFͷҰൠతͳఆٛ ɹɾFiNC appͷ๊͑Δ՝୊ ɹɾBFF͕ղܾ͢Δ՝୊ 2. BFFಋೖ࣮ફ ɹɾػೳ঺հ ɹɾ՝୊ͱBFFΛ༻͍ͨղܾ ɹɹ- ύϑΥʔϚϯε ɹɹ- ू໿ϩδοΫͷڞ༗ ɹɹ- ϨεϙϯεʹΑΔදࣔ੾Γସ͑ 3. ࠓޙͷల๬

Slide 5

Slide 5 text

FiNCʹ͓͚ΔBFFͷ໾ׂ 1

Slide 6

Slide 6 text

6 ҰൠతͳBFFͷఆٛ Microserviceͷఏڙ͢Δෳ਺ͷAPI܈ͱ ͋Δಛఆͷclientͷ஥հϨΠϠʔ

Slide 7

Slide 7 text

7 ҰൠతͳBFFͷ໾ׂ service C service B service A client A client B

Slide 8

Slide 8 text

8 ҰൠతͳBFFͷ໾ׂ service C service B service A client A client B BFF ಋೖ؀ڥʹΑͬͯͦͷ໾ׂ͸ҟͳΔ ྫ͑͹ɺ ɾAPIͷू໿ ɾAPIΩϟογϡ ɾServer Side Rendering etc…

Slide 9

Slide 9 text

FiNC APPʹ͓͚ΔBFF͸ͲΜͳ՝୊Λղܾ͍ͯ͠Δͷ͔

Slide 10

Slide 10 text

10 FiNC Appͷ๊͑Δ՝୊ user tag Service life-log Service point Service Android iOS ɾ ɾ ɾ ɾ௨৴ύϑΥʔϚϯε ɾू໿ϩδοΫͷ෼ࢄ ɾࠣࡉͳڍಈมߋʹ΋ਃ੥͕ඞཁ ू໿ ϩδοΫ ू໿ ϩδοΫ ϞόΠϧ௨৴

Slide 11

Slide 11 text

11 BFF͕ղܾ͢Δ՝୊ user tag Service life-log Service point Service Android iOS ɾ ɾ ɾ ௨৴ύϑΥʔϚϯε ϞόΠϧ௨৴

Slide 12

Slide 12 text

12 BFF͕ղܾ͢Δ՝୊ user tag Service life-log Service point Service Android iOS ɾ ɾ ɾ ௨৴ύϑΥʔϚϯε ϞόΠϧ௨৴ ɾෳ਺ͷAPI requestʹΑΔoverhead ɾσʔλ௨৴ྔͷѹഭ ɾ஗͍ճઢͰͷෳ਺request

Slide 13

Slide 13 text

13 User tag service Life-log service Point service Android iOS BFF ௨৴ͷू໿ BFF͕ղܾ͢Δ՝୊ ϞόΠϧ௨৴ αʔόؒ௨৴ ϞόΠϧճઢ΁ͷෛՙܰݮ ɹɾrequestճ਺ͷ࡟ݮ ɹɾ௨৴σʔλྔͷ࡟ݮ

Slide 14

Slide 14 text

14 user tag Service life-log Service point Service Android iOS ɾ ɾ ɾ ू໿ ϩδοΫ ू໿ ϩδοΫ ू໿ϩδοΫͷ෼ࢄ BFF͕ղܾ͢Δ՝୊ ɾແବͳ࣮૷ίετ ɾڍಈͷࠩ෼͕ൃੜ͠΍͍͢

Slide 15

Slide 15 text

15 user tag Service life-log Service point Service Android iOS ɾ ɾ ɾ ू໿ϩδοΫͷڞ༗ BFF͕ղܾ͢Δ՝୊ BFF ू໿ ϩδοΫ ɾҰՕॴ΁ͷ࣮૷ ɾڍಈʹࠩ෼͕ൃੜ͠ͳ͍

Slide 16

Slide 16 text

16 ࠣࡉͳڍಈมߋʹ΋ϦϦʔεਃ੥͕ඞཁ BFF͕ղܾ͢Δ՝୊ ɾΞϓϦͷϦϦʔεʹ͸͕͔͔࣌ؒΔ ɹJ04ਃ੥ظؒɺ"OESPJEਁಁظؒ ɾٸͳ࢓༷มߋʹରԠ͠ʹ͍͘

Slide 17

Slide 17 text

17 ࠣࡉͳڍಈมߋʹ΋ϦϦʔεਃ੥͕ඞཁ BFF͕ղܾ͢Δ՝୊ ू໿ϩδοΫΛ#''ଆͰอ࣋ ϦϦʔεਃ੥ͳ͠Ͱڍಈมߋ͕Մೳ

Slide 18

Slide 18 text

18 ΞδΣϯμ 1. FiNCʹ͓͚ΔBFFͷ໾ׂ ɹɾBFFͷҰൠతͳఆٛ ɹɾFiNC Appͷ๊͑Δ՝୊ ɹɾBFF͕ղܾ͢Δ՝୊ 2. BFFಋೖ࣮ફ ɹɾػೳ঺հ ɹɾ՝୊ͱBFFΛ༻͍ͨղܾ ɹɹ- ύϑΥʔϚϯε ɹɹ- ू໿ϩδοΫͷڞ༗ ɹɹ- ϨεϙϯεʹΑΔදࣔ੾Γସ͑ 3. ࠓޙͷల๬

Slide 19

Slide 19 text

BFFಋೖ࣮ફ 2

Slide 20

Slide 20 text

20 ػೳ঺հ ϙΠϯτΛͨΊΔ(࢖͏)खஈΛఏڙ͢Δը໘ ϙΠϯτΛͨΊΔखஈ͸ෳ਺ଘࡏ͢Δ ɹɾา͘ʂ ɹɾ৯ࣄΛه࿥͢Δ ɹɾࣸਅΛ౤ߘ͢Δ ɹɹetc… ϙΠϯτΛஷΊ͍ͨ/࢖͍͍ͨϢʔβ͸ ͜͜ʹ͘Ε͹େৎ෉ʂ

Slide 21

Slide 21 text

21 ػೳ঺հ: ϥΠϑϩά ϥΠϑϩάɿ ɾҎԼͷه࿥ͰϙΠϯτΛ֫ಘ ɹɾ৯ࣄ ɹɾਭ຾ ɹɾମॏ ɾઃఆͨ͠໨ඪΛୡ੒ͯ͠ϙΠϯτΛ֫ಘ

Slide 22

Slide 22 text

22 ػೳ঺հ: ϛογϣϯ ϛογϣϯɿ ༷ʑͳΞΫγϣϯΛୡ੒ͯ͠ϙΠϯτΛ֫ಘ ɾهࣄΛಡΉ ɾࣸਅΛ౤ߘ͢Δ ɾಈըΛݟΔ etc…

Slide 23

Slide 23 text

23 ػೳ঺հ ϙΠϯτͷ֬ೝը໘ ϓϨθϯτͷ֬ೝը໘ ϙΠϯτ͕ͨ·ΔΩϟϯϖʔϯͷը໘ ϙΠϯτ͕ͨ·ΔϥΠϑϩάͷը໘ ϙΠϯτ͕ͨ·Δϛογϣϯͷը໘

Slide 24

Slide 24 text

ϙΠϯτʹؔ࿈͢Δ͍ΖΜͳػೳ͕ू·ͬͯग़དྷ͍ͯΔ

Slide 25

Slide 25 text

1ষͰ͓࿩ͨ͠͠BFFͷ໾ׂͷ۩ମྫΛ͓࿩͠͠·͢ ௨৴ύϑΥʔϚϯε ू໿ϩδοΫͷڞ௨Խ ϨεϙϯεʹΑΔදࣔ੾Γସ͑

Slide 26

Slide 26 text

௨৴ύϑΥʔϚϯε ू໿ϩδοΫͷڞ༗ ϨεϙϯεʹΑΔදࣔ੾Γସ͑

Slide 27

Slide 27 text

Premium Service 27 ՝୊ͱBFFͰͷղܾ user tag Service life-log Service point Service ௨৴ύϑΥʔϚϯε Mission Service EC Service ଟ͗ͯ͢ॻ͚ͳ͍… ܭ15ຊͷrequest  (on mobileճઢ)

Slide 28

Slide 28 text

Premium Service 28 ՝୊ͱBFFͰͷղܾ user tag Service life-log Service point Service ௨৴ύϑΥʔϚϯε Mission Service EC Service BFF ܭ6ຊͷrequest  (on mobileճઢ)

Slide 29

Slide 29 text

Ұຊʹू໿͢Ε͹ྑ͍ͷͰ͸ʁ

Slide 30

Slide 30 text

30 ՝୊ͱBFFͰͷղܾ 1ຊʹू໿ͨ࣌͠ͷ໰୊఺ ɾ஗͍APIʹҾ͖ͣΒΕΔ ɾݸผretry͕ग़དྷͳ͍

Slide 31

Slide 31 text

31 ՝୊ͱBFFͰͷղܾ ஗͍APIʹҾ͖ͣΒΕΔ Premium Service user tag Service life-log Service point Service Mission Service EC Service BFF ͳΜ͔஗͍… ͳΜ͔஗͍…

Slide 32

Slide 32 text

32 ػೳ঺հ ݸผretry͕ग़དྷͳ͍ ͜ͷ෦෼ͷ௨৴͕ࣦഊͨ࣌͠ɺ΋͏Ұ౓શͯୟ͖௚͢ͷ͔

Slide 33

Slide 33 text

Premium Service 33 ՝୊ͱBFFͰͷղܾ user tag Service life-log Service point Service ௨৴ύϑΥʔϚϯε Mission Service EC Service BFF

Slide 34

Slide 34 text

× ͱΓ͋͑ͣը໘ͷ৘ใશ෦·ͱΊͪΌ͑ʂ ̋ ద੾ͳཻ౓ͰͷAPIͷू໿

Slide 35

Slide 35 text

௨৴ύϑΥʔϚϯε ू໿ϩδοΫͷڞ༗ ϨεϙϯεʹΑΔදࣔ੾Γସ͑

Slide 36

Slide 36 text

36 ՝୊ͱBFFͰͷղܾ ू໿ϩδοΫͷڞ༗ ؔ࿈͢Δෳ਺ͷυϝΠϯ ɾϙΠϯτ֫ಘ৚݅ ɾϢʔβͷར༻ϓϥϯ ɾਭ຾ͷه࿥ ɾਭ຾ͷσʔλιʔε etc…

Slide 37

Slide 37 text

37 ՝୊ͱBFFͰͷղܾ ू໿ϩδοΫͷڞ༗ ؔ࿈͢Δෳ਺ͷυϝΠϯ ɾϙΠϯτ֫ಘ৚݅ ɾϢʔβͷར༻ϓϥϯ ɾਭ຾ͷه࿥ ɾਭ຾ͷσʔλιʔε etc… LifeLogPointAction ୡ੒͢ΔͱϙΠϯτ͕΋Β͑ΔϥΠϑϩά ू໿

Slide 38

Slide 38 text

38 ՝୊ͱBFFͰͷղܾ ू໿ϩδοΫͷڞ༗ `Ϣʔβͷਭ຾ه࿥Λऔಘ͢Δendpoint` { id, started_at, ended_at, feeling } `Ϣʔβͷ৯ࣄه࿥Λऔಘ͢Δendpoint` { [ eat_date: meals: [] ] } dataܗࣜͷҟͳΔϥΠϑϩά

Slide 39

Slide 39 text

39 ՝୊ͱBFFͰͷղܾ ू໿ϩδοΫͷڞ༗ ٖࣅίʔυ const sleepDataSource =dataSourceBackendService.getSleepDataSource() // ϙΠϯτ෇༩ର৅ͷσʔλιʔε͔Ͳ͏͔ const sleepRecord = isPointGiven(sleepDataSource) ? lifelogBackendService.getSleep() : null const userTag = userTagBackendService.getUserTag() if (userTag == ‘premium’) { // ϙΠϯτxഒͷର৅͔ } const isAchieved = sleepRecord != null

Slide 40

Slide 40 text

40 ՝୊ͱBFFͰͷղܾ ू໿ϩδοΫͷڞ༗ ٖࣅίʔυ // ࠓ೔ͷา਺Λऔಘ const currentStep = lifelogBackendService.getStep() // ࣍ͷϙΠϯτ෇༩ର৅໨ඪΛࢉग़ const nextGoal = pointService.getNextStepGoal(curren tStep)

Slide 41

Slide 41 text

ཁ͢ΔʹϩδοΫ͕ෳࡶ

Slide 42

Slide 42 text

42 user tag Service life-log Service point Service Android iOS ɾ ɾ ɾ ू໿ϩδοΫͷڞ༗ BFF͕ղܾ͢Δ՝୊ BFF ू໿ ϩδοΫ ෳࡶͳϩδοΫΛҰՕॴʹ ɾ࣮૷ίετͷ࡟ݮ ɾࠩ෼͕ੜ·Εͳ͍

Slide 43

Slide 43 text

No content

Slide 44

Slide 44 text

ͪΐͬͱ଴ͬͨ

Slide 45

Slide 45 text

45 ՝୊ͱBFFͰͷղܾ ؔ࿈͢Δෳ਺ͷυϝΠϯ ɾϙΠϯτ֫ಘ৚݅ ɾϢʔβͷར༻ϓϥϯ ɾਭ຾ͷه࿥ ɾਭ຾ͷσʔλιʔε etc… LifeLogPointAction ୡ੒͢ΔͱϙΠϯτ͕΋Β͑ΔϥΠϑϩά ू໿

Slide 46

Slide 46 text

46 ՝୊ͱBFFͰͷղܾ ؔ࿈͢Δෳ਺ͷυϝΠϯ ɾϙΠϯτ֫ಘ৚݅ ɾϢʔβͷར༻ϓϥϯ ɾਭ຾ͷه࿥ ɾਭ຾ͷσʔλιʔε etc… LifeLogPointAction ୡ੒͢ΔͱϙΠϯτ͕΋Β͑ΔϥΠϑϩά શ͘ҟͳΔσʔλߏ଄ BackendͷυϝΠϯ frontendͷυϝΠϯ

Slide 47

Slide 47 text

BFFͰσʔλߏ଄Λม׵͢Δͷ͸͋Γ͔

Slide 48

Slide 48 text

48 ՝୊ͱBFFͰͷղܾ Կ͕ࠔΔͷ͔ ɹViewଆͰͷมߋ͕൓ө͞Εͳ͍ ɹex) า਺͕ߋ৽͞Εͨ࣌Ͳ͏ͳΔʁ LifelogPointActionͱ͍͏ந৅తͳ΋ͷ Ϣʔβͷา਺ΛϦΞϧλΠϜͰ൓өͰ͖ͳ͍ (ग़དྷΔ͚Ͳෳࡶ)

Slide 49

Slide 49 text

49 ՝୊ͱBFFͰͷղܾ ϩδοΫΛͲͪΒʹدͤΔ͔ BFF ɹ࢓༷มߋΛॊೈʹ൓ө frontend ɹϢʔβͱͷΠϯλϥΫγϣϯΛ ɹ ॊೈʹ൓ө user tag Service life-log Service point Service Android iOS ɾ ɾ ɾ BFF ू໿ ϩδοΫ ू໿ ϩδοΫ ू໿ ϩδοΫ

Slide 50

Slide 50 text

BFFͰσʔλߏ଄Λม׵͢Δͷ͸͋Γ͔

Slide 51

Slide 51 text

݁࿦ɺ࣌ͱ৔߹ʹΑΔ

Slide 52

Slide 52 text

࢓༷ͷมߋΛଈ࠲ʹ൓ө͍ͨ͠ ϢʔβͱͷΠϯλϥΫγϣϯΛଈ࠲ʹ൓ө͍ͨ͠ …

Slide 53

Slide 53 text

࢓༷ͷมߋΛଈ࠲ʹ൓ө͍ͨ͠ ϢʔβͱͷΠϯλϥΫγϣϯΛଈ࠲ʹ൓ө͍ͨ͠ … ࠓճ͸

Slide 54

Slide 54 text

௨৴ύϑΥʔϚϯε ू໿ϩδοΫͷڞ௨Խ ϨεϙϯεʹΑΔදࣔ੾Γସ͑

Slide 55

Slide 55 text

55 ՝୊ͱBFFͰͷղܾ ϨεϙϯεʹΑΔදࣔ੾Γସ͑ ϥΠϑϩάɿ ɾҎԼͷه࿥ͰϙΠϯτΛ֫ಘ ɹɾ৯ࣄ ɹɾਭ຾ ɹɾମॏ ɾઃఆͨ͠໨ඪΛୡ੒ͯ͠ϙΠϯτΛ֫ಘ

Slide 56

Slide 56 text

56 ՝୊ͱBFFͰͷղܾ ։ൃ౰ॳͷ࢓༷ ମॏΛه࿥͢Δͱ…

Slide 57

Slide 57 text

Α͘ߟ͑ͨ݁Ռ

Slide 58

Slide 58 text

58 ՝୊ͱBFFͰͷղܾ ࢓༷ͷ໰୊఺ ɾ͋Δػೳ͔͠࢖Θͳ͍Ϣʔβ΋͍Δ ɹ৯ࣄ͔͠ه࿥͠ͳ͍ɺͱ͔ ɾফ͑Δͱࠞཚ͢Δਓɺઈର͍Δ ɹɾ͋ΕɺͳΜ͔ফ͑ͪΌͬͨΜ͚ͩͲ

Slide 59

Slide 59 text

59 ՝୊ͱBFFͰͷղܾ ࢓༷ͷ໰୊఺ ɾ͋Δػೳ͔͠࢖Θͳ͍Ϣʔβ΋͍Δ ɹ৯ࣄ͔͠ه࿥͠ͳ͍ɺͱ͔ ɾফ͑Δͱࠞཚ͢Δਓɺઈର͍Δ ɹɾ͋ΕɺͳΜ͔ফ͑ͪΌͬͨΜ͚ͩͲ ΍ͬͺΓୡ੒ͨ͠΋ͷ΋දࣔͤ͞Α͏ʂ

Slide 60

Slide 60 text

60 ՝୊ͱBFFͰͷղܾ มߋલ มߋޙ

Slide 61

Slide 61 text

Done!

Slide 62

Slide 62 text

62 ՝୊ͱBFFͰͷղܾ ϨεϙϯεʹΑΔදࣔ੾Γସ͑ user tag Service life-log Service point Service Android iOS BFF ू໿ ϩδοΫ BFFଆͷू໿ϩδοΫ => ΞϓϦͷਃ੥ͳ͠Ͱमਖ਼͕Մೳ

Slide 63

Slide 63 text

63 ΞδΣϯμ 1. FiNCʹ͓͚ΔBFFͷ໾ׂ ɹɾBFFͷҰൠతͳఆٛ ɹɾFiNC Appͷ๊͑Δ՝୊ ɹɾBFF͕ղܾ͢Δ՝୊ 2. BFFಋೖ࣮ફ ɹɾػೳ঺հ ɹɾ՝୊ͱBFFΛ༻͍ͨղܾ ɹɹ- ύϑΥʔϚϯε ɹɹ- ϩδοΫͷڞ༗ ɹɹ- ϨεϙϯεʹΑΔදࣔ੾Γସ͑ 3. ࠓޙͷల๬

Slide 64

Slide 64 text

ࠓޙͷల๬ 3

Slide 65

Slide 65 text

ࠓޙͷల๬ 65 ͜͜ͰࠂനͰ͢

Slide 66

Slide 66 text

66 ࣗݾ঺հ Kensuke Izumi Android Engineer @FiNC Kotlin / javascript / ruby Twitter: @izmeal2000

Slide 67

Slide 67 text

ࠓޙͷల๬ 67 ࣮͸͜ͷBFFͷ࣮૷ऀɺ๻͡Όͳ͍ΜͰ͢

Slide 68

Slide 68 text

ࠓޙͷల๬ 68 Ϗδωε Mobile engineer (๻) Backend engineer ࢓༷ͷ֬ೝ ௐ੔ ࣮૷ͷґཔ

Slide 69

Slide 69 text

ࠓޙͷల๬ 69 Ϗδωε Mobile engineer (๻) Backend engineer ࢓༷ͷ֬ೝ ௐ੔ ࣮૷ͷґཔ ίϛϡχέʔγϣϯϛε

Slide 70

Slide 70 text

ࠓޙͷల๬ 70 ʮา਺͸ୡ੒ͯ͠΋࢒͢Μ͚ͩͬʁʯ ʮ͑ɺࢀՃࡁͷmission͚ͩදࣔ͢ΔΜ͡Όͳ͍ͷʁʯ

Slide 71

Slide 71 text

ࠓޙͷల๬ 71 The BFF is tightly coupled to a speciﬁc user experience, and will typically be maintained by the same team as the user interface, thereby making it easier to deﬁne and adapt the API as the UI requires, while also simplifying process of lining up release of both the client and server components. ௨ৗBFF͸UIνʔϜʹΑͬͯ։ൃ͞ΕΔ΋ͷͰ͋Δ By SamNewman

Slide 72

Slide 72 text

ࠓޙͷల๬ 72 ݱঢ়ͷBFF ɾஔ͖׵͑ΔલఏͰ࣮ݧతʹ࡞੒ ɾͦΖͦΖϝϯς͕ݫ͍͠

Slide 73

Slide 73 text

ࠓޙͷల๬ 73 ஔ͖׵͑Α͏ɻ ࠓ౓ͦ͜ωΠςΟϒΤϯδχΞ͕։ൃ͠΍͍ٕ͢ज़Ͱɻ