Upgrade to Pro — share decks privately, control downloads, hide ads and more …

GraphQL and Schema-First Development

GraphQL and Schema-First Development

GraphQL NightでのLT発表資料です

Kōhei Yamamoto

June 28, 2018
Tweet

More Decks by Kōhei Yamamoto

Other Decks in Technology

Transcript

  1. ,ōIFJ:BNBNPUP!LZNNU
    (SBQI2-φΠτ-5
    (SBQI2-ͱ
    εΩʔϚϑΝʔετ։ൃ

    View full-size slide

  2. (.0ϖύϘΧϥʔϛʔϦϐʔτCMPHLZNNUDPN
    ,ōhei Yamamoto /!LZNNU
    SVCZSBJMTZPLPIBNBSC

    View full-size slide

  3. ͋ΒͨΊͯ঺հ͠·͢

    View full-size slide

  4. εΩʔϚϑΝʔετ։ൃ
    wϑϩϯτΤϯυ '&
    ͱόοΫΤϯυ #&
    ؒͷ

    ΠϯλʔϑΣʔεఆٛΛ։ൃνʔϜ಺ͰઌʹܾΊΔ
    wͦͷ͋ͱ'&#&ʹ෼͔Εͯฒߦ։ൃ͢Δ

    View full-size slide

  5. ฒߦ։ൃ
    w'&͸#&ͷ࣮૷͕ऴΘΔ·ͰϞοΫαʔόΛ࢖ͬͨΓ
    ͢Δ
    w3&45ͷ৔߹
    w0QFO"1* 4XBHHFS
    ͰઌʹΠϯλϑΣʔεΛॻ͘
    wपลπʔϧ 4XBHHFS$PEFHFOͳͲ
    Λ࢖ͬͯ

    ϞοΫαʔόΛ࡞Δ

    View full-size slide

  6. ΠϯλʔϑΣʔεఆٛྫ 0QFO"1*ͷ৔߹

    paths:
    /pets/{petId}:
    get:
    parameters:
    - name: petId
    in: path
    required: true
    schema:
    type: string
    responses:
    '200':
    content:
    application/json:
    schema:
    required:
    - id
    - name
    properties:
    id:
    type: integer
    format: int64
    name:
    type: string
    (&5QFUTQFU@JE

    View full-size slide

  7. ΧϥʔϛʔϦϐʔτ͸
    εΩʔϚϑΝʔετ։ൃ͍ͯ͠·͢
    '&7VFKT #&3BJMT

    View full-size slide

  8. (SBQI2-ͰεΩʔϚϑΝʔετ։ൃ
    w3&45"1*ͰεΩʔϚΛܾΊ͔ͯΒ'&ͱ#&Ͱ

    ฒߦ։ൃΛਐΊΔͷ͸ศརͩͬͨ
    wҰ෦(SBQI2-Λಋೖͯ͠Έ͍ͯΔ
    w3BJMTͳͷͰHSBQIRMSVCZ
    w(SBQI2-Ͱ΋ಉ͡Α͏ʹͰ͖ͳ͍͔ʁ

    View full-size slide

  9. (SBQI2-ʹ͓͚ΔεΩʔϚϑΝʔετͱ͸
    wεΩʔϚ͚ͩઌʹܾΊΔ
    w#&͸SFTPMWFSΛ͋ͱͰ࣮૷͢Δ
    w'&͕࢖͏ϞοΫαʔό͸Ͳ͏͢Δʁ

    View full-size slide

  10. "QPMMPͱHSBQIRMSVCZΛ

    ૊Έ߹ΘͤͯϞοΫαʔόΛ࡞ΕΔ

    View full-size slide

  11. HSBQIRMSVCZ
    w3VCZͷγϯλοΫεͰ(SBQI2-εΩʔϚΛॻ͘
    w(SBQI2-ͷεΩʔϚΛμϯϓͰ͖Δ

    View full-size slide

  12. 3VCZͰεΩʔϚΛॻ͘
    class Types::QueryType < Types::BaseObject
    field :viewer, Types::UserType, null: true # resolverΛॻ͍ͯͳ͍ʂ
    end
    class Types::UserType < Types::BaseObject
    field :email, String, null: true
    field :popularPosts, [Types::PostType], null: true # resolverΛॻ͍ͯͳ͍ʂ
    end
    class Types::PostType < Types::BaseObject
    field :title, String, null: true
    end

    View full-size slide

  13. HSBQIRMSVCZͰεΩʔϚΛμϯϓ
    FooBarSchema.to_definition # ҎԼͷจࣈྻΛऔಘ͢Δ
    type Query {
    viewer: User
    }
    type User {
    email: String
    popularPosts: [Post!]
    }
    type Post {
    title: String
    }

    View full-size slide

  14. "QPMMP
    w"QPMMPͷ(SBQI2-5PPMTΛ࢖͏
    w.PDLJOHͱ͍͏ػೳ͕͋Δ
    w(SBQI2-ͷεΩʔϚΛ৯ΘͤΔͱϞοΫαʔό͕

    ࡞ΕΔ

    View full-size slide

  15. (SBQI2-5PPMTͰϞοΫαʔό
    // express, graphql-express, body-parserͳͲΛrequire
    import { addMockFunctionsToSchema, makeExecutableSchema } = require('graphql-tools');
    const schema = makeExecutableSchema({ /* μϯϓͨ͠εΩʔϚจࣈྻ */ });
    const mocks = require('./mocks')
    addMockFunctionsToSchema({ schema, mocks });
    const app = express();
    app.use('/graphql', bodyParser.json(), graphqlExpress({ schema }));
    app.listen(3000, () => { console.log('GraphQL mock server is running!!1'); });

    View full-size slide

  16. (SBQI2-5PPMTͰϞοΫαʔό
    // mocks.js
    module.exports = {
    User: () => ({
    email: '[email protected]',
    }),
    Post: () => ({
    title: 'The Awesome Post',
    }),
    };
    ϞοΫαʔό͕ฦ͢μϛʔσʔλΛॻ͚Δ
    ࢦఆ͠ͳ͚Ε͹εΧϥʔܕͷ஋͸"QPMMP͕
    ద౰ʹฦ͢

    View full-size slide

  17. ϞοΫαʔόͷ1045HSBQIRMΛୟ͍༷ͨࢠ

    View full-size slide

  18. "QPMMPͱHSBQIRMSVCZΛ

    ૊Έ߹ΘͤͯϞοΫαʔόΛ࡞Εͨ

    View full-size slide

  19. εΩʔϚϑΝʔετ։ൃͰ͖Δʂ

    ศརʂʂ

    View full-size slide

  20. ৄ͘͠͸ͪ͜ΒͰ
    HJUIVCDPNLZNNUTDIFNBpSTUHSBQIRMFYBNQMF

    View full-size slide

  21. ࢀߟ
    wIUUQCMPHLZNNUDPNFOUSZNPDLJOHHSBQIRMTFSWFSXJUI
    SBJMTBOEBQPMMP
    wIUUQTXXXBQPMMPHSBQIRMDPNEPDTHSBQIRMUPPMT
    NPDLJOHIUNM

    View full-size slide