OpenAPIを中心に考えるAPI開発入門 / Introduction to API Development with a Focus on OpenAPI

Slide 1

Slide 1 text

©Fusic Co., Ltd. 1 OpenAPIΛத৺ʹߟ͑ΔAPI։ൃೖ໳ 2024.04.16 ਗ਼Ո࢙࿠ @seike460 Postman API Night Fukuoka 2024 Spring

Slide 2

Slide 2 text

©Fusic Co., Ltd. 2 ਗ਼Ո ࢙࿠ @seike460 AWS Community Builder Serverless - ίϛϡχςΟ - Fukuoka.php - Fukuoka.go - JAWS-UG Fukuoka - Serverless Meetup Fukuoka - Cloudflare Meetup Fukuoka - JP_Stripes Fukuoka ࣗݾ঺հ ͸͡Ίʹ גࣜձࣾFusic ϓϦϯγύϧΤϯδχΞ/ΤόϯδΣϦετ

Slide 3

Slide 3 text

©Fusic Co., Ltd. 3 CONTENTS ໨࣍ 1. OpenAPIͱ͸ 2. OpenAPIಋೖͷ͖͔͚ͬ 3. OpenAPI GeneratorʹΑΔίʔυࣗಈੜ੒ 4. PostmanΛར༻ͨ͠RequestͱMock 5. ·ͱΊ

Slide 4

Slide 4 text

©Fusic Co., Ltd. 4 OpenAPIͱ͸ 1

Slide 5

Slide 5 text

©Fusic Co., Ltd. 5 OpenAPIͱ͸ - RESTful API࢓༷Λهड़͢ΔͨΊͷۀքඪ४ - ※ݱࡏ͸v3ͰͦΖͦΖv4ϦϦʔε༧ఆ - ݩʑ͸Swagger (v2)ͱͯ͠஌ΒΕ͍ͯͨ - JSON·ͨ͸YAMLͰAPIͷΤϯυϙΠϯτͱૢ࡞Λఆٛ

Slide 6

Slide 6 text

©Fusic Co., Ltd. 6 OpenAPI Toolsͷओͳར఺ - APIͷՄࢹੑͱཧղͷ޲্ - ίʔυੜ੒πʔϧΛ௨ͨ͡։ൃͷՃ଎ - ςετͱυΩϡϝϯτͷࣗಈੜ੒

Slide 7

Slide 7 text

©Fusic Co., Ltd. 7 OpenAPIಋೖͷ͖͔͚ͬ 2

Slide 8

Slide 8 text

©Fusic Co., Ltd. 8 OpenAPI ಋೖͷ͖͔͚ͬ - ϊΠΤετ߹ಉձ༷ࣾͷެ։ࣄྫ - https://fusic.co.jp/works/47 - ҩֶݚڀ༻ͷಠࣗͷಛघ೴೾ղੳͷࣗಈԽ - ݚڀऀ༷͔Βͷղੳґཔʹରͯ͠ खಈղੳΛߦ͍ϨϙʔτఏڙΛߦ͍ͬͯͨ - ͜ͷղੳΛࣗಈԽ͢ΔߏஙΛߦͬͨ - ϑϧαʔόʔϨε x SaaSͱ͍͏ࣄྫ

Slide 9

Slide 9 text

©Fusic Co., Ltd. 9 ଘࡏͨ͠՝୊ Լه։ൃΛߦ͏ඞཁ͕͋ͬͨ - ReactͷϑϩϯτΤϯυ - PHP LaravelͷόοΫΤϯυAPI ୹ظؒͰߏஙΛ׬ྃ͢Δඞཁ͕͋Γ ϑϩϯτΤϯυͱόοΫΤϯυΛ෼ׂͯ͠ ಉ࣌ฒߦͰ։ൃΛߦͬͨ APIͷ࢓༷Λ࿈ܞ͢Δඞཁ͕͋Δ

Slide 10

Slide 10 text

©Fusic Co., Ltd. 10 OpenAPI Generator ͦ͜Ͱڞ௨ͷAPIͷ࢓༷Λڞ༗͠ͳ͕Β ͞Βʹίʔυੜ੒͕ग़དྷΔ OpenAPI GeneratorΛར༻ͨ͠ ίʔυੜ੒Λલఏͱͨ͠։ൃΛ࣮ࢪ API࢓༷ͷमਖ਼͕ൃੜͨ࣌͠΋ɺ APIΠϯλʔϑΣʔε͸ଈࠩ͠ସ͑Մೳʹ

