Introduction to using GraphQL for a bit

Transcript

1. ͪΐͬͱ࢖͍ͨ͘ͳΔ
   (SBQI2-ೖ໳ -BSBWFM3FBDU
   
   
   ୈճΏΔ͸ͪJU(SBQI2-ʹ͍ͭͯΏΔ͘࿩͢
   େڮҰथ!L[LPIBTIJ
   

   View Slide

2. ࣗݾ঺հ
   େڮҰथ!L[LPIBTIJ
   w '*4.גࣜձࣾ$50
   w ϓϩμΫτ։ൃ͕޷͖
   w -BSBWFM3FBDU0,3
   

   View Slide

3. ຊ೔ͷ಺༰
   w (SBQI2-ΛͳΜͱͳ͘͸஌ͬͯΔঢ়ଶ͔Βͪΐͬͱ࢖ͬͯ
   ݟ͍ͨͳͱࢥ͑ΔΑ͏ͳ಺༰
   w ࡉ͔͍࢓༷ͷઆ໌͸͠ͳ͍ͷͰɺڵຯ͋Δํ͸

   ผ్ௐ΂ͯͶʂʂ
   w ࠓճ͋·Γઆ໌͠ͳ͍΋ͷ

   ϖʔδωʔγϣϯ &EHFͱ/PEF
   

   

   View Slide

4. (SBQI2-ͱ͸ʁ
   

   View Slide

5. ʮεΩʔϚʯͷఆٛʹैͬͯɺΫϥΠΞϯτଆ͕ཉ͍͠৘ใΛ
   ʮΫΤϦʔʯͷܗࣜͰ౉͢
   ΫΤϦʔ
   HSBQIRM
   جຊతʹ"1*ͷड͚ޱ͸ͻͱͭʂ
   

   View Slide

6. 4DIFNBͱ͸ʁ
   w ͲͷσʔλΛ΍ΓͱΓ͢Δ͔
   ͷ಺༰ΛܾΊΔ #BDLFOEଆ
   
   w ϑϩϯτΤϯυͱόοΫΤϯ
   υͷܖ໿
   type Query {
   hero: Hero
   }
   type Hero {
   name: String
   friends: [Friend]
   }
   type Friend {
   name: String
   age: Int
   address: String
   }
   ༧໿ޠʂSPVUFͷఆٛΈ͍ͨͳ΋Μ
   ಠࣗͷܕΛఆٛͰ͖Δ
   ෳ਺ฦ͢৔߹͕͋Δ৔߹͸഑ྻʹ͢Δ
   

   View Slide

7. 2VFSZͱ͸ʁ
   w (FUϝιουͷ࣌ར༻
   w ཉ͍͠σʔλ͚ͩهड़͢Ε͹
   ͦΕ͕ฦͬͯ͘Δ
   {
   hero {
   name
   friends {
   name
   }
   }
   }
   ཉ͍͠ΦϒδΣΫτͷ
   ϑΟʔϧυ໊Λॻ͘
   {
   hero(id: 1) {
   name
   friends {
   name
   }
   }
   } ˞εΩʔϚ͸มߋ͢Δඞཁ͋Γ
   ৚݅Λࢦఆ͢Δ͜ͱ΋Ͱ͖Δ
   

   View Slide

8. .VUBUJPOͱ͸ʁ
   extend type Mutation {
   createClientAccount(
   client_id: Int @rules(apply: ["required"])
   staff_name: String @rules(apply: ["required"])
   tel: String @rules(apply: ["required"])
   department: String @rules(apply: ["required"])
   email: String @rules(apply: ["required"])
   password: String @rules(apply: ["required"])
   role: Int @rules(apply: ["required"])
   ): ClientAccount @create(model: "App\\Models\\ClientAccount")
   }
   w 1045165%&-&5&ϝιουͷ࣌ར༻
   w
   ༧໿ޠ
   ϝιου ܕͱόϦσʔγϣϯ

   Λࢦఆ -BSBWFM
   
   

   View Slide

9. *OQVUͱ͸ʁ
   extend type Mutation {
   createClientAccount2(input: CreateClientAccount): ClientAccount

   @create(model: "App\\Models\\ClientAccount", flatten: true)
   }
   input CreateClientAccount {
   client_id: Int @rules(apply: ["required"])
   staff_name: String @rules(apply: ["required"])
   tel: String @rules(apply: ["required"])
   department: String @rules(apply: ["required"])
   email: String @rules(apply: ["required"])
   password: String @rules(apply: ["required"])
   role: Int @rules(apply: ["required"])
   }
   w .VUBUJPOͳͲͰར༻͢Δೖྗ஋Λ0CKFDUʹ·ͱΊΔ
   

   View Slide

10. &EHFͱ/PEF
    type InfluencerSearchPage implements Page {
    paginatorInfo: PaginatorInfo
    edges: [InfluencerSearchEdge]
    }
    type InfluencerSearchEdge implements Edge {
    cursor: ID!
    node: InfluencerSearchNode
    }
    w ϖʔδωʔγϣϯ࣌ʹ&EHFͱ/PEFͷ֓೦Λར༻
    w &EHF͸/PEFΛ΋ͪɺ/PEF͸$VSTPSΛ࣋ͭ
    

    View Slide

11. ࣮ࡍͷσʔλͷσϞ
    

    View Slide

12. -BSBWFMͰͷ࣮૷
    

    View Slide

13. ϥΠϒϥϦͷબఆ
    w ࠓճ͸-JHIUIPVTFΛར༻

    IUUQTHJUIVCDPNOVXBWFMJHIUIPVTF
    
    w (SBQI2-ϥΠΫʹεΩʔϚ͕ఆٛͰ͖Δ
    w طଘͷΞʔΩςΫνϟͰ΋͙͢ʹऔΓೖΕΒΕΔ
    

    View Slide

14. ΞʔΩςΫνϟ
    ɾεΩʔϚͷఆٛ
    ɾड͚ޱͷ४උ
    ɾόϦσʔγϣϯ
    มߋલ มߋޙ
    

    View Slide

15. εΩʔϚͷஔ͖৔ॴ
    w SPVUFTHSBQIRMʹఆٛ
    w ड͚ޱ͝ͱʹ༻ҙ͢Δ΄͏
    ͕Αͦ͞͏
    

    View Slide

16. εΩʔϚͷఆٛ
    extend type Query @group(middleware: ["auth:api"]) {
    client_account(id: ID @eq):
    ClientAccount @find(model: "App\\Models\\ClientAccount")
    client_accounts: [ClientAccount!]! @all
    }
    type ClientAccount {
    id: ID!
    client_id: Int!
    staff_name: String!
    tel: String!
    department: String!
    email: String!
    role: Int!
    created_at: DateTime!
    updated_at: DateTime!
    }
    ϛυϧ΢ΣΞ͕࢖͑Δ
    Ϟσϧͦͷ··࢖͏ͳΒ͜͜ͰఆٛͰ͖Δ
    

    View Slide

17. ಠࣗͷఆٛ
    extend type Query @group(middleware: ["auth:api"]) {
    fetchProjects: [PrProject!]!
    }
    type PrProject {
    id: ID!
    item_id: Int!
    project_type: Int!
    name: String!
    media_type: Int!
    item_detail: String!
    item_image: String!
    hash_tags: String
    }
    .PEFMTʹఆ͕ٛͳ͍΋ͷ
    

    View Slide

18. 6TF$BTF͔Βͷฦ٫
    namespace App\Http\GraphQL\Queries;
    use App\Domains\UseCases\FetchProjectList;
    use GraphQL\Type\Definition\ResolveInfo;
    use Nuwave\Lighthouse\Support\Contracts\GraphQLContext;
    class FetchProjects extends BaseQuery
    {
    public function resolve($rootValue,
    array $args,
    GraphQLContext $context = null,
    ResolveInfo $resolveInfo)
    {
    $usecase = app(FetchProjectList::class);
    return $usecase($this->client_id);
    }
    }
    Ϩεϙϯεͷத਎͸ܕʹม׵͞ΕΔ
    

    View Slide

19. 3FBDUͰͷ࣮૷
    

    View Slide

20. ϥΠϒϥϦͷબఆ
    w ࠓճ͸3FBDU"QPMMPΛར༻

    IUUQTHJUIVCDPNBQPMMPHSBQIRMSFBDUBQPMMP
    
    w 'BDFCPPL͕ग़͍ͯ͠ΔެࣜͷϥΠϒϥϦ3FMBZΑΓɺ

    Θ͔Γ΍ͦ͢͏ͳͷͰબ୒
    

    View Slide

21. ΞʔΩςΫνϟ
    "QPMMP͕৭ʑ΍ͬͯ͘ΕΔͨΊɺҎલΑΓؔ࿈͢Δॲཧ͕ඞཁͳ͍
    

    View Slide

22. ΫΤϦʔͷఆٛ
    const GET_SEARCH_INFLUENCER = gql`
    query ($page: Int!, $name: String){
    query_search_influencers(page: $page, influencer_name: $name) {
    paginatorInfo {
    total
    count
    currentPage
    }
    edges {
    node {
    id
    influencer_name
    instagram_posts {
    id
    code
    comment_count
    is_video
    date
    }
    }
    }
    }
    }
    `;
    

    View Slide

23. ΫΤϦʔͷൃߦ
    render() {
    return (
    
    query={GET_SEARCH_INFLUENCER}
    variables={{
    page: 1,
    name: "ా"
    }}
    >
    {({ data, error, loading, client, refetch }) => {
    if (error) return {error.toString()};
    let pageInfo, graphData, dataElms;
    if (!loading) {
    pageInfo = data.query_search_influencers.paginatorInfo;
    graphData = data.query_search_influencers.edges;
    dataElms = graphData && graphData.map((v) => {
    let data = v.node;
    return (
    {data.influencer_name}
    );
    });
    }
    return (
    
    . . .
    2VFSZλά಺ͰΫΤϦʔΛൃߦͰ͖Δ
    Ϩεϙϯεσʔλ͕དྷΔͷͰ

    ͍ͭ΋௨Γͷॲཧ
    

    View Slide

24. Α͔ͬͨࣄ
    

    View Slide

25. εΩʔϚத৺։ൃ
    w εΩʔϚΛڞ௨ݴޠͱ͠ɺϑϩϯτΤϯυͱόοΫΤϯυ
    Ͱ࢓༷ͷڞ௨Խ͕௙Γͦ͏
    w Ҏલ͔Β4XBHHFSΛ࢖͍͕ͬͯͨɺඞਢͷमਖ਼Ͱ͸ͳ͍ͨ
    Ί์ஔؾຯʹͳ͍ͬͯͨ
    w ૹͬͯ͸͍͚ͳ͍ΧϥϜͷνΣοΫ΋༰қʹͳΓͦ͏
    

    View Slide

26. ཉ͍͠৘ใΛཉ͍࣌͠ʹ
    w ϑϩϯτΤϯυ΋৘ใ͕গͳ͘ͳخ͍͠
    w αʔόʔαΠυ΋৘ใ͕গͳ͘ͳΓخ͍͠
    w Ϣʔβʔʢϒϥ΢βʣ΋৘ใ͕গͳ͘ͳΓخ͍͠
    

    View Slide

27. ͦͷଞ
    w QMBZHSPVOE͕ਆπʔϧ
    w -JHIUIPVTF͚ͩͰݟΕ͹։ൃ͸׆ൃ
    

    View Slide

28. ՝୊
    

    View Slide

29. ॲཧ଎౓ͷ໰୊
    w όοΫΤϯυ͸-JHIUIPVTFͷม׵ʹΑΓɺdNT஗
    ͘ͳΔ
    w ϑϩϯτଆ͸ࠓͷͱ͜Ζ͸໰୊ͳͦ͞͏
    

    View Slide

30. ॲཧ଎౓ͷվળํ๏
    w εέʔϧΞοϓ

    ຊ൪ͱಉ͡؀ڥͰ͸·ͩࢼͯ͠ͳ͍ͷͰͦͷ··ɾɾ
    w ϥΠϒϥϦͷมߋ

    -BSBWFMͱ૬ੑ͍͍΍ͭ୳͢ͷେมͳͷͰ-JHIUIPVTFͷ·
    ·͕͍͍ɾɾ
    w ଞͷϛυϧ΢ΣΞͰվળ

    (SBQI2-ʹ͠ͳ͍৔߹Ͱ΋༗ޮͳͨΊͪ͜ΒͨΊ͢
    

    View Slide

31. վળᾇ
    &MBTUJD4FBSDI
    ࣮ࡍʹࢼͯ͠ݟͨ
    ɾdNTૣ͘ͳͬͨ
    ɾӡ༻͕େม͚ͩͲɺΑͦ͞͏
    

    View Slide

32. վળᾈ
    7BSOJTI
    7BSOJTIΛೖΕΔ
    ɾϨεϙϯεࣗମΛશͯΩϟογϡ༧ఆ
    ɾ"VUIपΓͷઃఆ͚ͩؾΛ͚ͭΔ
    ɾ̍ճ໨Ωϟογϡ͞ΕΔਓҎ֎͸͓ͦΒ͘ɺ
    ̍̌෼ͷ̍Ҏ্͸ૣ͘ͳΔͱ༧૝
    

    View Slide

33. վળᾉ
    "QBDI*HOJUF
    "QBDIF*HOJUFΛೖΕΔ
    ɾσʔλϕʔεࣗମΛ෼ࢄΩϟογϡ͢Δ
    ɾޮՌ͸͋Γͦ͏ͩ͠ɺ

    ɹ&4ΑΓӡ༻͠΍ͦ͢͏ʁ
    

    View Slide