Slide 11

Slide 11 text

©Fusic Co., Ltd. 11 OpenAPI GeneratorʹΑΔίʔυࣗಈੜ੒ 3

Slide 12

Slide 12 text

©Fusic Co., Ltd. 12 OpenAPI v3ͷجຊߏ଄ͱهड़ํ๏ - OpenAPI Object - ϧʔτυΩϡϝϯτ - Info Object - APIͷجຊ৘ใ - Servers Object - αʔό৘ใͱ؀ڥ - Paths Object - ར༻Մೳͳύεͱૢ࡞ - Components Object - ࠶ར༻ՄೳͳεΩʔϚɺύϥϝʔλʔ

Slide 13

Slide 13 text

©Fusic Co., Ltd. 13 OpenAPI v3ͷجຊߏ଄ͱهड़ํ๏ - OpenAPI Object - ϧʔτυΩϡϝϯτ - Info Object - APIͷجຊ৘ใ - Servers Object - αʔό৘ใͱ؀ڥ - Paths Object - ར༻Մೳͳύεͱૢ࡞ - Components Object - ࠶ར༻ՄೳͳεΩʔϚɺύϥϝʔλʔ

Slide 14

Slide 14 text

©Fusic Co., Ltd. 14 OpenAPI v3ͷجຊߏ଄ͱهड़ํ๏ - OpenAPI Object - ϧʔτυΩϡϝϯτ - Info Object - APIͷجຊ৘ใ - Servers Object - αʔό৘ใͱ؀ڥ - Paths Object - ར༻Մೳͳύεͱૢ࡞ - Components Object - ࠶ར༻ՄೳͳεΩʔϚɺύϥϝʔλʔ

Slide 15

Slide 15 text

©Fusic Co., Ltd. 15 OpenAPI v3ͷجຊߏ଄ͱهड़ํ๏ - OpenAPI Object - ϧʔτυΩϡϝϯτ - Info Object - APIͷجຊ৘ใ - Servers Object - αʔό৘ใͱ؀ڥ - Paths Object - ར༻Մೳͳύεͱૢ࡞ - Components Object - ࠶ར༻ՄೳͳεΩʔϚɺύϥϝʔλʔ

Slide 16

Slide 16 text

©Fusic Co., Ltd. 16 OpenAPI v3ͷجຊߏ଄ͱهड़ํ๏ - OpenAPI Object - ϧʔτυΩϡϝϯτ - Info Object - APIͷجຊ৘ใ - Servers Object - αʔό৘ใͱ؀ڥ - Paths Object - ར༻Մೳͳύεͱૢ࡞ - Components Object - ࠶ར༻ՄೳͳεΩʔϚɺύϥϝʔλʔ

Slide 17

Slide 17 text

©Fusic Co., Ltd. 17 Dockerܦ༝ͰPHPίʔυͷੜ੒ Docker͕ఏڙ͞Ε͍ͯΔͷͰ ఆٛͨ͠OpenAPIͷYamlΛಡΈࠐΈ ConfigΛར༻ͯ͠ίϚϯυΛ࣮ߦ PHPϑΝΠϧΛੜ੒

Slide 18

Slide 18 text

©Fusic Co., Ltd. 18 ੜ੒ͨ͠ϑΝΠϧΛར༻࣮ͯ͠ॲཧͷΈهड़ ੜ੒͞ΕͨPHP͕ Validation΍ܕνΣοΫΛ࣮ࢪ ҆શͳঢ়ଶͷϦΫΤετΛ ར༻ͨ͠υϝΠϯϩδοΫΛ࡞੒

Slide 19

Slide 19 text

©Fusic Co., Ltd. 19 OpenAPI React Query Codegen Fusicࣾһͷ @7nohe͕ެ։͍ͯ͠Δ OSSΛར༻͠TanStack QueryΛੜ੒ (چ React Query) Client෦෼ͷϦΫΤετ෦෼΋ ׬શʹҠৡ͠·ͨ͠

Slide 20

Slide 20 text

©Fusic Co., Ltd. 20 OpenAPI React Query Codegen Fusicࣾһͷ @7nohe͕ެ։͍ͯ͠Δ OSSΛར༻͠TanStack QueryΛੜ੒ (چ React Query) Client෦෼ͷϦΫΤετ෦෼΋ ׬શʹҠৡ͠·ͨ͠

Slide 21

Slide 21 text

©Fusic Co., Ltd. 21 OpenAPIΛհͯ͠ɺPHPͱReactΛܨ͙ OpenAPIΛհͯ͠ਐΊΔࣄͰɺ PHPͱReactͷؒͰਖ਼͍͠API࢓༷Λڞ༗ ίʔυͷੜ੒·ͰҠৡͯ͠ API࢓༷͕ζϨΑ͏ͷͳ͍ঢ়ଶʹ - ϑϩϯτΤϯυ - ૹ৴͢ΔͨΊͷϦΫΤετͷੜ੒ - όοΫΤϯυ - ϦΫΤετΛड৴ɺϨεϙϯεͷੜ੒

Slide 22

Slide 22 text

Slide 23

Slide 23 text

©Fusic Co., Ltd. 23 PHPɿPostmanʹΑΔϦΫΤετͷੜ੒ PHP͸։ൃதʹϦΫΤετΛड͚͍ͨ - React͸։ൃதͳͷͰૹ৴ग़དྷͳ͍ - Import - OpenAPIͷYamlΛಡΈࠐ·ͤΔ - Request͕࣮ࡍʹ࣮ߦͰ͖Δ ։ൃΛ؆୯ʹՃ଎ͤ͞Δࣄ͕Մೳʹʂ

Slide 24

Slide 24 text

©Fusic Co., Ltd. 24 ReactɿPostmanʹΑΔmock server…Λར༻͔ͨͬͨ͠ React͸։ൃதʹϨεϙϯεΛड͚͍ͨ - PHP͸։ൃதͳͷͰड৴ग़དྷͳ͍ ʢ౰࣌ษڧෆ଍Ͱ஌Βͳ͔ͬͨ…ʣ ఆٛΛݩʹMock ServerΛཱͯΕΔͷͰ PostmanͰ૬ޓͷ΍ΓऔΓΛ׬݁Մೳ ʢ࣮ࡍ͸Swagger EditorͰ ɹMock ServerΛੜ੒͍ͯͨ͠ʣ

Slide 25

Slide 25 text

©Fusic Co., Ltd. 25 ReactɿPostmanʹΑΔmock server…Λར༻͔ͨͬͨ͠ React͸։ൃதʹϨεϙϯεΛड͚͍ͨ - PHP͸։ൃதͳͷͰड৴ग़དྷͳ͍ ʢ౰࣌ษڧෆ଍Ͱ஌Βͳ͔ͬͨ…ʣ ఆٛΛݩʹMock ServerΛཱͯΕΔͷͰ PostmanͰ૬ޓͷ΍ΓऔΓΛ׬݁Մೳ ʢ࣮ࡍ͸Swagger EditorͰ ɹMock ServerΛੜ੒͍ͯͨ͠ʣ

Slide 26

Slide 26 text

©Fusic Co., Ltd. 26 OpenAPI Firstͳ։ൃʹΑΓεϜʔζͳ։ൃ͕Մೳʹ OpenAPIΛར༻Λલఏʹͨ͜͠ͱͰAPIͷ࢓༷ͷΈͰਐߦՄೳʹ PostmanΛར༻͓͠ޓ͍ͷ։ൃ׬ྃΛ଴ͨͣʹ૬ޓͷ΍ΓऔΓ͕Մೳʹ ΋ͪΖΜલఏ஌͕ࣝඞཁʹͳΔ͠ɺ੍໿΋͋Δ OpenAPI ToolsͱPostmanΛར༻ͨ͠։ൃΛબ୒ࢶʹ

Slide 27

Slide 27 text

Slide 28

Slide 28 text

©Fusic Co., Ltd. 28 ·ͱΊ RESTful API࢓༷Λهड़͢ΔͨΊͷۀքඪ४ͱͯ͠ͷOpen APIͱ͍͏࢓༷͕͋Δ Point 01 Yaml·ͨ͸JsonͰઃܭՄೳͳͷͰΤϯδχΞϑϨϯυϦʔͳOpenAPI Tools Point 02 ࠓճͷࣄྫͰ͸PHPͱReactʹͯίʔυੜ੒͢Δ͜ͱͰυϝΠϯ෦෼͚ͩͷ։ൃʹूத Point 03 PostmanΛར༻͢Δ͜ͱͰ͞ΒͳΔޮ཰ԽΛ͸͔Δࣄ͕Մೳʹɺલఏ஌͕ࣝඞཁͳͷͰ͔ͬ͠Γֶश͕ඞཁʂ Point 04